:root{
  /* 方向 A：航图 / Boarding —— 象牙纸 + 深海军蓝 + 琥珀 */
  --h:215;
  --bg:#f6f1e7;
  --bg-2:#efe8d9;
  --surface:#fffdf8;
  --surface-2:#fbf7ee;
  --surface-3:#f3ecdf;
  --line:rgba(18,40,75,.14);
  --line-2:rgba(18,40,75,.26);

  --ink:#12284b;
  --ink-2:#55617a;
  --ink-3:#7b8496;

  --brand:#12284b;
  --brand-strong:#0d1f3c;
  --brand-soft:#f6e3c2;
  --brand-line:rgba(18,40,75,.22);
  --accent:#e8a33d;
  --accent-deep:#a8660f;
  --success:#2f7d5d;
  --success-soft:#e3f1e9;
  --danger:#b8382f;
  --danger-soft:#fbe7e4;

  --r-sm:4px; --r-md:12px; --r-lg:12px; --r-xl:16px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(18,40,75,.05);
  --sh-2:0 2px 6px rgba(18,40,75,.08);
  --sh-3:0 8px 24px rgba(18,40,75,.16);
  --sh-4:0 16px 48px rgba(18,40,75,.18);

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",system-ui,"Segoe UI",sans-serif;
  --font-serif:Georgia,"Times New Roman","Songti SC","SimSun",serif;
}
[data-theme="light"]{
  --bg:#f6f1e7; --bg-2:#efe8d9; --surface:#fffdf8; --surface-2:#fbf7ee; --surface-3:#f3ecdf;
  --line:rgba(18,40,75,.14); --line-2:rgba(18,40,75,.26);
  --ink:#12284b; --ink-2:#55617a; --ink-3:#7b8496;
  --brand:#12284b; --brand-strong:#0d1f3c; --brand-soft:#f6e3c2; --brand-line:rgba(18,40,75,.22);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--font);background:var(--bg);color:var(--ink);
  -webkit-font-smoothing:antialiased;min-height:100dvh;
  -webkit-tap-highlight-color:transparent;
}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit;padding:0}
input,textarea,select{font-family:inherit;color:inherit}
a{color:inherit;text-decoration:none}
.num{font-variant-numeric:tabular-nums;font-family:var(--font-serif)}
::-webkit-scrollbar{width:0;height:0}

/* ---------- 澶栧３ ---------- */
.app{width:100%;max-width:560px;margin:0 auto;min-height:100dvh;background:var(--bg);position:relative;overflow-x:hidden}
@media(min-width:640px){
  body{background:var(--bg-2);padding:24px 0}
  .app{min-height:calc(100dvh - 48px);border-radius:28px;overflow:hidden;box-shadow:var(--sh-4);border:1px solid var(--line)}
}

/* 椤舵爮 */
.topbar{
  position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:var(--sp-2);
  padding:12px var(--sp-4);background:color-mix(in srgb,var(--bg) 86%,transparent);
  backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .2s;
}
.topbar.scrolled{border-bottom-color:var(--line)}
.topbar .burger,.topbar .topbar-back{width:40px;height:40px;border-radius:var(--r-md);display:grid;place-items:center;color:var(--ink-2);flex:none}
.topbar .burger svg,.topbar .topbar-back svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.topbar .burger:active{background:var(--surface-2)}
.search{
  flex:1;min-width:0;height:40px;border-radius:var(--r-pill);
  background:var(--surface);border:1px solid var(--line);
  display:flex;align-items:center;gap:8px;padding:0 14px;color:var(--ink-3);font-size:13px;
}
.search svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8}
.top-actions{display:flex;align-items:center;gap:2px}
.tbtn{width:36px;height:36px;border-radius:var(--r-md);display:grid;place-items:center;color:var(--ink-2);position:relative}
.tbtn svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tbtn:active{background:var(--surface-2)}
.tbtn .dot{position:absolute;top:7px;right:7px;width:6px;height:6px;border-radius:50%;background:var(--danger)}
.avatar-sm{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--brand),hsl(calc(var(--h) + 40),80%,60%));display:grid;place-items:center;font-size:12px;font-weight:600;color:#fffdf8}

/* 鍐呭 */
.screen{padding:var(--sp-4);padding-bottom:110px;animation:fade .22s ease-out}
/* 只动透明度：transform 会让 position:fixed 子元素（下一句按钮）以 .screen 为包含块而跳动 */
@keyframes fade{from{opacity:0}to{opacity:1}}
.screen.no-tab{padding-bottom:var(--sp-6);display:flex;flex-direction:column;min-height:calc(100dvh - 68px)}
.screen.with-rail{padding-right:16px}

/* ---------- 鎶藉眽 ---------- */
.mask{position:fixed;inset:0;background:rgba(18,40,75,.16);z-index:60;opacity:0;pointer-events:none;transition:opacity .28s ease}
.mask.show{opacity:1;pointer-events:auto}
.drawer{
  position:fixed;top:0;bottom:0;left:0;width:min(78vw,340px);z-index:70;
  background:var(--bg-2);border-right:1px solid var(--line);
  transform:translateX(-102%);transition:transform .3s cubic-bezier(.32,.72,0,1);
  display:flex;flex-direction:column;padding:18px 0 16px;overflow-y:auto;
}
.drawer.show{transform:none}
.drawer .u{display:flex;align-items:center;gap:12px;padding:6px 20px 18px}
.drawer .u .av{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,hsl(var(--h),80%,62%),hsl(calc(var(--h) + 50),80%,60%));display:grid;place-items:center;font-size:18px;font-weight:600;color:#fffdf8}
.drawer .u .n{font-size:15px;font-weight:600}
.drawer .remain{margin-top:6px;display:inline-block;font-size:11px;color:var(--brand);border:1px solid var(--brand-line);border-radius:6px;padding:2px 8px;font-variant-numeric:tabular-nums}
.dnav{padding:4px 12px}
.ditem{display:flex;align-items:center;gap:14px;height:52px;padding:0 12px;border-radius:var(--r-md);color:var(--ink);font-size:15px;width:100%;text-align:left;transition:background .15s}
.ditem svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none;opacity:.86}
.ditem:active{background:var(--surface-2)}
.ditem.on{background:var(--brand-soft);color:var(--brand)}
.ditem.partner{color:hsl(var(--h),80%,74%)}
.ditem .badge{margin-left:auto;font-size:10px;padding:2px 7px;border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand)}
.dsep{height:1px;background:var(--line);margin:8px 24px}
.dfooter{margin-top:auto;padding:12px 12px 0}
.dfooter .box{border:1px solid var(--line-2);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;gap:8px;height:48px;color:var(--ink-2);font-size:14px}
.dfooter .box svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7}

/* 鍙充晶鎮诞 */
.rail{position:fixed;right:6px;bottom:104px;z-index:35;display:flex;flex-direction:column;gap:8px}
.rail.r1,.rail.r2{top:auto}
.rail button{width:34px;height:34px;border-radius:50%;border:1px solid rgba(18,40,75,.16);background:rgba(20,20,35,.92);color:#fffdf8;font-size:10px;line-height:1.1;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:0 4px 14px rgba(18,40,75,.12);backdrop-filter:blur(6px)}
.rail button.gold{background:linear-gradient(180deg,hsl(220,70%,50%),hsl(242,72%,44%))}

/* ---------- 閫氱敤鍧?---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-4)}
.card + .card{margin-top:var(--sp-3)}
.sec-h{display:flex;align-items:center;justify-content:space-between;margin:var(--sp-5) 0 var(--sp-3)}
.sec-h h2{font-size:16px;font-weight:600;margin:0;letter-spacing:-.01em}
.sec-h .more{font-size:12px;color:var(--ink-3)}
.muted{color:var(--ink-3)}
.tiny{font-size:11px}

/* 鍖洪棿鍒囨崲 */
.seg{display:flex;gap:var(--sp-4);padding:2px 0 var(--sp-3);overflow-x:auto}
.seg button{font-size:14px;color:var(--ink-3);position:relative;padding:6px 0;white-space:nowrap}
.seg button.on{color:var(--ink);font-weight:600}
.seg button.on::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:18px;height:2px;border-radius:2px;background:var(--brand)}

/* 棣栭〉缁熻 */
.stat-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.stat-big{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-4);position:relative;overflow:hidden}
.stat-big .lbl{font-size:13px;color:var(--ink-2);margin-bottom:10px}
.stat-big .val{font-size:30px;font-weight:700;line-height:1;letter-spacing:-.02em}
.stat-big .val small{font-size:12px;font-weight:500;color:var(--ink-3);margin-left:4px}
.stat-big .ic{position:absolute;right:14px;top:14px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:16px;font-weight:700;color:#fffdf8;
  background:linear-gradient(140deg,hsl(var(--h),70%,58%),hsl(calc(var(--h) + 40),72%,52%))}
.stat-big .ic.alt{background:linear-gradient(140deg,hsl(calc(var(--h) + 60),70%,56%),hsl(calc(var(--h) + 110),68%,50%));font-size:18px}

.wrong-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-3)}
.wrong-col{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-4)}
.wrong-col .t{font-size:13px;color:var(--ink-2);display:flex;justify-content:space-between}
.wrong-col .big{font-size:26px;font-weight:700;margin:6px 0 14px;letter-spacing:-.02em}
.wrong-col .row{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3);padding:7px 0;border-top:1px solid var(--line)}
.wrong-col .row b{color:var(--ink);font-weight:600}

.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-3)}
.mini{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--sp-4)}
.mini .t{font-size:12px;color:var(--ink-3);margin-bottom:8px}
.mini .v{font-size:20px;font-weight:700;letter-spacing:-.01em}
.mini .v small{font-size:11px;color:var(--ink-3);font-weight:400;margin-left:2px}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:12px}
.cal span{height:30px;border-radius:var(--r-sm);background:var(--surface-2);display:grid;place-items:center;font-size:11px;color:var(--ink-3)}
.cal span.on{background:var(--brand-soft);color:var(--brand);font-weight:600}

.rank-mini .item{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line)}
.rank-mini .item:first-child{border-top:0}
.rank-mini .no{width:20px;font-size:12px;color:var(--ink-3);font-weight:600}
.rank-mini .no.top{color:var(--accent)}
.rank-mini .nm{flex:1;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-mini .tm{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}

/* 璇剧▼鍗?*/
.course{display:flex;gap:var(--sp-3);align-items:center;padding:var(--sp-3);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);width:100%;text-align:left;transition:transform .12s,background .15s}
.course + .course{margin-top:var(--sp-2)}
.course:active{transform:scale(.995);background:var(--surface-2)}
.cover{width:64px;height:64px;border-radius:var(--r-md);flex:none;display:grid;place-items:center;font-size:28px;border:1px solid var(--line)}
.cover.c0{background:linear-gradient(140deg,hsl(260,44%,20%),hsl(280,40%,15%))}
.cover.c1{background:linear-gradient(140deg,hsl(32,50%,20%),hsl(20,46%,15%))}
.cover.c2{background:linear-gradient(140deg,hsl(200,46%,20%),hsl(220,44%,15%))}
.course .meta{flex:1;min-width:0}
.course .t{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px}
.course .en{font-size:11px;color:var(--ink-3);margin:2px 0 6px}
.course .bar{height:4px;border-radius:2px;background:var(--surface-3);overflow:hidden}
.course .bar > i{display:block;height:100%;background:var(--brand);border-radius:2px}

/* 鏍囩 */
.tag{display:inline-flex;align-items:center;font-size:10px;font-weight:500;padding:2px 7px;border-radius:var(--r-pill);background:var(--surface-3);color:var(--ink-2);line-height:1.5}
.tag.b{background:var(--brand-soft);color:var(--brand)}
.tag.ok{background:var(--success-soft);color:var(--success)}
.tag.gold{background:hsl(38,60%,16%);color:var(--accent)}
.tag.red{background:var(--danger-soft);color:var(--danger)}

/* 鎸夐挳 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border-radius:var(--r-md);font-size:15px;font-weight:600;color:#fffdf8;background:var(--brand-strong);width:100%;transition:transform .12s,opacity .15s}
.btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.4;pointer-events:none}
.btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn.ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line-2)}
.btn.soft{background:var(--brand-soft);color:var(--brand);border:1px solid var(--brand-line)}
.btn.sm{height:38px;font-size:13px;padding:0 14px;width:auto}
.btn.line{background:transparent;border:1px solid var(--line-2);color:var(--ink-2)}

.input{width:100%;height:46px;padding:0 14px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface-2);font-size:15px;color:var(--ink)}
.input:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px hsl(var(--h) 80% 60% / .16)}
textarea.input{height:auto;padding:12px 14px;line-height:1.6;resize:vertical}

.row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px}
.row:last-child{border-bottom:0}
.row .sub{font-size:12px;color:var(--ink-3);margin-top:3px}

.empty{text-align:center;padding:40px 16px;color:var(--ink-3)}
.empty .e{font-size:34px;margin-bottom:10px;opacity:.9}
.empty p{margin:0;font-size:13px;line-height:1.7}

/* ---------- 缁冧範 ---------- */
.p-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-bottom:12px}
.p-head > .idx:first-child{order:1;white-space:nowrap}
.p-head > .timer, .p-head > #pTimer{order:2;white-space:nowrap}
.p-head > .idx[style*="margin-left:auto"]{order:3;margin-left:auto !important;white-space:nowrap;font-size:11px}
.p-head > [data-rate-cycle]{order:4;min-width:44px !important;height:30px;padding:0 8px !important;font-size:12px}
.p-head > .p-modes{order:5;flex:1 0 100%;margin:2px 0 0 !important;display:flex;gap:8px}
.p-head > .p-modes .pm{flex:1;justify-content:center}

.p-head .idx{font-size:12px;color:var(--ink-3)}
.p-head .idx b{color:var(--ink);font-size:15px}
.p-bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden;margin-bottom:22px}
.p-bar > i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),hsl(calc(var(--h) + 40),80%,64%));border-radius:3px;transition:width .4s cubic-bezier(.4,0,.2,1)}
.zh{font-size:23px;font-weight:600;line-height:1.45;margin:0 0 6px;letter-spacing:-.01em}
.zh-hint{font-size:12px;color:var(--ink-3);margin-bottom:18px}
.answer{min-height:92px;border-radius:var(--r-lg);border:1.5px dashed var(--line-2);background:var(--surface);padding:12px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;transition:border-color .15s,background .15s}
.answer.filled{border-style:solid;border-color:var(--brand-line)}
.answer.right{border-color:var(--success);background:var(--success-soft)}
.answer.wrong{border-color:var(--danger);background:var(--danger-soft);animation:shake .32s}
@keyframes shake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(2px)}30%,50%,70%{transform:translateX(-3px)}40%,60%{transform:translateX(3px)}}
.answer .ph{color:var(--ink-3);font-size:13px;line-height:2.6;padding-left:6px}
.pool{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{min-height:44px;padding:0 16px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);font-size:15px;font-weight:500;color:var(--ink);display:inline-flex;align-items:center;transition:transform .12s,border-color .15s,opacity .15s}
.chip:active{transform:scale(.96)}
.chip.used{opacity:.24;pointer-events:none}
.chip.in-answer{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand)}
.chip.in-answer.ok{background:var(--success-soft);border-color:var(--success);color:var(--success)}
.chip.in-answer.bad{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
.feedback{margin-top:12px;border-radius:var(--r-md);padding:12px 14px;font-size:13px;line-height:1.6;display:none}
.feedback.show{display:flex;flex-wrap:wrap;align-items:center;gap:6px;animation:fade .2s}
.feedback.ok{background:var(--success-soft);color:var(--success)}
.feedback.bad{background:var(--danger-soft);color:hsl(356,70%,72%)}
.feedback .fi{display:inline-flex}
.feedback .fi svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.feedback .parts{display:flex;flex-wrap:wrap;gap:6px;width:100%;margin-top:2px}
.feedback .parts span{font-size:11px;padding:2px 8px;border-radius:6px;background:rgba(18,40,75,.07);font-weight:500}
.p-tools{display:flex;gap:8px;margin-top:12px}
.p-tools .btn{flex:1;width:auto}
.p-foot{position:sticky;bottom:0;z-index:5;margin-top:16px;padding:12px 0 calc(8px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 62%,transparent)}

/* ---------- 浼氬憳 ---------- */
.price-card{position:relative;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--surface);padding:16px;margin-top:12px;overflow:hidden}
.price-card.hot{border-color:var(--brand-line);background:linear-gradient(160deg,hsl(var(--h),44%,15%),var(--surface))}
.price-card .top{display:flex;align-items:baseline;justify-content:space-between}
.price-card .nm{font-size:15px;font-weight:600}
.price-card .pr{font-size:26px;font-weight:700;letter-spacing:-.02em}
.price-card .pr small{font-size:12px;font-weight:400;color:var(--ink-3)}
.price-card .strike{font-size:12px;color:var(--ink-3);text-decoration:line-through;margin-left:6px}
.price-card .perks{margin:12px 0;display:grid;gap:7px}
.price-card .perk{font-size:12px;color:var(--ink-2);display:flex;gap:7px;line-height:1.6}
.price-card .perk .c{color:var(--success)}
.price-card .ribbon{position:absolute;right:-30px;top:12px;transform:rotate(38deg);background:var(--accent);color:#241a00;font-size:10px;font-weight:700;padding:3px 34px}

.hermes{border-radius:var(--r-xl);padding:20px;background:
  radial-gradient(420px 200px at 90% -10%,rgba(18,40,75,.18),transparent 60%),
  linear-gradient(150deg,hsl(var(--h),64%,42%),hsl(calc(var(--h) + 40),66%,34%));
  color:#fffdf8;position:relative;overflow:hidden}
.hermes .k{font-size:12px;opacity:.85}
.hermes .p{font-size:34px;font-weight:700;letter-spacing:-.02em;margin:4px 0 8px}
.hermes .p small{font-size:13px;font-weight:400;opacity:.8;margin-left:4px}
.hermes .s{font-size:12px;opacity:.8;text-decoration:line-through}
.hermes .bar{height:8px;border-radius:4px;background:rgba(18,40,75,.25);overflow:hidden;margin-top:14px}
.hermes .bar > i{display:block;height:100%;background:#fffdf8;border-radius:4px}

/* ---------- PK ---------- */
.pk-head{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.pk-head .x{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:12px 8px;text-align:center}
.pk-head .x b{display:block;font-size:20px;font-weight:700}
.pk-head .x span{font-size:11px;color:var(--ink-3)}
.room{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);margin-bottom:8px}
.room .av{width:40px;height:40px;border-radius:50%;background:var(--surface-3);display:grid;place-items:center;font-size:15px}
.room .m{flex:1;min-width:0}
.room .m .t{font-size:13px;font-weight:600}
.room .m .s{font-size:11px;color:var(--ink-3);margin-top:2px}

/* ---------- AI 瀵硅瘽 ---------- */
.chat{display:flex;flex-direction:column;gap:10px;padding-bottom:8px}
.bubble{max-width:82%;padding:11px 14px;border-radius:14px;font-size:14px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.bubble.ai{background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px;align-self:flex-start}
.bubble.me{background:var(--brand-strong);color:#fffdf8;border-bottom-right-radius:4px;align-self:flex-end}
.bubble .tip{margin-top:8px;padding-top:7px;border-top:1px solid var(--line);font-size:11px;color:var(--ink-3)}
.chat-input{position:sticky;bottom:0;display:flex;gap:8px;padding:12px 0;background:linear-gradient(to top,var(--bg) 60%,transparent)}
.scn{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scn button{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px;text-align:left}
.scn button .e{font-size:20px}
.scn button .t{font-size:13px;font-weight:600;margin-top:6px}
.scn button .d{font-size:11px;color:var(--ink-3);margin-top:2px}

/* ---------- 鍏跺畠 ---------- */
.avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--brand),hsl(calc(var(--h) + 40),80%,60%));display:grid;place-items:center;font-size:20px;font-weight:600;color:#fffdf8}
.bar-legend{display:flex;gap:10px;font-size:11px;color:var(--ink-3);margin-top:10px}
.bar-legend i{width:8px;height:8px;border-radius:2px;display:inline-block;margin-right:4px}
.chart{display:flex;align-items:flex-end;gap:6px;height:70px;margin-top:12px}
.chart .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;height:100%}
.chart .b1{background:var(--brand);border-radius:3px 3px 0 0;min-height:3px}
.chart .b2{background:var(--surface-3);border-radius:0 0 3px 3px;min-height:3px}
.chart-x{display:flex;gap:6px;margin-top:6px}
.chart-x span{flex:1;text-align:center;font-size:10px;color:var(--ink-3)}

.toast{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.96);background:var(--surface-3);color:var(--ink);padding:12px 20px;border-radius:var(--r-md);font-size:13px;z-index:99;opacity:0;pointer-events:none;transition:.18s ease-out;box-shadow:var(--sh-4);max-width:80vw;text-align:center;border:1px solid var(--line-2)}
.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}

.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:560px;z-index:40;display:flex;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}
@media(min-width:640px){.tabbar{bottom:24px;border-radius:0 0 28px 28px}}
.tab{flex:1;height:50px;border-radius:var(--r-md);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--ink-3);font-size:10px}
.tab svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tab.on{color:var(--brand)}
.tab:active{transform:scale(.97)}

.sheet{position:fixed;left:0;right:0;bottom:0;z-index:65;background:var(--bg-2);border-top:1px solid var(--line);border-radius:20px 20px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom));transform:translateY(102%);transition:transform .3s cubic-bezier(.32,.72,0,1);max-width:560px;margin:0 auto}
.sheet.show{transform:none}
.sheet h3{margin:0 0 14px;font-size:16px}

@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms !important;transition-duration:.01ms !important}}



.skeleton{background:linear-gradient(90deg,var(--surface) 25%,var(--surface-2) 37%,var(--surface) 63%);background-size:400% 100%;animation:sk 1.4s ease-in-out infinite;border-radius:var(--r-md)}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}


/* ===== 成分标签（chunk 上色） ===== */
.legend{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px;font-size:11px;color:var(--ink-3)}
.legend span{display:flex;align-items:center;gap:5px}
.label-dot{width:8px;height:8px;border-radius:2px;display:inline-block}
.chunk-grid{display:flex;flex-direction:column;gap:6px;margin-top:10px;width:100%}
.chunk-row{display:flex;align-items:center;gap:10px;background:rgba(18,40,75,.035);border:1px solid rgba(18,40,75,.08);border-radius:8px;padding:8px 10px}
.chunk-row .lb{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;white-space:nowrap}
.chunk-row .tx{font-size:14px;font-weight:500}
.chip.in-answer.painted{box-shadow:none}

.p-count{text-align:center;font-size:12px;color:var(--ink-3);padding-top:8px}


/* ===== 浅色主题（对齐原站风格） ===== */
/* 旧浅色主题块已移除（航图主题统一在文件开头定义） */
[data-theme="light"] body{background:var(--bg)}
[data-theme="light"] .app{background:var(--bg)}
[data-theme="light"] .drawer{box-shadow:var(--sh-3);border-right:1px solid var(--line)}
[data-theme="light"] .chip{background:#fffdf8;border-color:var(--line-2);box-shadow:var(--sh-1)}
[data-theme="light"] .chip.in-answer{box-shadow:none}
[data-theme="light"] .chunk-row{background:rgba(90,70,180,.035);border-color:rgba(90,70,180,.10)}
[data-theme="light"] .price-card.hot{background:linear-gradient(160deg,hsl(215,90%,96%),#fffdf8);border-color:var(--brand-line)}
[data-theme="light"] .feedback.ok{color:hsl(152,70%,22%)}
[data-theme="light"] .feedback.bad{color:hsl(356,70%,34%)}
[data-theme="light"] .feedback .parts span{background:rgba(18,40,75,.04)}
[data-theme="light"] .bubble.me{background:var(--brand-strong);color:#fffdf8}
[data-theme="light"] .toast{background:hsl(215,24%,18%);color:#fffdf8;border-color:transparent}
[data-theme="light"] .p-bar{background:var(--surface-3)}
[data-theme="light"] .hero{box-shadow:0 10px 26px hsl(215 70% 55% / .28)}
[data-theme="light"] .rail button{box-shadow:0 2px 10px rgba(60,50,120,.20)}
[data-theme="light"] .tabbar{background:rgba(18,40,75,.94)}
[data-theme="light"] .topbar{background:rgba(250,249,255,.88)}

.home-hero{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;border-radius:var(--r-lg);margin-bottom:16px;color:#fffdf8;background:radial-gradient(320px 160px at 88% -20%,rgba(18,40,75,.35),transparent 60%),linear-gradient(135deg,hsl(215,74%,60%),hsl(276,70%,56%));box-shadow:0 10px 26px hsl(215 70% 55% / .25)}


.mcourse{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid var(--line);cursor:pointer}
.mcourse:last-child{border-bottom:0}
.mcourse:active{opacity:.7}
.mc-tag{font-size:10px;color:var(--ink-3);border:1px solid var(--line-2);border-radius:4px;padding:1px 5px;flex:none}
.mc-name{flex:1;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-num{font-size:13px;color:var(--ink-3);flex:none}


.explain{width:100%;margin-top:6px;padding:8px 10px;border-radius:8px;background:rgba(18,40,75,.08);font-size:12px;line-height:1.7;color:var(--ink-2)}


/* ============ 重做：对齐对标站视觉（暗色 · 双列封面卡 · 侧栏胶囊） ============ */
/* 旧暗色 :root 已移除（方向 A 统一由文件开头变量控制） */
html{font-size:13px}
body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif}

/* 顶部栏 */
.topbar{background:var(--bg);border-bottom:0;padding:10px 14px}
.search{background:var(--surface);border:0;border-radius:999px;height:34px;justify-content:flex-start;padding:0 12px;gap:8px;color:var(--ink-3);font-size:12px}
.search span{font-size:12px}
.tbtn{width:34px;height:34px;display:grid;place-items:center;color:var(--ink-2)}
.avatar-sm{width:30px;height:30px;border-radius:50%;background:linear-gradient(140deg,#7c6cff,#5a4af0);display:grid;place-items:center;font-size:13px;color:#fffdf8}

/* 侧栏：深底 + 大行高 + 选中胶囊 */
.drawer{width:76vw;max-width:320px;background:#fffdf8;border-right:0;padding:14px 12px 10px}
.dhead{display:flex;align-items:center;gap:10px;padding:6px 8px 16px}
.drawer .ditem{display:flex;align-items:center;gap:14px;height:46px;padding:0 14px;border-radius:10px;font-size:15px;font-weight:500;color:var(--ink);margin:1px 0}
.drawer .ditem svg{width:20px;height:20px;stroke-width:1.7;opacity:.92}
.drawer .ditem.on{background:linear-gradient(100deg,#7b6bff,#5b4bf0);color:#fffdf8;box-shadow:0 6px 16px rgba(18,40,75,.35)}
.drawer .ditem.on svg{opacity:1}
.drawer .dgroup{margin:8px 0;border-top:1px solid rgba(18,40,75,.08);padding-top:8px}
.drawer .ditem.gold{color:#8f86ff}
.drawer .ditem.gold svg{color:#8f86ff}

/* 底部 tabbar 保留但更贴近暗色 */
.tabbar{background:rgba(14,15,18,.96);border-top:1px solid rgba(18,40,75,.08)}

/* 卡片 / 区块 */
.card{background:var(--surface);border:0;border-radius:12px;box-shadow:none}
.sec-h h2{font-size:16px;font-weight:600;letter-spacing:0}
.sec-h .more{font-size:12px;color:var(--ink-3)}
.tag{background:rgba(18,40,75,.08);color:var(--ink-2);border:0;border-radius:4px;font-size:10px;padding:2px 6px}
.tag.b{background:var(--brand-soft);color:#b3a8ff}
.btn{border-radius:10px;background:linear-gradient(100deg,#7b6bff,#5b4bf0);box-shadow:0 6px 16px rgba(18,40,75,.28);font-size:15px;font-weight:600;height:46px}
.btn.ghost,.btn.line{background:transparent;border:1px solid var(--line-2);box-shadow:none;color:var(--ink-2)}
.btn.sm{height:32px;font-size:12px;border-radius:8px;padding:0 12px}

/* 课程双列卡 */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gcard{background:transparent;border:0;padding:0;text-align:left;color:var(--ink);display:block;width:100%}
.gcard:active{transform:scale(.985)}
.gcv{position:relative;aspect-ratio:4/3.1;border-radius:12px;overflow:hidden;display:grid;place-items:center;font-size:40px;
  background:radial-gradient(120% 90% at 20% 10%,rgba(18,40,75,.16),transparent 55%),linear-gradient(150deg,#3a3f8f,#1b1c24)}
.gcv .ctag{position:absolute;right:6px;bottom:6px;background:rgba(18,40,75,.62);color:#fffdf8;font-size:9px;padding:2px 6px;border-radius:4px}
.gcv .cnum{position:absolute;left:8px;top:6px;color:rgba(18,40,75,.75);font-size:9px}
.gtitle{margin-top:8px;font-size:13px;line-height:1.45;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gfoot{margin-top:6px;display:flex;align-items:center;justify-content:space-between;color:var(--ink-3);font-size:11px}
.gfoot .dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(140deg,#8a7bff,#12284b)}
.gfoot .hot{display:inline-flex;align-items:center;gap:4px}

/* 分类条 */
.seg.gap{display:flex;gap:18px;overflow-x:auto;white-space:nowrap;padding:4px 0 10px;margin-bottom:2px}
.seg.gap button{background:none;border:0;padding:0;font-size:13px;color:var(--ink-3);font-weight:500}
.seg.gap button.on{color:#fffdf8;font-weight:700}

/* 首页数据卡 */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stat-card{background:var(--surface);border-radius:12px;padding:14px}
.stat-card .lbl{font-size:12px;color:var(--ink-2)}
.stat-card .num2{font-size:26px;font-weight:700;margin-top:6px;font-variant-numeric:tabular-nums}

/* 练习页 */
.p-head .idx{font-size:12px;color:var(--ink-3)}
.sentence-zh{font-size:22px;font-weight:700;line-height:1.35;letter-spacing:0}
.chunk{border-radius:8px}
.answer{border:1px dashed rgba(18,40,75,.16);background:rgba(18,40,75,.03);min-height:88px;border-radius:12px}
.room{background:var(--surface);border-radius:12px;border:0}

/* 侧栏用户区 / 分组 / 底部设置 */
.drawer .u{display:flex;align-items:center;gap:10px;padding:8px 8px 18px}
.drawer .u .av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:600;color:#fffdf8;background:linear-gradient(140deg,#7c6cff,#5a4af0)}
.drawer .u .n{font-size:15px;font-weight:600;line-height:1.3}
.drawer .u .remain{display:inline-block;margin-top:4px;font-size:10px;color:#9a90ff;border:1px solid rgba(138,123,255,.35);border-radius:4px;padding:1px 6px}
.drawer .dnav{display:flex;flex-direction:column}
.drawer .dsep{height:1px;background:rgba(18,40,75,.08);margin:8px 8px}
.drawer .ditem span{font-size:15px}
.drawer .ditem .badge{margin-left:auto;font-size:10px;color:#9a90ff;background:rgba(18,40,75,.16);border-radius:4px;padding:1px 6px}
.drawer .dfooter{padding:8px 0 4px}
.drawer .dfooter .box{display:flex;align-items:center;justify-content:center;gap:8px;height:44px;width:100%;border:1px solid rgba(18,40,75,.16);border-radius:10px;background:transparent;color:var(--ink-2);font-size:14px}
.drawer .dfooter .box svg{width:18px;height:18px}

/* 首页数据卡 */
.stat-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.stat-big{position:relative;background:var(--surface);border:0;border-radius:12px;padding:14px;overflow:hidden}
.stat-big .lbl{font-size:12px;color:var(--ink-2)}
.stat-big .val{font-size:26px;font-weight:700;margin-top:6px;line-height:1.1;font-variant-numeric:tabular-nums}
.stat-big .val small{font-size:11px;font-weight:400;color:var(--ink-3);margin-left:3px}
.stat-big .ic{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:16px;color:#fffdf8;background:linear-gradient(140deg,#8a7bff,#5b4bf0);opacity:.95}
.stat-big .ic.alt{background:linear-gradient(140deg,#ff6b9a,#e0386c)}
.wrong-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.wrong-col{background:var(--surface);border:0;border-radius:12px;padding:12px 14px}
.wrong-col .t{display:flex;justify-content:space-between;font-size:13px;font-weight:600;padding-bottom:8px}
.wrong-col .row{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-2);padding:7px 0;border-top:1px solid rgba(18,40,75,.05)}
.wrong-col .row b{color:var(--ink);font-weight:600}

/* 通用行 / 房间 / 列表 */
.room{background:var(--surface);border:0;border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:12px;width:100%;margin-bottom:8px;text-align:left;color:var(--ink)}
.room .av{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font-size:17px;background:rgba(18,40,75,.16)}
.room .m{flex:1;min-width:0}
.room .m .t{font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.room .m .s{font-size:11px;color:var(--ink-3);margin-top:3px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;margin:20px 0 10px}
.card .row{border-top:1px solid rgba(18,40,75,.05)}
.card .row:first-child{border-top:0}

.gcv span{filter:drop-shadow(0 2px 6px rgba(18,40,75,.12))}
.gcv .cnum{left:10px;top:8px;color:#fffdf8;font-weight:600;font-size:10px;background:rgba(18,40,75,.12);padding:2px 6px;border-radius:4px}


.gcv{flex-direction:column;gap:8px;justify-content:center}
.gcv .gemoji{font-size:30px;line-height:1}
.gcv .gctitle{font-size:15px;font-weight:700;line-height:1.3;text-align:center;padding:0 12px;color:#fffdf8;text-shadow:0 2px 8px rgba(18,40,75,.14);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}


.home-hero{border-radius:14px;padding:18px 16px;background:radial-gradient(90% 120% at 90% -10%,rgba(18,40,75,.30),transparent 60%),linear-gradient(120deg,#7b6bff,#6146e6 60%,#7b3fe4)}
.home-hero .btn.sm{background:#fffdf8!important;color:#5a4af0!important;font-weight:700}


/* 课程详情 */
.cd-hero{position:relative;border-radius:14px;padding:20px 16px 18px;min-height:150px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;margin-bottom:12px}
.cd-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(18,40,75,.16),transparent 70%)}
.cd-hero .cd-emoji{position:absolute;right:14px;top:12px;font-size:38px;opacity:.9;filter:drop-shadow(0 4px 10px rgba(18,40,75,.4))}
.cd-hero .cd-title{position:relative;z-index:1;font-size:20px;font-weight:700;line-height:1.3;color:#fffdf8;text-shadow:0 2px 10px rgba(18,40,75,.14)}
.cd-hero .cd-sub{position:relative;z-index:1;font-size:12px;color:rgba(18,40,75,.78);margin-top:4px}
.cd-meta{display:flex;gap:22px;background:var(--surface);border-radius:12px;padding:12px 16px;margin-bottom:12px}
.cd-meta div{display:flex;flex-direction:column;gap:2px}
.cd-meta b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.cd-meta span{font-size:10px;color:var(--ink-3)}
.cd-desc{font-size:12px;color:var(--ink-2);line-height:1.8;margin:0 0 14px}
.cd-cta{margin-bottom:6px}
.ucard{background:var(--surface);border:0;border-radius:12px;padding:14px;text-align:left;color:var(--ink)}
.ucard .ut{font-size:14px;font-weight:600;line-height:1.35}
.ucard .us{font-size:11px;color:var(--ink-3);margin-top:6px}
.ucard .ubar{height:3px;border-radius:2px;background:rgba(18,40,75,.10);margin-top:10px;overflow:hidden}
.ucard .ubar i{display:block;height:100%;background:linear-gradient(90deg,#7b6bff,#5b4bf0)}
.sline{font-size:13px;line-height:1.5}
.sline.lk{color:var(--ink-3);letter-spacing:2px}

/* 练习页 */
.p-bar{height:4px;border-radius:2px;background:rgba(18,40,75,.10);margin:8px 0 18px}
.p-bar i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#8a7bff,#5b4bf0)}
.p-head .idx{font-size:12px;color:var(--ink-3)}
.pool{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.chip{background:var(--surface);border:0;border-radius:10px;padding:9px 14px;font-size:14px;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(18,40,75,.08)}
.chip.used{opacity:.25}
.answer{min-height:92px;border-radius:12px;background:rgba(18,40,75,.03);box-shadow:inset 0 0 0 1px rgba(18,40,75,.10);padding:12px}
.p-foot{margin-top:18px}
.p-tools{display:flex;gap:8px;margin-top:12px}
.feedback{border-radius:12px}
.explain{background:rgba(18,40,75,.05);border-radius:8px;padding:10px 12px;font-size:12px;line-height:1.7;color:var(--ink-2)}

.btn:disabled{background:rgba(18,40,75,.10)!important;color:rgba(18,40,75,.32)!important;box-shadow:none!important}


/* 我的 / 手账 / 排行榜 / 通用组件 */
.avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:19px;font-weight:600;color:#fffdf8;background:linear-gradient(140deg,#7c6cff,#5a4af0)}
.pk-head{display:flex;background:var(--surface);border-radius:12px;padding:14px 0;margin-bottom:14px}
.pk-head .x{flex:1;text-align:center;position:relative}
.pk-head .x + .x::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:24px;background:rgba(18,40,75,.10)}
.pk-head .x b{display:block;font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.pk-head .x span{font-size:11px;color:var(--ink-3);margin-top:4px;display:block}

/* 分段控件：胶囊 */
.seg{display:flex;gap:6px;background:var(--surface);border-radius:10px;padding:4px;margin-bottom:14px}
.seg button{flex:1;height:32px;border-radius:8px;background:transparent;border:0;color:var(--ink-2);font-size:13px;font-weight:500}
.seg button.on{background:rgba(18,40,75,.12);color:#fffdf8;font-weight:600}

/* 列表行 */
.row{display:flex;align-items:center;gap:10px;padding:14px 2px;border-bottom:1px solid rgba(18,40,75,.055);font-size:13px}
.row:last-child{border-bottom:0}
.card .row:active{opacity:.7}

/* 迷你统计卡 */
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.mini{background:var(--surface);border-radius:12px;padding:14px}
.mini .t{font-size:12px;color:var(--ink-3)}
.mini .v{font-size:24px;font-weight:700;margin-top:6px;font-variant-numeric:tabular-nums}
.mini .v small{font-size:11px;font-weight:400;color:var(--ink-3);margin-left:3px}

/* 排行榜前三 */
.row .rank1{color:#ffd166}
.row .rank2{color:#cfd8e3}
.row .rank3{color:#e0a879}

/* 空状态 */
.empty{padding:36px 20px;text-align:center;color:var(--ink-3)}
.empty .e{font-size:28px;margin-bottom:8px;opacity:.8}
.empty p{font-size:12px;line-height:1.7;margin:0}

/* 我的：课包卡片统一双列 */
.me-courses{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* 荣耀榜（首页迷你榜） */
.rank-mini{padding:4px 16px}
.rank-mini .item{display:flex;align-items:center;gap:12px;height:48px;border-bottom:1px solid rgba(18,40,75,.055)}
.rank-mini .item:last-child{border-bottom:0}
.rank-mini .no{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ink-3);background:rgba(18,40,75,.08)}
.rank-mini .no.top{color:#1a1206;background:linear-gradient(135deg,#ffd66b,#f0a63a)}
.rank-mini .nm{flex:1;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-mini .tm{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}

/* 首页课程包改成双列卡 */
.home-courses{display:grid;grid-template-columns:1fr 1fr;gap:10px}


/* 课程封面图（gen-covers.py 生成） */
.gcv{aspect-ratio:3/4}
.gcv[style*="/covers/"] + .gtitle{display:none}
.gcv[style*="/covers/"] .gemoji,.gcv[style*="/covers/"] .gctitle{display:none}
.gcv[style*="/covers/"]{background-size:cover;background-position:center}

.gcv .cnum{left:auto;right:8px;top:8px}


/* 练习模块 v2 */
.p-modes{display:flex;gap:8px;margin-left:10px}
.p-modes .pm{min-width:52px;white-space:nowrap}
.pm{font-size:12px;padding:5px 12px;border-radius:999px;background:rgba(18,40,75,.08);color:var(--ink-2,#a8a9b4);border:1px solid transparent;cursor:pointer}
.pm.on{background:var(--brand);color:#fffdf8}
.zh-tools{display:flex;gap:8px;margin:10px 0 2px;flex-wrap:wrap}
.hint-line{margin:8px 0;padding:9px 12px;border-radius:10px;background:rgba(18,40,75,.12);border:1px solid rgba(18,40,75,.35);font-size:13px;line-height:1.6;color:var(--ink,#e8e9ee)}
.type-input{width:100%;box-sizing:border-box;padding:14px;border-radius:12px;background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.14);color:var(--ink,#fffdf8);font-size:17px;letter-spacing:.3px;font-family:inherit}
.type-input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(18,40,75,.18)}
.type-input::placeholder{color:rgba(18,40,75,.30)}
.diff-wrap{margin-top:10px}
.diff-line{display:flex;flex-wrap:wrap;gap:6px;font-size:15px;line-height:1.7}
.dch{padding:1px 6px;border-radius:6px}
.dch.ok{color:#34d399;background:rgba(52,211,153,.12)}
.dch.bad{color:#f87171;background:rgba(248,113,113,.14);text-decoration:line-through}


/* 练习场景插画位（/scenes/<key>.jpg，无图时降级为渐变色块 + 关键词） */
.scene{position:relative;width:100%;aspect-ratio:16/9;max-height:176px;border-radius:16px;overflow:hidden;
  background:linear-gradient(135deg,rgba(18,40,75,.30),rgba(18,40,75,.05));
  border:1px solid rgba(18,40,75,.10);transition:border-color .25s,box-shadow .25s}
.scene img{width:100%;height:100%;object-fit:cover;display:block}
.scene .scene-fallback{display:none}
.scene.noimg .scene-fallback{display:flex;position:absolute;inset:0;align-items:center;justify-content:center;
  font-size:14px;letter-spacing:2px;color:rgba(18,40,75,.42)}
.scene.right{border-color:rgba(52,211,153,.55);box-shadow:0 0 0 2px rgba(52,211,153,.22)}
.scene.bad{animation:sceneShake .42s ease;border-color:rgba(248,113,113,.55)}
@keyframes sceneShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}60%{transform:translateX(7px)}}


/* 练习计时与拖拽 */
.timer{margin-left:10px;font-size:12px;color:var(--ink-3,#8b8c96);font-variant-numeric:tabular-nums;
  padding:3px 8px;border-radius:999px;background:rgba(18,40,75,.05)}
.answer .chip{draggable:false;touch-action:none}
.answer .chip.dragging{opacity:.45;transform:scale(.96)}
.answer .chip.drop-target{outline:2px dashed rgba(18,40,75,.9);outline-offset:2px}


/* 学习数据 */
.study-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:8px}
.sg{background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.08);border-radius:12px;padding:10px 10px 8px}
.sg .t{font-size:11px;color:var(--ink-3,#8b8c96)}
.sg .v{font-size:18px;font-weight:700;margin-top:4px;font-variant-numeric:tabular-nums}
.sg .b{height:4px;border-radius:2px;background:rgba(18,40,75,.10);margin-top:8px;overflow:hidden}
.sg .b i{display:block;height:100%;background:var(--brand);border-radius:2px}
.sg .hint{font-size:10px;color:var(--ink-3,#8b8c96);margin-top:5px}
.cal-heat span{position:relative}
.cal-heat span.h1{background:rgba(18,40,75,.22);color:#d9d4ff}
.cal-heat span.h2{background:rgba(18,40,75,.45);color:#fffdf8}
.cal-heat span.h3{background:rgba(18,40,75,.8);color:#fffdf8;font-weight:700}

.cal-week span{background:transparent !important;color:var(--ink-3,#8b8c96);font-size:11px;font-weight:400}
.cal-heat span.pad{background:transparent !important}


/* 发音人选择 */
.voice-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.voice-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border-radius:10px;
  background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.10);color:var(--ink);cursor:pointer}
.voice-item.on{border-color:var(--brand);background:rgba(18,40,75,.18)}
.voice-item .vn{font-size:14px;font-weight:600}
.voice-item .vd{font-size:11px;color:var(--ink-3,#8b8c96)}
.bubble{position:relative}
.bubble.ai{padding-right:34px}
.bubble .replay{position:absolute;right:10px;bottom:8px;font-size:12px;opacity:.55}
.bubble.ai:active .replay{opacity:1}

.col-course{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;background:rgba(18,40,75,.04);margin-bottom:10px;cursor:pointer}
.col-course .cc-img{width:84px;height:48px;border-radius:8px;background-size:cover;background-position:center;flex:none;
  background-color:rgba(18,40,75,.25)}
.col-course .cc-body{flex:1;min-width:0}
.col-course .cc-t{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-course .cc-s{font-size:12px;color:var(--ink-3,#8b8c96);margin-top:2px}
.empty.small{padding:18px 0}
.empty.small p{font-size:12px}

.cpn{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;margin-bottom:10px;
  background:linear-gradient(135deg,rgba(18,40,75,.16),rgba(18,40,75,.04));border:1px solid rgba(18,40,75,.25)}
.cpn-amt{width:84px;flex:none;text-align:center}
.cpn-amt b{display:block;font-size:20px;color:var(--brand)}
.cpn-amt span{font-size:10px;color:var(--ink-3,#8b8c96)}
.cpn-body{flex:1;min-width:0}
.cpn-name{font-size:14px;font-weight:600}
.cpn-desc{font-size:11px;color:var(--ink-3,#8b8c96);margin-top:3px}
.cpn.claim{background:rgba(18,40,75,.04);border-color:rgba(18,40,75,.10)}
.cpn-pick{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.cpn-pill{padding:7px 12px;border-radius:999px;background:rgba(18,40,75,.08);border:1px solid rgba(18,40,75,.1);color:var(--ink);font-size:12px;cursor:pointer}
.cpn-pill.on{background:var(--brand);border-color:var(--brand);color:#fffdf8}
.coupon-tip{margin-top:8px;font-size:11px;color:var(--brand);text-align:center}

.holiday-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;
  margin-bottom:10px;color:#fffdf8;cursor:pointer}
.holiday-bar .hb-l b{display:block;font-size:14px}
.holiday-bar .hb-l span{font-size:11px;opacity:.9}
.holiday-bar .hb-r{font-size:11px;white-space:nowrap;opacity:.95}
.notice-bar{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:rgba(18,40,75,.05);
  margin-bottom:10px;cursor:pointer;font-size:12px}
.notice-bar .nb-tag{font-size:10px;padding:2px 6px;border-radius:6px;background:var(--brand);color:#fffdf8;flex:none}
.notice-bar .nb-txt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.notice-bar .nb-ar{color:var(--ink-3,#8b8c96)}
.lottery-entry{display:flex;align-items:center;gap:10px;padding:14px;border-radius:14px;margin:12px 0;
  background:linear-gradient(135deg,rgba(255,196,0,.18),rgba(255,120,0,.06));border:1px solid rgba(255,196,0,.25);cursor:pointer}
.lottery-entry .le-l{font-size:14px;font-weight:600}
.lottery-entry .le-s{flex:1;font-size:11px;color:var(--ink-3,#8b8c96)}
.lottery-entry .le-r{font-size:12px;color:#ffc400;white-space:nowrap}
.noticeModal{position:fixed;inset:0;z-index:999;background:rgba(18,40,75,.16);display:flex;align-items:center;justify-content:center;padding:24px}
.noticeModal .nm-box{width:100%;max-width:320px;background:var(--surface,#16171c);border-radius:16px;padding:18px;border:1px solid rgba(18,40,75,.10)}
.noticeModal .nm-t{font-size:15px;font-weight:600;line-height:1.5}
.noticeModal .nm-c{font-size:12px;color:var(--ink-2,#b8b9c4);margin-top:10px;line-height:1.8}
.noticeModal .nm-acts{display:flex;gap:10px;margin-top:16px;justify-content:flex-end}
.lottery-wrap{display:flex;flex-direction:column;align-items:center;padding:10px 0}
.wheel{position:relative;width:260px;height:260px;border-radius:50%;transition:transform 2.6s cubic-bezier(.15,.7,.2,1);
  background:conic-gradient(#2a2b36 0 60deg,#1f2028 60deg 120deg,#2a2b36 120deg 180deg,#1f2028 180deg 240deg,#2a2b36 240deg 300deg,#1f2028 300deg 360deg);
  border:6px solid rgba(18,40,75,.10);box-shadow:0 8px 30px rgba(18,40,75,.14)}
.wheel-cell{position:absolute;inset:0;display:flex;justify-content:center}
.wheel-cell span{padding-top:14px;text-align:center;font-size:12px;color:var(--ink)}
.wheel-cell b{display:block;font-size:10px;color:var(--ink-3,#8b8c96);margin-top:2px}
.wheel-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:78px;height:78px;border-radius:50%;
  background:var(--brand);color:#fffdf8;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;
  cursor:pointer;box-shadow:0 4px 16px rgba(18,40,75,.5)}
.prize-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.prize{background:rgba(18,40,75,.05);border-radius:12px;padding:12px 8px;text-align:center}
.prize span{font-size:20px;display:block}
.prize b{font-size:11px;font-weight:500;color:var(--ink-2,#b8b9c4);margin-top:4px;display:block}

.lot9{padding:8px 0 4px}
.lot9-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lot9-cell{aspect-ratio:1/1;border-radius:14px;background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.10);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:all .12s}
.lot9-cell .ic{font-size:24px}
.lot9-cell b{font-size:11px;font-weight:500;color:var(--ink-2,#b8b9c4)}
.lot9-cell.on{background:rgba(18,40,75,.35);border-color:var(--brand);transform:scale(.97)}
.lot9-cell.win{background:rgba(255,196,0,.3);border-color:#ffc400;transform:scale(1.04)}
.lot9-cell.empty{visibility:hidden}
.lot9-btn{aspect-ratio:1/1;border-radius:14px;border:none;background:linear-gradient(135deg,#12284b,#b16cff);color:#fffdf8;
  font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 6px 20px rgba(18,40,75,.45)}
.lot9-meta{text-align:center;font-size:12px;color:var(--ink-2,#b8b9c4);margin:14px 0 6px}
.lot9-meta b{color:var(--brand)}

.pk-live-head{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:rgba(18,40,75,.04)}
.pk-live-head .pl{flex:1;text-align:center;position:relative}
.pk-live-head .pl.ans{background:rgba(18,40,75,.18);border-radius:10px}
.pk-live-head .nm{font-size:12px;color:var(--ink-2,#b8b9c4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk-live-head .sc{font-size:22px;font-weight:700;margin-top:2px}
.pk-live-head .vs{font-size:12px;color:var(--ink-3,#8b8c96)}
.pk-live-head .dot{width:7px;height:7px;border-radius:50%;background:#555;position:absolute;right:6px;top:6px}
.pk-live-head .dot.on{background:#34d399}
.pk-opts{display:grid;gap:10px;margin-top:10px}
.pk-opt{padding:14px;border-radius:12px;background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.10);
  color:var(--ink);font-size:14px;text-align:left;cursor:pointer;transition:all .15s}
.pk-opt:active{transform:scale(.99)}
.pk-opt.locked{opacity:.55;pointer-events:none}
.pk-opt.ok{border-color:#34d399;background:rgba(52,211,153,.16)}
.pk-opt.bad{border-color:#f87171;background:rgba(248,113,113,.14)}

.pk-live-head + .card .btn{display:block;width:100%}

.gb-hero{padding:18px;border-radius:16px;background:linear-gradient(135deg,rgba(255,120,0,.22),rgba(255,196,0,.08));
  border:1px solid rgba(255,150,0,.28);margin-bottom:16px}
.gb-h-t{font-size:16px;font-weight:700}
.gb-h-s{font-size:12px;color:var(--ink-2,#b8b9c4);margin-top:6px;line-height:1.6}
.gb-card{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:rgba(18,40,75,.04);margin-bottom:10px}
.gb-l{flex:1;min-width:0}
.gb-title{font-size:14px;font-weight:600}
.gb-meta{font-size:11px;color:var(--ink-3,#8b8c96);margin-top:3px}
.gb-members{display:flex;gap:6px;margin-top:8px;align-items:center;flex-wrap:wrap}
.gb-av{width:26px;height:26px;flex:none;line-height:1;border-radius:50%;background:rgba(18,40,75,.35);color:#fffdf8;display:flex;align-items:center;justify-content:center;font-size:12px}
.gb-av.me{background:var(--brand)}
.gb-av.empty{background:rgba(18,40,75,.10);color:var(--ink-3,#8b8c96)}
.gb-av.big{width:52px;height:52px;font-size:20px;margin:0 auto}
.gb-r{text-align:right;flex:none}
.gb-price{font-size:17px;font-weight:700;color:#ffb347}
.gb-origin{font-size:11px;color:var(--ink-3,#8b8c96);text-decoration:line-through;margin-left:5px}
.gb-entry{display:flex;align-items:center;justify-content:space-between;padding:14px;border-radius:14px;margin-top:14px;
  background:linear-gradient(135deg,rgba(255,196,0,.18),rgba(255,120,0,.06));border:1px solid rgba(255,196,0,.25);cursor:pointer}
.gb-entry .gb-e-l b{font-size:14px}
.gb-entry .gb-e-l span{display:block;font-size:11px;color:var(--ink-3,#8b8c96);margin-top:3px}
.gb-entry .gb-e-r{font-size:12px;color:#ffb347}

.gb-av.empty{padding:0 !important;width:26px !important;height:26px !important;font-size:12px !important;display:flex !important;align-items:center;justify-content:center}
.gb-av.big.empty{padding:0 !important;width:52px !important;height:52px !important;font-size:20px !important}


/* 手机端练习可读性（390 / 360 宽） */
@media (max-width: 460px) {
  .zh{font-size:24px !important;line-height:1.45 !important}
  .zh-hint{font-size:13px !important;color:var(--ink-2,#b8b9c4) !important}
  .legend{font-size:13px !important;gap:14px !important}
  .legend .label-dot{width:9px !important;height:9px !important}
  .chip{font-size:16px !important;padding:12px 16px !important;min-height:48px !important;line-height:1.25}
  .chip.in-answer{font-size:16px !important}
  .answer{min-height:84px !important;padding:12px !important}
  .answer .ph{font-size:14px !important;line-height:1.6}
  .p-modes .pm{font-size:13px !important;padding:7px 14px !important}
  .p-head .idx{font-size:13px !important}
  .timer{font-size:13px !important}
  .scene{max-height:150px !important}
  .p-tools .btn{font-size:13px !important}
  .p-foot{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(11,12,13,0),rgba(11,12,13,.92) 30%);
    padding:14px 0 calc(10px + env(safe-area-inset-bottom));z-index:5}
  .p-count{font-size:12px !important}
}

html[data-font="big"] .chip{font-size:18px !important;padding:13px 18px !important}
html[data-font="big"] .zh{font-size:26px !important}
html[data-font="big"] .zh-hint,html[data-font="big"] .legend{font-size:14px !important}
html[data-font="big"] .answer .ph{font-size:15px !important}


/* 手机端一屏放得下（练习页压缩） */
@media (max-width: 460px) {
  .scene{max-height:112px !important;border-radius:12px !important;margin:4px 0 8px !important}
  .zh{font-size:21px !important;line-height:1.4 !important;margin:2px 0 6px !important}
  .zh-tools{margin:6px 0 0 !important;gap:8px !important}
  .zh-tools .btn{padding:7px 12px !important;font-size:12px !important;min-height:34px}
  .zh-hint{margin:6px 0 2px !important;font-size:12px !important}
  .legend{margin:6px 0 2px !important;font-size:12px !important}
  .answer{min-height:64px !important;padding:10px !important;margin:8px 0 !important}
  .chip{font-size:15px !important;padding:10px 14px !important;min-height:44px !important}
  .pool{gap:8px !important}
  .p-tools{margin:6px 0 !important;gap:8px !important}
  .p-tools .btn{min-height:38px;font-size:12px !important}
  .p-foot{position:sticky;bottom:0;padding:10px 0 calc(8px + env(safe-area-inset-bottom)) !important;
    background:linear-gradient(180deg,rgba(11,12,13,0),rgba(11,12,13,.96) 35%)}
  .p-foot .btn{min-height:46px;font-size:15px !important}
  .p-count{margin-top:4px !important}
}

/* 练习页对比度提升 */
@media (max-width: 460px) {
  .answer .ph{color:var(--ink-2,#b8b9c4) !important}
  .zh-hint{color:var(--ink-2,#b8b9c4) !important}
  .p-count{color:var(--ink-2,#b8b9c4) !important}
  .legend{color:var(--ink-2,#b8b9c4) !important}
  .chip{color:#fffdf8 !important;background:rgba(18,40,75,.09) !important;border:1px solid rgba(18,40,75,.16) !important}
  .answer{border-color:rgba(18,40,75,.24) !important}
}

/* 答对特效 */
.answer-fx{position:fixed;left:0;right:0;top:0;bottom:0;pointer-events:none;z-index:50;display:flex;align-items:center;justify-content:center}
.answer-fx i{position:absolute;top:52%;left:50%;width:8px;height:8px;border-radius:2px;background:var(--c);
  animation:fxBurst .9s cubic-bezier(.2,.7,.3,1) forwards;animation-delay:var(--d)}
@keyframes fxBurst{0%{transform:translate(0,0) scale(.4);opacity:1}100%{transform:translate(var(--x),-140px) rotate(280deg) scale(1);opacity:0}}
.answer-fx b{font-size:64px;color:#34d399;text-shadow:0 6px 24px rgba(52,211,153,.5);animation:fxPop .5s cubic-bezier(.34,1.56,.64,1) both}
@keyframes fxPop{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.18);opacity:1}100%{transform:scale(1);opacity:1}}
.feedback.ok.show{animation:fbIn .35s ease}
@keyframes fbIn{0%{transform:translateY(10px);opacity:0}100%{transform:translateY(0);opacity:1}}

/* 封面已含标题与分类：隐藏压在标题上的 HTML 徽标，价格改到卡下 */
.gcv[style*="/covers/"] .cnum,.gcv[style*="/covers/"] .ctag,.gcv[style*="/covers/"] .gctitle{display:none !important}
.gfoot .gprice{margin-left:auto;color:#ffb347;font-weight:600;font-size:11px}

/* AI 助教头像 */
.tutor-av{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid rgba(18,40,75,.16);flex:none}
.voice-list{grid-template-columns:1fr 1fr}
.voice-item{display:flex;align-items:center;gap:8px}
.voice-av{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none}
.talk-head{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:10px;border-radius:14px;background:rgba(18,40,75,.04)}
.talk-head b{font-size:14px;display:block}
.talk-head .tiny{display:block;margin-top:2px}

/* 教材页：版本 → 年级 → 单元 */
.teach-grade{margin:0 0 14px}
.teach-grade .tg-h{display:flex;align-items:baseline;gap:8px;font-size:13px;font-weight:600;color:var(--ink-2);padding:4px 2px 8px}
.teach-grade .tg-h span{font-size:11px;color:var(--ink-3);font-weight:400}

/* 练习模式选择弹窗 */
.pmask{position:fixed;inset:0;background:rgba(18,40,75,.62);backdrop-filter:blur(6px);z-index:60;display:flex;align-items:flex-end;justify-content:center}
.pmodal{width:100%;max-width:430px;background:#15161b;border-radius:22px 22px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));border-top:1px solid rgba(18,40,75,.10)}
.pm-h{display:flex;align-items:center;justify-content:space-between;font-size:16px}
.pm-x{background:rgba(18,40,75,.10);border:none;color:var(--ink-2);width:30px;height:30px;border-radius:50%;font-size:13px}
.pm-sub{font-size:12px;color:var(--ink-3);margin:4px 0 14px}
.pm-list{display:grid;gap:10px}
.pmode{display:flex;align-items:center;gap:12px;text-align:left;padding:12px;border-radius:14px;border:1.5px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink)}
.pmode.on{border-color:var(--brand);background:rgba(18,40,75,.14)}
.pm-ic{width:42px;height:42px;border-radius:12px;background:rgba(18,40,75,.18);display:grid;place-items:center;font-size:20px;flex:none}
.pm-t{font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px}
.pm-t span{font-size:10px;padding:1px 6px;border-radius:999px;background:rgba(18,40,75,.1);color:var(--ink-2);font-weight:400}
.pm-d{font-size:11px;color:var(--ink-3);margin-top:3px;line-height:1.5}
.pm-foot{display:flex;gap:10px;margin-top:16px}
.pm-foot .btn{flex:1}
/* 口语跟读 */
.spk-en{font-size:22px;font-weight:700;line-height:1.45;margin:6px 0 4px}
.spk-zh{font-size:13px;color:var(--ink-2);margin-bottom:14px}
.spk-actions{display:flex;gap:8px;flex-wrap:wrap}
.spk-result{margin-top:14px}
.spk-box{padding:14px;border-radius:14px;background:rgba(18,40,75,.05);border:1px solid rgba(18,40,75,.10);font-size:13px;line-height:1.7}
.spk-box.ok{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.12)}
.spk-box.bad{border-color:rgba(248,113,113,.4);background:rgba(248,113,113,.1)}
.spk-box.listening{color:var(--brand)}
.spk-score{font-size:34px;font-weight:800;line-height:1.1}
.spk-score span{font-size:13px;font-weight:500;margin-left:4px;color:var(--ink-2)}
.spk-heard{margin:4px 0;color:var(--ink-2)}
.spk-tip{margin-top:14px;line-height:1.7}

/* 听力模式 */
.listen-card{margin-top:12px;padding:18px 16px;border-radius:16px;background:rgba(18,40,75,.04);border:1px solid rgba(18,40,75,.10);text-align:center}
.listen-play{width:84px;height:84px;border-radius:50%;border:none;font-size:34px;background:linear-gradient(135deg,#7b6bff,#e8a33d);color:#fffdf8;box-shadow:0 10px 26px rgba(18,40,75,.35);transition:transform .12s}
.listen-play:active{transform:scale(.94)}
.listen-play.playing{animation:pulse .9s ease-out}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(18,40,75,.55)}100%{box-shadow:0 0 0 22px rgba(18,40,75,0)}}
.listen-hint{font-size:12px;color:var(--ink-3);margin:12px 0 14px}

/* 学习手账 6 子页 */
.nb-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.nb-tabs button{padding:10px 6px;border-radius:12px;border:1.5px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink-2);text-align:center}
.nb-tabs button.on{border-color:var(--brand);background:rgba(18,40,75,.16);color:#fffdf8}
.nb-tabs b{display:block;font-size:17px;color:var(--ink)}
.nb-tabs span{font-size:11px}
/* 首页每日一句/金句/学习人数 */
.home-quote{margin:12px 0;padding:14px;border-radius:14px;background:linear-gradient(135deg,rgba(18,40,75,.22),rgba(232,163,61,.1));border:1px solid rgba(18,40,75,.28);cursor:pointer}
.hq-tag{font-size:11px;color:#c3b8ff;margin-bottom:6px}
.hq-en{font-size:15px;font-weight:600;line-height:1.5}
.hq-zh{font-size:12px;color:var(--ink-2);margin-top:4px}
.home-saying{margin:8px 0 4px;font-size:12px;color:var(--ink-2);line-height:1.7;padding:10px 12px;border-radius:12px;background:rgba(18,40,75,.04)}
.hs-t{display:inline-block;font-size:10px;padding:1px 6px;border-radius:6px;background:rgba(255,196,87,.18);color:#ffc457;margin-right:6px}
.hs-zh{display:block;margin-top:3px;color:var(--ink-3)}
.home-num{font-size:11px;color:var(--ink-3);margin:6px 0 12px;text-align:center}
.home-num b{color:var(--brand)}
/* 排行榜前三 */
.rank-podium{display:flex;align-items:flex-end;justify-content:center;gap:10px;padding:16px 8px 18px}
.rp-item{flex:1;text-align:center;border-radius:14px 14px 10px 10px;padding:12px 8px;background:rgba(18,40,75,.05)}
.rp-item.p1{background:linear-gradient(180deg,rgba(255,214,107,.25),rgba(255,214,107,.06));border:1px solid rgba(255,214,107,.45);transform:translateY(-8px)}
.rp-item.p2{border:1px solid rgba(200,200,220,.25)}
.rp-item.p3{border:1px solid rgba(240,166,58,.28)}
.rp-medal{font-size:22px}
.rp-nick{font-size:12px;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-sec{font-size:12px;color:var(--ink-3);margin-top:3px}
/* AI 对话统计 */
.talk-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.talk-stats div{text-align:center;padding:10px 4px;border-radius:12px;background:rgba(18,40,75,.04)}
.talk-stats b{display:block;font-size:17px;color:var(--ink)}
.talk-stats span{font-size:11px;color:var(--ink-3)}

/* 音标课程 */
.ph-bar{height:6px;border-radius:4px;background:rgba(18,40,75,.10);margin:10px 0 0;overflow:hidden}
.ph-bar i{display:block;height:100%;background:linear-gradient(90deg,#12284b,#e8a33d);border-radius:4px}
.ph-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ph-card{position:relative;padding:12px 4px;border-radius:12px;border:1.5px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);text-align:center;color:var(--ink)}
.ph-card.ok{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.1)}
.ph-sym{font-size:20px;font-weight:700;color:#a99cff}
.ph-name{font-size:10px;color:var(--ink-3);margin-top:3px}
.ph-ok{position:absolute;right:4px;top:4px;font-size:10px;color:#34d399}
.ph-word{display:flex;align-items:center;justify-content:space-between;width:100%;padding:10px 12px;margin-bottom:8px;border-radius:10px;background:rgba(18,40,75,.04);border:none;color:var(--ink);font-size:14px}
.ph-word:last-child{margin-bottom:0}
.pw-play{font-size:14px;color:var(--brand)}

/* 句子解析可视化（对齐对标：成分色块 + 逐词音标/词性/中文） */
.an-wrap{margin:14px 0 0;width:100%}
.an-blocks{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start;align-items:stretch}
.an-block{
  position:relative;border-radius:14px;padding:10px 12px 8px;
  background:linear-gradient(180deg,rgba(var(--c),.22),rgba(var(--c),.10));
  border:1.5px solid rgba(var(--c),.55);
  box-shadow:0 4px 14px rgba(18,40,75,.18);
  flex:0 0 auto;max-width:100%;
}
.an-words{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.an-w{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:44px}
.an-ph{font-size:10px;color:rgba(18,40,75,.55);letter-spacing:.02em;line-height:1.1;min-height:12px;white-space:nowrap}
.an-pos{font-size:9px;padding:1px 6px;border-radius:5px;background:rgba(var(--c),.45);color:#fffdf8;line-height:1.5;white-space:nowrap}
.an-txt{font-size:19px;font-weight:800;color:#fffdf8;line-height:1.25;white-space:nowrap}
.an-word-zh{font-size:10px;color:rgba(18,40,75,.7);line-height:1.2;min-height:12px;white-space:nowrap}
.an-label{display:block;text-align:center;margin-top:7px;font-size:11px;font-weight:600;color:rgba(18,40,75,.9)}
.an-label::before{content:'';display:block;height:1px;background:rgba(var(--c),.5);margin:0 -2px 6px}
.an-zh{margin-top:12px;font-size:13px;color:var(--ink-2);text-align:left;line-height:1.7}
.an-wrap .btn{margin:12px 0 0;display:inline-flex}
.feedback .an-box{flex:0 0 100%;width:100%;order:9}
.feedback .explain{flex:0 0 100%;width:100%;order:10}
.feedback .chunk-grid{flex:0 0 100%;width:100%}
.explain-modal{max-height:52vh;overflow:auto}
.em-en{font-size:16px;font-weight:600;line-height:1.5}
.em-zh{font-size:12px;color:var(--ink-3);margin:4px 0 10px}
.em-body{font-size:13px;line-height:1.85;color:var(--ink-2);white-space:pre-wrap}

/* 单词专项练习 */
.drill-row{display:flex;gap:8px;margin:0 0 12px}
.wd-card{text-align:center;padding:26px 16px 18px;border-radius:16px;background:rgba(18,40,75,.04);border:1px solid rgba(18,40,75,.10);margin-top:14px}
.wd-word{font-size:30px;font-weight:700;letter-spacing:-.01em}
.wd-opts{display:grid;gap:10px;margin-top:14px}
.wd-opt{padding:14px 12px;border-radius:12px;border:1.5px solid rgba(18,40,75,.1);background:rgba(18,40,75,.04);color:var(--ink);font-size:14px;text-align:left}
.wd-opt.ok{border-color:rgba(52,211,153,.6);background:rgba(52,211,153,.14)}
.wd-opt.bad{border-color:rgba(248,113,113,.55);background:rgba(248,113,113,.12)}

/* PK 房间 */
.pk-players{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:14px 0}
.pk-pl{padding:14px 10px;border-radius:14px;background:rgba(18,40,75,.04);border:1.5px solid rgba(18,40,75,.10);text-align:center}
.pk-pl.ready{border-color:rgba(52,211,153,.55);background:rgba(52,211,153,.1)}
.pk-pl .nm{font-size:14px;font-weight:600}
.pk-pl .st{font-size:11px;color:var(--ink-3);margin-top:4px}
.pk-wait-actions{display:flex;gap:10px;margin-top:8px}
.pk-wait-actions .btn{flex:1}
.pk-result-list{margin:14px 0 0;text-align:left}
.pk-form .seg{margin-top:6px}
.pk-form select{padding:10px 12px;border-radius:10px;background:rgba(18,40,75,.08);border:1px solid rgba(18,40,75,.1);color:var(--ink);width:100%}


/* 首页品牌 logo */
.home-hero{display:flex;align-items:center;gap:12px}
.home-hero .hh-main{flex:1;min-width:0}
.home-logo{width:46px;height:46px;border-radius:13px;flex:none;border:1px solid rgba(18,40,75,.18);box-shadow:0 6px 18px rgba(18,40,75,.28)}
.home-hero .hh-t{font-size:20px;font-weight:700;margin-top:6px;line-height:1.25}
.home-hero .hh-btn{background:#fffdf8;color:var(--brand-ink);flex:none}

/* 课程详情（对齐对标：封面头图 + 统计条 + 三枚操作 + 单元列表） */
.cd-hero-sm{position:relative;aspect-ratio:16/7;border-radius:16px;overflow:hidden;background-size:cover;background-position:center;display:flex;align-items:flex-end}
.cd-hero-mask{position:absolute;inset:0;background:linear-gradient(to top,rgba(18,40,75,.72),rgba(18,40,75,.05))}
.cd-hero-txt{position:relative;padding:14px 16px;color:#fffdf8}
.cd-title{font-size:19px;font-weight:700;line-height:1.3}
.cd-sub{font-size:12px;opacity:.85;margin-top:4px}
.cd-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.cd-stats div{background:rgba(18,40,75,.045);border-radius:12px;padding:10px 6px;text-align:center}
.cd-stats b{display:block;font-size:15px;color:var(--ink)}
.cd-stats span{font-size:10px;color:var(--ink-3)}
.cd-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:4px 0 6px}
.cd-act{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:14px;border:1px solid rgba(18,40,75,.09);background:rgba(18,40,75,.045);color:var(--ink-2);font-size:11px}
.cd-act svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cd-act.primary{background:linear-gradient(135deg,#7b6bff,#e8a33d);border-color:transparent;color:#fffdf8;font-weight:600}
.cd-act.on{color:#ff6fa5;border-color:rgba(255,111,165,.4)}
.cd-act:active{transform:scale(.97)}
.cd-units{display:flex;flex-direction:column;gap:8px}
.cd-unit{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(18,40,75,.04);border:1px solid rgba(18,40,75,.07);color:var(--ink);text-align:left;width:100%}
.cd-unit:active{transform:scale(.99)}
.cu-no{font-size:11px;color:var(--ink-3);width:26px;flex:none}
.cu-main{flex:1;min-width:0}
.cu-t{font-size:14px;font-weight:600}
.cu-s{font-size:11px;color:var(--ink-3);margin-top:3px}
.cu-bar{height:4px;border-radius:3px;background:rgba(18,40,75,.10);margin-top:7px;overflow:hidden}
.cu-bar i{display:block;height:100%;background:linear-gradient(90deg,#12284b,#e8a33d)}
.cu-right{width:22px;flex:none;display:flex;justify-content:flex-end}
.cu-right svg{width:18px;height:18px;fill:none;stroke:#34d399;stroke-width:2.4}
.cu-cnt{font-size:10px;color:var(--ink-3)}
#resetCourse svg{width:14px;height:14px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:2}

/* 顶栏标题：单行省略，避免三行挤压 */
.topbar .topbar-title{flex:1;min-width:0;font-size:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 验证码输入行：输入框自适应，按钮固定宽 */
.code-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:2px}
.code-row .input{width:100%;min-width:0}
.code-row .btn{min-width:108px;height:44px;padding:0 14px;white-space:nowrap}

/* 答对后的「下一句」：吸底常驻，不用下滑 */
.p-foot{position:relative}
.p-next{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom));z-index:25;box-shadow:0 10px 26px rgba(18,40,75,.14)}
@media(max-height:700px){.p-next{position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom))}}

/* 答对后的「下一句」：固定在视口底部，任何屏高都能直接点到 */
.p-next{position:fixed !important;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:40;box-shadow:0 10px 26px rgba(18,40,75,.16)}
.p-next:active{transform:scale(.99)}
/* 给固定按钮留出空间，避免遮住解析文字 */
.screen:has(.p-next){padding-bottom:96px}

/* 教材同步：学段 → 版本 → 年级 → 课本 */
.tb-head{margin:4px 0 14px}
.tb-title{font-size:20px;font-weight:700}
.tb-vers{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.tb-ver{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;border:1px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink);text-align:left}
.tb-ver:active{transform:scale(.99)}
.tb-ver-cv{width:52px;height:66px;border-radius:9px;flex:none;background-color:#222}
.tb-ver-body{flex:1;min-width:0}
.tb-ver-t{font-size:14px;font-weight:600;line-height:1.35}
.tb-ver-s{font-size:11px;color:var(--ink-3);margin-top:4px}
.tb-ver-ar{width:16px;flex:none;color:var(--ink-3);display:inline-flex}
.tb-ver-ar svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.tb-crumb{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-3);margin:2px 0 14px}
.tb-crumb button{background:none;border:0;color:var(--brand);font-size:12px;padding:0}
.tb-crumb b{color:var(--ink);font-weight:600}
.tb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tb-grade{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;border-radius:14px;border:1px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink)}
.tb-grade-cv{width:100%;aspect-ratio:3/4;border-radius:9px;background-color:#222}
.tb-grade-t{font-size:12px;font-weight:600;text-align:center;line-height:1.3}
.tb-grade-s{font-size:10px;color:var(--ink-3)}
.tb-books{display:flex;flex-direction:column;gap:10px}
.tb-book{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;border:1px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink);text-align:left}
.tb-book-cv{width:56px;height:74px;border-radius:10px;flex:none;background-color:#222}
.tb-book-body{flex:1;min-width:0}
.tb-book-t{font-size:14px;font-weight:600;line-height:1.35}
.tb-book-s{font-size:11px;color:var(--ink-3);margin-top:4px}

/* 教材同步（对标样式）：学段 tab + 版本/年级筛选 + 课本网格 */
.tm-wrap{padding-bottom:8px}
.tm-roots{margin:2px 0 12px}
.tm-roots button{flex:none;white-space:nowrap}
.tm-filter{background:rgba(18,40,75,.04);border:1px solid rgba(18,40,75,.07);border-radius:14px;padding:10px 12px;margin-bottom:14px}
.tm-frow{display:flex;align-items:flex-start;gap:8px;padding:6px 0}
.tm-frow + .tm-frow{border-top:1px solid rgba(18,40,75,.08)}
.tm-flabel{flex:none;width:30px;font-size:12px;color:var(--ink-3);padding-top:6px}
.tm-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:0}
.tm-chips.open{max-height:none}
.tm-chip{height:30px;padding:0 12px;border-radius:9px;border:1px solid rgba(18,40,75,.10);background:rgba(18,40,75,.04);color:var(--ink-2);font-size:12px;white-space:nowrap}
.tm-chip.on{background:rgba(18,40,75,.22);border-color:rgba(18,40,75,.7);color:#fffdf8;font-weight:600}
.tm-more{height:30px;padding:0 10px;border-radius:9px;border:0;background:none;color:var(--brand);font-size:12px}
.tm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.tm-book{display:flex;flex-direction:column;gap:6px;text-align:left;background:none;border:0;padding:0;color:var(--ink)}
.tm-book-cv{width:100%;aspect-ratio:3/4;border-radius:12px;background-color:#1a1b22;border:1px solid rgba(18,40,75,.10)}
.tm-book-t{font-size:12.5px;line-height:1.45;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tm-book-s{font-size:11px;color:var(--ink-3)}
.tm-foot{margin:20px 0 8px;font-size:10.5px;color:var(--ink-3);line-height:1.7;text-align:center}

/* 课程卡来源徽标 + 价格角标 */
.gcard{position:relative}
.gbadge-price{position:absolute;top:8px;right:8px;z-index:2;padding:2px 8px;border-radius:8px;background:rgba(18,40,75,.16);backdrop-filter:blur(6px);font-size:11px;font-weight:700;color:#ffd166}
.gfoot{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-3)}
.gbadge-src{display:inline-flex;align-items:center;height:16px;padding:0 6px;border-radius:5px;background:rgba(18,40,75,.18);color:#b9b2ff;font-size:10px}
.gfoot .hot{margin-left:auto;color:var(--ink-3)}

/* 首页：最高连续 / 累计打卡 */
.streak-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 18px}
.sk{padding:14px 14px 16px;border-radius:14px;background:rgba(18,40,75,.04);border:1px solid rgba(18,40,75,.07);text-align:center}
.sk-t{font-size:12px;color:var(--ink-3)}
.sk-v{margin-top:6px;font-size:26px;font-weight:800;letter-spacing:-.02em}
.sk-v small{font-size:12px;font-weight:400;color:var(--ink-3);margin-left:4px}

/* 教材网格：重复封面的文字占位 */
.tm-book-cv--txt{display:flex;align-items:center;justify-content:center;padding:10px;background:linear-gradient(150deg,rgba(18,40,75,.28),rgba(232,163,61,.16));border:1px solid rgba(18,40,75,.35)}
.tm-book-cv--txt span{font-size:13px;font-weight:700;line-height:1.5;color:#fffdf8;text-align:center}

/* 首页用户卡（D-21） */
.hh-user{display:flex;align-items:center;gap:8px;background:rgba(18,40,75,.16);border:0;border-radius:14px;padding:6px 10px 6px 6px;color:#fffdf8;margin-right:4px}
.hh-av{width:30px;height:30px;border-radius:10px;background:rgba(18,40,75,.22);display:grid;place-items:center;font-size:14px;font-weight:700}
.hh-um{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.hh-um b{font-size:12px;font-weight:700}
.hh-um i{font-style:normal;font-size:10px;opacity:.8}

/* 排行榜我的排名（D-18） */
.rank-mine{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px;padding:10px 14px;border-radius:12px;background:rgba(18,40,75,.14);border:1px solid rgba(18,40,75,.35);font-size:12.5px;color:var(--ink-2)}
.rank-mine b{color:#fffdf8;font-weight:700}
.rank-mine--none{background:rgba(18,40,75,.04);border-color:rgba(18,40,75,.10);justify-content:center;color:var(--ink-3)}

/* 生词兜底提示（D-31） */
.wd-banner{margin:0 0 12px;padding:8px 12px;border-radius:10px;background:rgba(255,193,7,.12);border:1px solid rgba(255,193,7,.28);color:#ffd66b;font-size:12px}

/* 课程详情单元状态徽标（D-22） */
.cu-badge{display:inline-block;padding:1px 6px;border-radius:5px;font-size:10px;margin-right:4px}
.cu-badge.ok{background:rgba(52,199,89,.18);color:#5ee08a}
.cu-badge.doing{background:rgba(255,193,7,.16);color:#ffd66b}
.cu-badge.none{background:rgba(18,40,75,.10);color:var(--ink-3)}

/* 设置项滑杆（D-20） */
input[type=range]{accent-color:var(--brand);height:24px}

/* PK 四个快速入口（D-17） */
.pk-entries{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
.pk-entry{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:14px;border:1px solid rgba(18,40,75,.10);background:linear-gradient(160deg,rgba(18,40,75,.16),rgba(232,163,61,.08));color:var(--ink);text-align:left}
.pk-entry b{font-size:13.5px}
.pk-entry span{font-size:10.5px;color:var(--ink-3);line-height:1.4}
.pk-entry:active{transform:scale(.99)}

/* 答对反馈：飘字 + 粒子 + 连击（练习页） */
.feedback.p-right{position:relative;overflow:hidden;animation:okPop .28s cubic-bezier(.2,1.4,.4,1)}
@keyframes okPop{0%{transform:scale(.96)}60%{transform:scale(1.02)}100%{transform:scale(1)}}
.p-reward{position:absolute;right:14px;top:10px;font-size:15px;font-weight:800;color:#5ee08a;animation:rewardUp .95s ease-out forwards;pointer-events:none}
@keyframes rewardUp{0%{opacity:0;transform:translateY(10px) scale(.9)}25%{opacity:1}100%{opacity:0;transform:translateY(-26px) scale(1.05)}}
.p-combo{display:inline-flex;align-items:center;margin-left:6px;padding:1px 8px;border-radius:8px;background:rgba(255,193,7,.2);color:#ffd66b;font-size:12px;font-weight:700}
.p-particles{position:absolute;inset:0;pointer-events:none}
.p-particles i{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:#7ef0a5;opacity:0;animation:burst .7s ease-out forwards}
.p-particles i:nth-child(1){--x:-58px;--y:-30px;animation-delay:.02s;background:#7ef0a5}
.p-particles i:nth-child(2){--x:52px;--y:-34px;animation-delay:.05s;background:#8fd0ff}
.p-particles i:nth-child(3){--x:-40px;--y:26px;animation-delay:.08s;background:#ffd66b}
.p-particles i:nth-child(4){--x:46px;--y:22px;animation-delay:.11s;background:#c9a4ff}
.p-particles i:nth-child(5){--x:-12px;--y:-44px;animation-delay:.14s;background:#7ef0a5}
.p-particles i:nth-child(6){--x:14px;--y:40px;animation-delay:.17s;background:#8fd0ff}
.p-particles i:nth-child(7){--x:-70px;--y:6px;animation-delay:.2s;background:#ffd66b}
.p-particles i:nth-child(8){--x:70px;--y:-2px;animation-delay:.23s;background:#c9a4ff}
@keyframes burst{0%{opacity:0;transform:translate(0,0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1.1)}}

/* ===== 组合反馈：A 飘字粒子 + B 连击大字 + C 每10句结算卡 + 碎片转场 ===== */
.settle-inline{flex:0 0 100%;order:1;margin:0 0 8px}
.si-h{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:#8ef0b0}
.si-h .chk{width:16px;height:16px;border-radius:50%;background:#5ee08a;color:#0a2a14;display:grid;place-items:center;font-size:11px;font-weight:900}
.si-s{font-size:11px;color:var(--ink-3);margin:4px 0 6px}
.si-bar{height:3px;border-radius:3px;background:rgba(18,40,75,.1);overflow:hidden}
.si-bar i{display:block;height:100%;background:linear-gradient(90deg,#5ee08a,#e8a33d);transition:width .45s ease}

/* B：连击≥3 的「太棒了！」横幅 */
.combo-banner{flex:0 0 100%;order:0;text-align:center;font-size:24px;font-weight:900;color:#7ef0a5;letter-spacing:.03em;
  text-shadow:0 2px 18px rgba(94,224,138,.45);animation:comboBanner 1.05s ease forwards}
@keyframes comboBanner{0%{opacity:0;transform:scale(.78)}22%{opacity:1;transform:scale(1)}72%{opacity:1}100%{opacity:0;transform:scale(1.06)}}

/* C：每 10 句弹一次结算卡（屏幕中央） */
.settle-card{position:fixed;left:50%;top:44%;transform:translate(-50%,-50%) scale(.92);z-index:90;width:250px;padding:18px 18px 16px;border-radius:16px;
  background:linear-gradient(160deg,#16233a,#fffdf8);border:1px solid rgba(18,40,75,.55);box-shadow:0 20px 50px rgba(18,40,75,.18);text-align:center;
  animation:settleIn .26s cubic-bezier(.2,1.4,.4,1) forwards}
.settle-card.out{animation:settleOut .24s ease forwards}
@keyframes settleIn{from{opacity:0;transform:translate(-50%,-50%) scale(.86)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes settleOut{to{opacity:0;transform:translate(-50%,-52%) scale(.96)}}
.sc-h{font-size:15px;font-weight:800;color:#fffdf8}
.sc-s{font-size:11px;color:#9fb0c8;margin:6px 0 10px}
.sc-bar{height:4px;border-radius:4px;background:#232838;overflow:hidden}
.sc-bar i{display:block;height:100%;background:linear-gradient(90deg,#5ee08a,#e8a33d)}

/* 碎片转场 */
.shatter-layer{will-change:transform}
.shatter-tile{will-change:transform,opacity}

/* 配图裂纹淡出 */
.crack-layer{animation:crackFlash .34s ease-out}
@keyframes crackFlash{0%{opacity:0}18%{opacity:1}70%{opacity:.85}100%{opacity:.15}}
.crack-layer.crack-fade{animation:none;opacity:0;transition:opacity .18s ease}

.combo-banner--big{font-size:27px;color:#ffd66b;text-shadow:0 2px 22px rgba(255,193,7,.55)}

/* ===== 响应式：手机横屏 / 平板 / PC ===== */

/* 手机横屏 + PC：练习页左右分栏 */
@media (orientation: landscape) and (max-height: 620px), (min-width: 1024px) {
  .screen.practice-screen[data-twocol]{
    display:grid;
    grid-template-columns:minmax(0, 42%) minmax(0, 1fr);
    grid-template-rows:auto auto 1fr;
    gap:8px 16px;
    align-content:start;
    padding-bottom:64px;
  }
  .practice-screen[data-twocol] > .p-head{grid-column:1 / -1;grid-row:1;margin-bottom:4px}
  .practice-screen[data-twocol] > .p-bar{grid-column:1 / -1;grid-row:2;margin-bottom:6px}
  .practice-screen[data-twocol] > .pr-left{grid-column:1;grid-row:3;min-width:0}
  .practice-screen[data-twocol] > .pr-right{grid-column:2;grid-row:3;min-width:0;display:flex;flex-direction:column;gap:6px}
  .practice-screen[data-twocol] .scene{margin:0;max-height:52vh;border-radius:12px}
  .practice-screen[data-twocol] .zh{font-size:19px;margin:4px 0 2px}
  .practice-screen[data-twocol] .p-foot{margin-top:6px}
  .practice-screen[data-twocol] .p-next{position:sticky;bottom:8px}
  .practice-screen[data-twocol] .answer{min-height:56px}
  .practice-screen[data-twocol] .pool .chip{padding:8px 12px}
  .practice-screen[data-twocol] .feedback{margin-top:4px}
}

/* 手机横屏：顶栏紧凑、隐藏底部导航与侧边悬浮 */
@media (orientation: landscape) and (max-height: 520px) {
  .topbar{height:44px;padding:0 10px}
  .topbar .search{height:34px;font-size:12px}
  .tabbar{display:none}
  .rail{display:none}
  .screen{padding:8px 12px 12px !important;padding-bottom:12px !important}
}

/* 平板竖屏：放宽内容区 + 三列卡片 */
@media (min-width: 700px) and (orientation: portrait) {
  .app{max-width:760px}
  .tabbar{max-width:760px}
  .grid2{grid-template-columns:repeat(3, 1fr)}
  .tm-grid{grid-template-columns:repeat(4, 1fr)}
  .stat-cards{grid-template-columns:repeat(2, 1fr)}
  .wrong-grid{grid-template-columns:repeat(2, 1fr)}
}

/* PC：右侧留白变侧栏，内容放宽到 1040 */
@media (min-width: 1024px) {
  .app{max-width:1040px}
  .tabbar{max-width:1040px}
  .grid2{grid-template-columns:repeat(4, 1fr)}
  .tm-grid{grid-template-columns:repeat(5, 1fr)}
  .stat-cards{grid-template-columns:repeat(4, 1fr)}
  .wrong-grid{grid-template-columns:repeat(4, 1fr)}
  .screen{padding-left:24px;padding-right:24px}
}

/* 极宽屏：不再无限拉伸 */
@media (min-width: 1440px) {
  .app{max-width:1180px}
}

/* 横屏：铺满宽度，不再套手机框 */
@media (orientation: landscape) and (max-height: 620px) {
  .app{max-width:none;border-radius:0;border:0;box-shadow:none}
  .tabbar{max-width:none}
  .screen{padding-left:16px;padding-right:16px}
}

/* 横屏练习：图片撑满左栏、顶栏更紧凑 */
@media (orientation: landscape) and (max-height: 620px) {
  .practice-screen[data-twocol] .scene{aspect-ratio:auto;max-height:none;height:calc(100dvh - 168px);min-height:140px}
  .practice-screen[data-twocol] .p-modes .pm{height:30px;font-size:12px;padding:0 6px}
  .practice-screen[data-twocol] > .p-head{gap:6px;margin-bottom:2px}
  .practice-screen[data-twocol] .p-modes{gap:6px}
}

/* ---------- 方向 A 收尾：字号与票据细节 ---------- */
.topbar{background:rgba(246,241,231,.94)}
.tabbar{background:rgba(255,253,248,.97);border-top:1px solid var(--line)}
.app{background:var(--bg)}
body{background:var(--bg)}
.btn{box-shadow:0 8px 20px rgba(18,40,75,.20)}
.p-next{background:var(--ink);color:#fffdf8}
.screen{padding-bottom:calc(96px + env(safe-area-inset-bottom))}

/* ===== 方向 A 最终覆盖层（航图 / Boarding）===== */
/* 品牌色统一：海军蓝主色 + 琥珀强调 */
.home-hero{
  color:#fffdf8;
  background:linear-gradient(120deg,#12284b,#1c3a66 62%,#24476f);
  border:1px solid rgba(255,253,248,.18);
  box-shadow:0 12px 28px rgba(18,40,75,.18);
}
.home-hero .btn.sm,.home-hero .hh-btn{background:#e8a33d!important;color:#12284b!important;font-weight:700}
.home-hero .hh-t{color:#fffdf8}
.home-hero .hh-um,.home-hero .hh-user{color:rgba(255,253,248,.78)}

.holiday-bar{
  background:linear-gradient(100deg,#f6e3c2,#fbf3e3);
  border:1px solid #e8cfa0;color:#12284b;border-radius:12px
}
.holiday-bar .hb-l b{color:#12284b}
.holiday-bar .hb-r{color:#a8660f}

.home-quote{
  background:#fffdf8;border:1px dashed rgba(18,40,75,.26);border-radius:12px;
  position:relative;box-shadow:0 1px 2px rgba(18,40,75,.05)
}
.home-quote::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;background:#e8a33d;border-radius:0 3px 3px 0}
.home-quote .hq-en{color:#12284b;font-family:Georgia,"Times New Roman",serif}
.home-quote .hq-zh{color:#55617a}
.home-quote .hq-tag{background:#f6e3c2;color:#a8660f;border:1px solid #e8cfa0}

.home-saying{background:#fbf7ee;border:1px solid rgba(18,40,75,.12);border-radius:12px;color:#12284b}

/* 统计/进度：琥珀 */
.ubar,.p-bar{background:rgba(18,40,75,.10)}
.ubar i,.p-bar i,.cu-bar i{background:#e8a33d}
.cal-heat i{background:#e8a33d}

/* 分段器选中：海军蓝 */
.seg .on,.nb-tabs .on,.pm.on,.tm-chip.on,.pmode.on{background:#12284b;color:#fffdf8}

/* 侧边悬浮按钮（推荐导师 / 客服） */
.rail button{background:#12284b;color:#fffdf8;border:1px solid rgba(255,253,248,.16)}
.rail button.gold{background:#e8a33d;color:#12284b}

/* 卡片/词块 */
.card,.gb-card,.ucard,.price-card,.tm-book,.wd-card,.ph-card{background:#fffdf8;border:1px solid rgba(18,40,75,.14);box-shadow:0 1px 2px rgba(18,40,75,.05)}
.chip,.pool .chip{background:#fffdf8;border:1px solid rgba(18,40,75,.26);color:#12284b;border-radius:4px}
.answer .chip{background:#f6e3c2;border-color:#e8cfa0;color:#12284b}
.chip.used,.chip[disabled]{opacity:.4}
.answer{background:#fbf7ee;border:1px dashed rgba(18,40,75,.26);border-radius:12px}

/* 练习页 */
.scene{background:#fbf7ee;border:1px solid rgba(18,40,75,.26);border-radius:12px}
.p-foot .btn,.p-next{background:#12284b;color:#fffdf8;border-radius:999px;box-shadow:0 8px 20px rgba(18,40,75,.22)}
.feedback.ok{background:#eaf3ee;border:1px solid #b8d6c4;color:#1f5c44}
.feedback.bad{background:#fbe7e4;border:1px solid #e6b3ad;color:#b8382f}
.settle-inline .si-h{color:#1f5c44}
.si-bar i{background:linear-gradient(90deg,#e8a33d,#d98b1c)}
.combo-banner{color:#a8660f;text-shadow:none}

/* 顶部导航 / 底栏 */
.topbar{background:rgba(246,241,231,.94);border-bottom:0}
.topbar.scrolled{border-bottom:1px solid rgba(18,40,75,.14)}
.search{background:#fffdf8;border:1px solid rgba(18,40,75,.14);color:#7b8496}
.tabbar{background:rgba(255,253,248,.97);border-top:1px solid rgba(18,40,75,.14);box-shadow:0 -1px 0 rgba(18,40,75,.04)}

/* 抽屉 */
.drawer{background:#fffdf8;border-right:1px solid rgba(18,40,75,.12)}
.drawer .nv.on{background:#f6e3c2;color:#12284b}

/* 按钮 */
.btn{background:#12284b;color:#fffdf8;box-shadow:0 8px 20px rgba(18,40,75,.20)}
.btn.ghost{background:transparent;color:#12284b;border:1px solid rgba(18,40,75,.26);box-shadow:none}

/* 文字层级兜底 */
body{color:#12284b}
.muted,.tiny.muted,.sec-h .more{color:#7b8496}

/* 数字：serif + 等宽 */
.stat-big,.home-num{font-family:Georgia,"Times New Roman",serif;font-variant-numeric:tabular-nums}

/* A2 修正层：内联样式覆盖 + 小件统一 */
.holiday-bar{background:linear-gradient(100deg,#f6e3c2,#fbf3e3)!important;color:#12284b!important;border:1px solid #e8cfa0!important}
.holiday-bar .hb-l b{color:#12284b!important}
.holiday-bar .hb-l span,.holiday-bar .hb-r{color:#a8660f!important;opacity:1!important}
.hq-tag{display:inline-block!important;width:auto!important;background:#f6e3c2!important;color:#a8660f!important;border:1px solid #e8cfa0!important;border-radius:4px!important;padding:2px 8px!important;font-size:11px!important;font-weight:600!important}
.hs-t{display:inline-block;background:#f6e3c2;color:#a8660f;border-radius:4px;padding:1px 6px;font-size:11px;font-weight:600}
.avatar,.hh-av,.gb-av{background:linear-gradient(140deg,#24476f,#12284b)!important;color:#fffdf8!important}
.seg .on,.seg button.on{background:#12284b!important;color:#fffdf8!important}
.stat-ic,.stat-cards .ic{background:linear-gradient(140deg,#24476f,#12284b)!important;color:#fffdf8!important}
.rank-mini,.rank-podium{background:#f6e3c2!important;border-color:#e8cfa0!important}
/* 悬浮推荐导师按钮：竖排胶囊 */
.rail button{width:44px;min-height:44px;border-radius:999px;font-size:10px;line-height:1.15;padding:6px 4px;text-align:center}
/* 首页统计 tab */
.seg{border:1px solid rgba(18,40,75,.14);background:#fbf7ee}
/* 课程卡封面下沿渐变遮罩：浅色主题下减淡 */
.co-card .mask-b,.gb-mask{background:linear-gradient(to top,rgba(18,40,75,.55),transparent)}
/* 列表行 */
.lot9-cell,.nm-box,.wd-opt{background:#fffdf8;border-color:rgba(18,40,75,.14);color:#12284b}
.wd-opt.on{background:#f6e3c2;border-color:#e8cfa0}
/* 价格区 */
.price-card.hot{background:linear-gradient(160deg,#f6e3c2,#fffdf8);border-color:#e8cfa0}
/* 黄色/金色字在浅底上看不清 → 深琥珀 */
.gold,.text-gold,.hot{color:#a8660f!important}

/* A3 深色残留清理 */
.p-foot{background:linear-gradient(180deg,rgba(246,241,231,0),rgba(246,241,231,.96) 34%)!important}
.p-foot .btn,.p-next{background:#12284b!important;color:#fffdf8!important}
.drawer .u .av,.avatar,.hh-av{background:linear-gradient(140deg,#24476f,#12284b)!important;color:#fffdf8!important;font-weight:600}
.p-count{background:transparent!important;color:#55617a!important}
.pool{background:transparent}
.pool .chip{background:#fffdf8!important;border:1px solid rgba(18,40,75,.26)!important;color:#12284b!important;opacity:1!important}
.pool .chip:not([disabled]){cursor:pointer}
.pool .chip[disabled],.pool .chip.used{opacity:.38!important}
/* 练习页说明文字 */
.p-tools .btn.ghost{background:#fffdf8;border:1px solid rgba(18,40,75,.2);color:#12284b}
/* 顶部返回/图标 */
.icon-btn,.tb-btn,.topbar .ic{color:#12284b}
/* 弹层遮罩 */
.mask.show{background:rgba(18,40,75,.42)!important}
/* 输入框 */
input,textarea{background:#fffdf8!important;color:#12284b!important}
/* 进度条 */
.p-bar{background:rgba(18,40,75,.12)!important}
.p-bar i{background:#e8a33d!important}
/* 练习页统计小字 */
.p-head .idx,.p-head .timer{color:#55617a}

/* A4 底部导航占位 + 样式 */
.tabbar{display:flex;align-items:stretch;justify-content:space-around;height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);
  position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:560px;z-index:40;
  background:rgba(255,253,248,.97);border-top:1px solid rgba(18,40,75,.14);backdrop-filter:blur(10px)}
.tabbar .tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;color:#7b8496;position:relative;text-decoration:none}
.tabbar .tab svg{width:22px;height:22px}
.tabbar .tab.on{color:#12284b;font-weight:600}
.tabbar .tab.on::before{content:"";position:absolute;top:0;width:18px;height:2px;border-radius:2px;background:#e8a33d}
.screen{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
@media(min-width:640px){.tabbar{max-width:560px;bottom:16px;border-radius:14px}}

/* A5 封面与头像：清掉最后一批紫色 */
.cover.c0{background:linear-gradient(150deg,#24476f,#12284b)!important;color:#fffdf8!important}
.cover.c1{background:linear-gradient(150deg,#2f6f5f,#16302b)!important;color:#fffdf8!important}
.cover.c2{background:linear-gradient(150deg,#a8660f,#5c3a08)!important;color:#fffdf8!important}
.topbar .av,.topbar .avatar,.topbar a .av{background:linear-gradient(140deg,#24476f,#12284b)!important;color:#fffdf8!important}
.gb-av,.hh-av{background:linear-gradient(140deg,#24476f,#12284b)!important}
/* 悬浮按钮缩小，别挡内容 */
.rail{right:8px;bottom:88px;gap:6px}
.rail button{width:40px;min-height:40px;font-size:10px;border-radius:12px;padding:5px 3px;line-height:1.15;text-align:center}
.rail button.gold{background:#e8a33d!important;color:#12284b!important}
/* 已拥有/来源标签 */
.cu-badge,.gbadge-src{background:#f6e3c2!important;border:1px solid #e8cfa0!important;color:#a8660f!important}
/* 课包卡标题 */
.cu-t{color:#12284b}
.cu-s{color:#7b8496}

/* A6 头像/悬浮按钮收尾 */
.avatar-sm{background:linear-gradient(140deg,#24476f,#12284b)!important;color:#fffdf8!important;border:1px solid rgba(18,40,75,.2)}
.tbtn .avatar-sm{font-weight:600}
.rail{right:10px;bottom:96px}
.rail button{width:40px;height:auto;min-height:40px;font-size:10px;border-radius:10px;padding:6px 3px;line-height:1.2}

/* A7 词块文字对比度（修复浅色下看不清） */
.pool .chip,.answer .chip,.chip{
  color:#12284b!important;
  background:#fffdf8!important;
  border:1px solid rgba(18,40,75,.26)!important;
  opacity:1;
}
.answer .chip{background:#f6e3c2!important;border-color:#d9b978!important;color:#12284b!important}
.chip.used,.chip[disabled],.pool .chip[disabled]{color:#7b8496!important;opacity:.75!important;background:#f3ecdf!important}
.chip .lbl,.chip span{color:inherit!important}
.answer .ph{color:#7b8496!important}

/* 法务页面排版 */
.legal-screen{max-width:680px;margin:0 auto;padding:4px 0 32px}
.legal-title{font-size:22px;font-weight:700;margin:8px 0 6px;color:#12284b;letter-spacing:-.01em}
.legal-meta{font-size:11px;color:#7b8496;margin-bottom:16px}
.legal-sec{margin:18px 0}
.legal-sec h2{font-size:15px;font-weight:700;margin:0 0 8px;color:#12284b}
.legal-sec p{font-size:13.5px;line-height:1.95;color:#3a4763;margin:0 0 6px;text-align:justify}
.legal-link{color:#12284b;text-decoration:underline;text-underline-offset:2px}
[data-theme="dark"] .legal-title,[data-theme="dark"] .legal-sec h2{color:#fffdf8}
[data-theme="dark"] .legal-sec p{color:rgba(255,253,248,.78)}
[data-theme="dark"] .legal-meta{color:rgba(255,253,248,.45)}

/* 注销账号弹层 */
.del-mask{position:fixed;inset:0;z-index:120;background:rgba(18,40,75,.45);display:flex;align-items:center;justify-content:center;padding:20px}
.del-modal{width:100%;max-width:340px;background:#fffdf8;border:1px solid rgba(18,40,75,.16);border-radius:16px;padding:20px;box-shadow:0 16px 48px rgba(18,40,75,.22)}
.del-h{font-size:17px;font-weight:700;color:#12284b;margin-bottom:10px}
.del-warn{font-size:12.5px;line-height:1.8;color:#b8382f;background:#fbe7e4;border:1px solid #e6b3ad;border-radius:10px;padding:10px 12px;margin-bottom:12px}
.del-warn b{color:#8f231c}
.del-tip{font-size:12px;color:#55617a;margin-bottom:8px}
.del-input{width:100%}
.del-acts{display:flex;gap:10px;margin-top:14px}
.del-acts .btn{flex:1;height:46px}
.del-ok{background:#b8382f!important;color:#fffdf8!important}
.del-ok[disabled]{opacity:.45}
[data-theme="dark"] .del-modal{background:#16171c;border-color:rgba(255,255,255,.14)}
[data-theme="dark"] .del-h{color:#fffdf8}
[data-theme="dark"] .del-tip{color:rgba(255,253,248,.6)}
[data-theme="dark"] .del-input{background:#22232a;color:#fffdf8;border-color:rgba(255,255,255,.14)}

/* A8 词书封面 / 课程详情 / 生词本 */
.gcv{color:#12284b!important;border:1px solid rgba(18,40,75,.14);border-radius:12px}
.gemoji--serif{font-family:Georgia,"Times New Roman",serif!important;font-size:44px!important;color:#12284b!important;opacity:.9;text-shadow:none!important}
.gcv .gctitle{color:#12284b!important;font-weight:700}
.gcv .cnum{color:#a8660f!important;background:rgba(232,163,61,.16);border:1px solid rgba(232,163,61,.4);border-radius:4px;padding:1px 6px;font-size:11px}

/* 课程详情：封面遮罩 + 开始学习按钮 */
.cd-hero{position:relative}
.cd-hero-mask{background:linear-gradient(to top,rgba(18,40,75,.86) 0%,rgba(18,40,75,.55) 45%,rgba(18,40,75,.12) 100%)!important}
.cd-hero-txt,.cd-title{color:#fffdf8!important;text-shadow:0 2px 12px rgba(18,40,75,.45)}
.cd-sub,.cd-unit{color:rgba(255,253,248,.86)!important}
.cd-act{background:#fffdf8!important;color:#12284b!important;border:1px solid rgba(18,40,75,.16)!important;box-shadow:none!important}
.cd-act.primary,.cd-act.primary span{background:#12284b!important;color:#fffdf8!important;border-color:#12284b!important}
.cd-act.primary svg{color:#e8a33d!important}

/* 生词本 tabs 选中态 */
.nb-tabs .on,.nb-tabs button.on{background:#12284b!important;color:#fffdf8!important;border-color:#12284b!important}
.nb-tabs button{background:#fffdf8;border:1px solid rgba(18,40,75,.14);border-radius:10px;color:#12284b}
.nb-tabs button b{color:#12284b}
.nb-tabs button.on b{color:#fffdf8}

/* A9 横屏底栏与外壳（避免桌面样式在手机横屏上生效） */
@media (orientation:landscape) and (max-height:620px){
  body{padding:0!important;background:var(--bg)!important}
  .app{max-width:none!important;min-height:100dvh;border-radius:0!important;border:0!important;box-shadow:none!important}
  .tabbar{max-width:none!important;left:0!important;transform:none!important;bottom:0!important;border-radius:0!important;width:100%!important}
  .topbar{padding:6px 10px!important}
  .screen{padding-bottom:64px!important}
}

/* A10 空态插画：航线纸卡（替换 emoji） */
.empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:32px 16px;color:#7b8496}
.empty .e{
  font-size:0!important;line-height:0;
  width:110px;height:88px;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%2096%22%20fill%3D%22none%22%3E%0A%3Crect%20x%3D%2218%22%20y%3D%2214%22%20width%3D%2284%22%20height%3D%2262%22%20rx%3D%228%22%20fill%3D%22%23fffdf8%22%20stroke%3D%22%2312284b%22%20stroke-opacity%3D%22.28%22%20stroke-width%3D%221.6%22%2F%3E%0A%3Cpath%20d%3D%22M28%2030h64M28%2042h44M28%2054h52%22%20stroke%3D%22%2312284b%22%20stroke-opacity%3D%22.16%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M22%2070C42%2070%2048%2034%2074%2030%22%20stroke%3D%22%23e8a33d%22%20stroke-width%3D%221.8%22%20stroke-dasharray%3D%224%204%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3Ccircle%20cx%3D%2274%22%20cy%3D%2230%22%20r%3D%223.6%22%20fill%3D%22%23e8a33d%22%2F%3E%0A%3Cpath%20d%3D%22M86%2022l14-5-6%2013-3.4-4.6L86%2022z%22%20fill%3D%22%2312284b%22%2F%3E%0A%3Ccircle%20cx%3D%2222%22%20cy%3D%2270%22%20r%3D%223%22%20fill%3D%22%2312284b%22%20fill-opacity%3D%22.5%22%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat:no-repeat;background-position:center;background-size:contain;
  opacity:.95;
}
.empty p{font-size:13px;line-height:1.7;text-align:center;margin:0;color:#7b8496}
[data-theme="dark"] .empty p{color:rgba(255,253,248,.5)}
[data-theme="dark"] .empty .e{opacity:.85}

/* A11 PC 常驻侧栏：≥1024 时左侧导航固定，隐藏汉堡与底部导航 */
@media (min-width:1024px){
  body{padding:0!important;background:var(--bg-2)!important}
  .app{margin-left:240px!important;max-width:calc(100% - 240px)!important;min-height:100dvh;border-radius:0!important;border:0!important;box-shadow:none!important}
  .drawer{
    display:block!important;transform:none!important;position:fixed!important;
    left:0!important;top:0!important;bottom:0!important;width:240px!important;
    background:#fffdf8!important;border-right:1px solid rgba(18,40,75,.12)!important;
    z-index:50!important;padding:18px 14px!important;overflow-y:auto!important;
  }
  .drawer .nv.on{background:#f6e3c2!important;color:#12284b!important}
  .mask{display:none!important}
  .burger{display:none!important}
  .tabbar{display:none!important}
  .screen{padding-bottom:24px!important}
  .topbar{padding:14px 24px!important}
  .screen{padding-left:28px;padding-right:28px}
  .rail{right:20px;bottom:24px}
}

/* A12 侧栏导航选中态（航图：琥珀浅底 + 深蓝字） */
.ditem{border-radius:10px;color:#12284b}
.ditem.on{background:#f6e3c2!important;color:#12284b!important;box-shadow:none!important;border:1px solid #e8cfa0!important}
.ditem.on span{color:#12284b!important}
.ditem.on svg{color:#a8660f!important}
.ditem .badge{background:#b8382f!important;color:#fffdf8!important;border-radius:999px;padding:0 5px;font-size:10px}
.drawer .u .n{color:#12284b!important;font-weight:700}
.drawer .u .remain{color:#a8660f!important}
.drawer .dfooter{color:#7b8496}

/* A13 宽屏优化（≥1280 / ≥1600） */
@media (min-width:1280px){
  .app{max-width:1240px!important}
  .grid2{grid-template-columns:repeat(5,1fr)}
  .tm-grid{grid-template-columns:repeat(6,1fr)}
  .wrong-grid,.study-grid{grid-template-columns:repeat(3,1fr)}
  .cd-units{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .cd-units .cd-unit{margin:0}
  .practice-screen[data-twocol]{grid-template-columns:minmax(0,46%) minmax(0,1fr)}
  .practice-screen[data-twocol] .scene{max-height:62vh}
  .stat-cards{grid-template-columns:repeat(4,1fr)}
  .home-hero{padding:24px 28px}
  .home-hero h1,.home-hero .hh-t{font-size:28px}
}
@media (min-width:1600px){
  .app{max-width:1400px!important}
  .grid2{grid-template-columns:repeat(6,1fr)}
  .tm-grid{grid-template-columns:repeat(7,1fr)}
  .cd-units{grid-template-columns:repeat(3,1fr)}
}

/* A14 宽屏封面高度限制 */
@media (min-width:1024px){
  .cd-hero{max-height:320px;min-height:200px;background-size:cover!important;background-position:center!important}
  .cd-hero img{max-height:320px;width:100%;object-fit:cover}
}

/* A15 无配图占位：航线小插画（替换「配图」文字） */
.scene.noimg .scene-fallback{
  font-size:0!important;color:transparent!important;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%2096%22%20fill%3D%22none%22%3E%0A%3Crect%20x%3D%221%22%20y%3D%221%22%20width%3D%22158%22%20height%3D%2294%22%20rx%3D%2210%22%20stroke%3D%22%2312284b%22%20stroke-opacity%3D%22.18%22%20stroke-dasharray%3D%225%205%22%2F%3E%0A%3Cpath%20d%3D%22M18%2070C40%2070%2046%2036%2074%2032%22%20stroke%3D%22%23e8a33d%22%20stroke-width%3D%222%22%20stroke-dasharray%3D%225%204%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3Ccircle%20cx%3D%2218%22%20cy%3D%2270%22%20r%3D%223.4%22%20fill%3D%22%2312284b%22%20fill-opacity%3D%22.45%22%2F%3E%0A%3Ccircle%20cx%3D%2274%22%20cy%3D%2232%22%20r%3D%224%22%20fill%3D%22%23e8a33d%22%2F%3E%0A%3Cpath%20d%3D%22M96%2026l20-8-9%2018-4.4-6.2L96%2026z%22%20fill%3D%22%2312284b%22%20fill-opacity%3D%22.8%22%2F%3E%0A%3Cpath%20d%3D%22M104%2060h34M104%2070h22%22%20stroke%3D%22%2312284b%22%20stroke-opacity%3D%22.16%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat:no-repeat;background-position:center;background-size:contain;
  opacity:.9;
}
.scene.noimg{background:#fbf7ee!important}
[data-theme="dark"] .scene.noimg{background:#16171c!important}

/* A16 底部导航浅色修正（覆盖旧 [data-theme=light] 的深色底） */
[data-theme="light"] .tabbar, :root .tabbar{
  background:rgba(255,253,248,.97)!important;
  border-top:1px solid rgba(18,40,75,.14)!important;
  box-shadow:0 -1px 0 rgba(18,40,75,.04);
}
[data-theme="light"] .tabbar .tab, :root .tabbar .tab{color:#7b8496!important}
[data-theme="light"] .tabbar .tab.on, :root .tabbar .tab.on{color:#12284b!important}

/* 备案号 */
.icp-line{margin:20px 0 4px;text-align:center;font-size:11.5px;color:#7b8496;line-height:1.8}
.icp-line a{color:#7b8496;text-decoration:none;border-bottom:1px solid rgba(18,40,75,.2)}
[data-theme="dark"] .icp-line,[data-theme="dark"] .icp-line a{color:rgba(255,253,248,.42);border-color:rgba(255,255,255,.2)}

/* 今日复习入口 + 复习页 */
.review-entry{display:flex;align-items:center;justify-content:space-between;width:100%;margin:12px 0;padding:14px 16px;border-radius:12px;
  background:linear-gradient(105deg,#12284b,#1c3a66);color:#fffdf8;border:1px solid rgba(255,253,248,.14);cursor:pointer}
.review-entry:active{transform:scale(.995)}
.review-entry .re-t{font-size:14.5px;font-weight:700}
.review-entry .re-s{font-size:11.5px;color:rgba(255,253,248,.72);margin-top:3px}
.review-entry .re-r{font-size:12px;color:#e8a33d;font-weight:600;white-space:nowrap}

.rv-head{display:flex;gap:24px;margin:6px 0 14px}
.rv-num{font-size:12.5px;color:#7b8496}
.rv-num b{font-family:Georgia,serif;font-size:22px;color:#12284b;margin-right:4px}
.rv-card{background:#fffdf8;border:1px solid rgba(18,40,75,.14);border-radius:16px;padding:26px 18px 18px;text-align:center;box-shadow:0 1px 2px rgba(18,40,75,.05)}
.rv-w{font-family:Georgia,"Times New Roman",serif;font-size:32px;font-weight:600;color:#12284b;letter-spacing:-.01em}
.rv-p{font-size:12.5px;color:#7b8496;margin-top:6px;min-height:18px}
.rv-zh{font-size:17px;color:#12284b;margin-top:12px;font-weight:600}
.rv-acts{display:flex;gap:10px;margin-top:18px}
.rv-acts .btn{flex:1;height:46px;border-radius:999px}
.rv-acts .btn.ghost{background:#f6e3c2;border-color:#e8cfa0;color:#12284b}
.rv-progress{margin-top:12px;font-size:11.5px;color:#7b8496}
.rv-sents{display:flex;flex-direction:column;gap:10px}
.rv-sent{text-align:left;background:#fffdf8;border:1px solid rgba(18,40,75,.14);border-radius:12px;padding:12px 14px;cursor:pointer}
.rv-sent:active{transform:scale(.997)}
.rv-sent .rs-en{font-size:14px;color:#12284b;font-weight:600}
.rv-sent .rs-zh{font-size:12px;color:#7b8496;margin-top:4px}
[data-theme="dark"] .rv-card,[data-theme="dark"] .rv-sent{background:#16171c;border-color:rgba(255,255,255,.1)}
[data-theme="dark"] .rv-w,[data-theme="dark"] .rv-zh{color:#fffdf8}
[data-theme="dark"] .rv-num b{color:#fffdf8}

/* 单词听写 */
.dict-entry{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:12px 14px;background:#fffdf8;border:1px solid rgba(18,40,75,.14);border-radius:12px}
.dict-entry .btn{height:40px;border-radius:999px;padding:0 18px}
.dict-box{background:#fffdf8;border:1px solid rgba(18,40,75,.14);border-radius:16px;padding:20px 18px;text-align:center;box-shadow:0 1px 2px rgba(18,40,75,.05)}
.dict-h{display:flex;justify-content:space-between;font-size:12px;color:#7b8496;margin-bottom:14px}
.dict-prog b{font-family:Georgia,serif;font-size:16px;color:#12284b}
.dict-zh{font-size:20px;font-weight:700;color:#12284b;line-height:1.5;margin-bottom:14px;min-height:30px}
.dict-play{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 22px;border-radius:999px;background:#f6e3c2;border:1px solid #e8cfa0;color:#12284b;font-size:14px;font-weight:600;cursor:pointer}
.dict-play:active{transform:scale(.98)}
.dict-input{width:100%;margin-top:16px;height:52px;font-size:20px;text-align:center;letter-spacing:.02em}
.dict-fb{min-height:22px;margin-top:12px;font-size:13.5px;line-height:1.6}
.dict-fb.ok{color:#1f5c44}
.dict-fb.bad{color:#b8382f}
.dict-fb.warn{color:#a8660f}
.dict-acts{display:flex;gap:10px;margin-top:14px}
.dict-acts .btn{flex:1;height:48px;border-radius:999px}
.dict-tip{margin-top:14px;font-size:11.5px;color:#7b8496;text-align:center;line-height:1.8}
.dict-done{text-align:center;padding:26px 0}
.dict-done .dd-t{font-size:18px;font-weight:700;color:#12284b}
.dict-done .dd-s{font-size:13px;color:#55617a;margin-top:8px}
[data-theme="dark"] .dict-box,[data-theme="dark"] .dict-entry{background:#16171c;border-color:rgba(255,255,255,.1)}
[data-theme="dark"] .dict-zh,[data-theme="dark"] .dict-done .dd-t{color:#fffdf8}
[data-theme="dark"] .dict-input{background:#22232a;color:#fffdf8;border-color:rgba(255,255,255,.14)}
