/* ============================================================
   马卡龙英语 · 低饱和蓝主调 + 多彩点缀设计系统
   ============================================================ */
:root{
  /* 基础（蓝雾底） */
  --bg: #f2f5f9;
  --surface: #fdfeff;
  --surface-2: #f4f7fb;
  --ink: #46536b;
  --ink-soft: #63708a;
  --ink-faint: #8b96ac;
  --line: #e2eaf3;
  --line-soft: #ecf1f8;

  /* 低饱和蓝系（主色） */
  --blue:      #d3e2f0;  --blue-d:    #6d95bd;  --blue-t:    #eef4fa;
  --indigo:    #d7dbf0;  --indigo-d:  #7b87c2;  --indigo-t:  #f0f2fa;
  --teal:      #d5e9e6;  --teal-d:    #6aa8a0;  --teal-t:    #eff8f7;

  /* 多彩点缀（低饱和马卡龙） */
  --pink:      #f6dfe4;  --pink-d:    #b96f7f;  --pink-t:    #fdf4f6;
  --matcha:    #ddebd4;  --matcha-d:  #6d9459;  --matcha-t:  #f5faf1;
  --butter:    #f8ecc9;  --butter-d:  #997c2c;  --butter-t:  #fdf9ec;
  --lilac:     #e9e0f5;  --lilac-d:   #8a72c0;  --lilac-t:   #f7f3fc;
  --mint:      #dceee9;  --mint-d:    #568f7f;  --mint-t:    #f1faf7;
  --peach:     #fbe5d6;  --peach-d:   #c07a45;  --peach-t:   #fdf5ee;
  --sky:       #dcebf5;  --sky-d:     #5c8cb4;  --sky-t:     #f1f8fc;

  --radius: 18px;
  --radius-s: 12px;
  --shadow: 0 4px 18px rgba(80, 100, 135, .09);
  --shadow-lift: 0 8px 28px rgba(80, 100, 135, .15);
  --ok: #6fae72; --warn: #d9a441; --bad: #d98a8a;
}
body.lv-cet6{
  /* 六级 = 靛蓝主题 */
  --theme: var(--indigo); --theme-d: var(--indigo-d); --theme-t: var(--indigo-t);
}
body.lv-cet4{
  /* 四级 = 雾蓝主题 */
  --theme: var(--blue); --theme-d: var(--blue-d); --theme-t: var(--blue-t);
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:
    radial-gradient(1200px 500px at 85% -100px, var(--pink-t), transparent 60%),
    radial-gradient(900px 420px at -10% 30%, var(--blue-t), transparent 55%),
    radial-gradient(700px 380px at 105% 65%, var(--mint-t), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family:"PingFang SC","HarmonyOS Sans SC","Source Han Sans SC","Noto Sans SC","Microsoft YaHei",-apple-system,"Segoe UI",sans-serif;
  font-size:15px; line-height:1.65;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; }
::selection{ background:var(--theme); }

/* ---------- 顶栏 ---------- */
#topbar{
  position:sticky; top:0; z-index:50;
  background:rgba(242,245,249,.86);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line-soft);
}
.topbar-inner{
  max-width:1180px; margin:0 auto; padding:0 20px;
  height:60px; display:flex; align-items:center; gap:22px;
}
.logo{ display:flex; align-items:center; gap:8px; font-weight:700; font-size:17px; letter-spacing:.5px; }
.logo-dot{
  width:22px; height:22px; border-radius:50%;
  background:
    radial-gradient(circle at 50% 42%, var(--butter) 0 30%, transparent 31%),
    radial-gradient(circle at 50% 50%, var(--matcha) 0 44%, transparent 45%),
    radial-gradient(circle at 50% 50%, var(--pink) 0 58%, transparent 59%),
    radial-gradient(circle at 50% 50%, var(--lilac) 0 72%, transparent 73%);
  box-shadow:0 1px 4px rgba(120,105,90,.25);
}
.logo-sub{ font-size:11px; color:var(--ink-faint); font-weight:500; margin-left:2px; }
#main-nav{ display:flex; gap:4px; flex:1; overflow-x:auto; scrollbar-width:none; }
#main-nav::-webkit-scrollbar{ display:none; }
#main-nav a{
  padding:7px 14px; border-radius:999px; font-size:14px; color:var(--ink-soft);
  white-space:nowrap; transition:all .18s;
}
#main-nav a:hover{ background:var(--surface-2); color:var(--ink); }
#main-nav a.active{ background:var(--theme); color:#fff; font-weight:600; box-shadow:0 2px 8px rgba(120,105,90,.15); }
.topbar-right{ display:flex; align-items:center; gap:10px; }
.today-pill{
  background:var(--butter); color:#8a6d1f; font-weight:600; font-size:13px;
  padding:5px 13px; border-radius:999px; white-space:nowrap; cursor:default;
}
.level-switch{ display:flex; background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:3px; }
.lv-btn{
  border:none; background:transparent; padding:8px 15px; border-radius:999px;
  font-size:13px; color:var(--ink-soft); cursor:pointer; transition:all .18s; font-weight:600;
}
.lv-btn.active[data-level="cet4"]{ background:var(--blue-d); color:#fff; }
.lv-btn.active[data-level="cet6"]{ background:var(--indigo-d); color:#fff; }

/* ---------- 主视图 ---------- */
#view{ max-width:1180px; margin:0 auto; padding:26px 20px 60px; min-height:calc(100vh - 160px); }
#footer{ text-align:center; color:var(--ink-faint); font-size:12px; padding:18px; border-top:1px solid var(--line-soft); }

.page-head{ margin:6px 0 20px; }
.page-head h1{ font-size:21px; margin:0 0 4px; letter-spacing:.2px; }
.page-head p{ margin:0; color:var(--ink-soft); font-size:13.5px; }

/* ---------- 通用卡片 ---------- */
.card{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:20px 22px; margin-bottom:16px;
  animation:rise .35s ease both;
}
@keyframes rise{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none;} }
.card h3{ margin:0 0 10px; font-size:16.5px; display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.card h3 .tag{ font-size:11px; }

.grid{ display:grid; gap:16px; }
.grid-2{ grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); }
.grid-3{ grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }

/* 标签 chip */
.tag{
  display:inline-flex; align-items:center; gap:4px;
  font-size:11.5px; padding:2px 10px; border-radius:999px; font-weight:600;
  background:var(--surface-2); color:var(--ink-soft); border:1px solid var(--line);
}
.tag.pink{ background:var(--pink-t); color:var(--pink-d); border-color:var(--pink); }
.tag.matcha{ background:var(--matcha-t); color:var(--matcha-d); border-color:var(--matcha); }
.tag.butter{ background:var(--butter-t); color:var(--butter-d); border-color:var(--butter); }
.tag.lilac{ background:var(--lilac-t); color:var(--lilac-d); border-color:var(--lilac); }
.tag.mint{ background:var(--mint-t); color:var(--mint-d); border-color:var(--mint); }
.tag.peach{ background:var(--peach-t); color:var(--peach-d); border-color:var(--peach); }
.tag.sky{ background:var(--sky-t); color:var(--sky-d); border-color:var(--sky); }

/* 按钮 */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  border:none; cursor:pointer; border-radius:999px;
  padding:9px 20px; font-size:14px; font-weight:600;
  background:var(--theme-d); color:#fff;
  box-shadow:0 3px 10px rgba(120,105,90,.16); transition:all .18s;
}
.btn:hover{ filter:brightness(.97); }
.btn:active{ transform:none; }
.btn.ghost{ background:var(--surface); color:var(--ink); border:1.5px solid var(--line); box-shadow:none; }
.btn.ghost:hover{ border-color:var(--theme-d); color:var(--theme-d); }
.btn.soft{ background:var(--theme); color:var(--ink); box-shadow:none; }
.btn.warn{ background:var(--peach-d); }
.btn.danger{ background:var(--bad); }
.btn.sm{ padding:5px 14px; font-size:12.5px; }
.btn.lg{ padding:12px 30px; font-size:15.5px; }
.btn:disabled{ opacity:.45; cursor:not-allowed; transform:none!important; }

/* ---------- 首页 ---------- */
.hero{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:44px 20px 30px;
}
.hero h1{ font-size:34px; margin:14px 0 8px; letter-spacing:1px; }
.hero p{ color:var(--ink-soft); margin:0 0 26px; font-size:15px; }
.macaron-row{ display:flex; gap:14px; }
.macaron{
  width:54px; height:54px; border-radius:50%;
  box-shadow:0 4px 12px rgba(80,100,135,.18), inset 0 -6px 0 rgba(255,255,255,.35);
  transition:transform .3s ease;
}
@keyframes bounce{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-7px);} }

.subject-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px; margin:10px auto 34px; max-width:820px; }
.subject-card{
  position:relative; border-radius:24px; padding:34px 28px 28px; cursor:pointer;
  border:2px solid transparent; transition:all .22s; overflow:hidden;
}
.subject-card:hover{ box-shadow:var(--shadow-lift); }
.subject-card.cet4{ background:linear-gradient(150deg,var(--blue-t),var(--blue)); border-color:var(--blue); }
.subject-card.cet4:hover{ border-color:var(--blue-d); }
.subject-card.cet6{ background:linear-gradient(150deg,var(--indigo-t),var(--indigo)); border-color:var(--indigo); }
.subject-card.cet6:hover{ border-color:var(--indigo-d); }
.subject-card h2{ margin:8px 0 6px; font-size:26px; }
.subject-card .en{ font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--ink-soft); }
.subject-card p{ font-size:13px; color:var(--ink-soft); margin:0 0 18px; }
.subject-card .btn{ pointer-events:none; }
.subject-card .stats{ font-size:12px; color:var(--ink-soft); margin-top:14px; }

.feature-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px; }
.feature-card{
  position:relative; overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; display:block; transition:all .2s; box-shadow:var(--shadow);
}
.feature-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
}
.feature-card:nth-child(5n+1)::before{ background:var(--blue-d); }
.feature-card:nth-child(5n+2)::before{ background:var(--pink-d); }
.feature-card:nth-child(5n+3)::before{ background:var(--matcha-d); }
.feature-card:nth-child(5n+4)::before{ background:var(--butter-d); }
.feature-card:nth-child(5n+5)::before{ background:var(--indigo-d); }
.feature-card:hover{ border-color:var(--blue-d); }
.feature-card .emoji{ font-size:26px; }
.feature-card h4{ margin:8px 0 4px; font-size:15px; }
.feature-card p{ margin:0; font-size:12.5px; color:var(--ink-soft); }

/* ---------- 真题库 ---------- */
.year-group{ margin-bottom:26px; }
.year-head{ display:flex; align-items:baseline; gap:10px; margin-bottom:12px; }
.year-head h2{ font-size:20px; margin:0; }
.year-head span{ font-size:12px; color:var(--ink-faint); }
.paper-row{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-s);
  padding:14px 18px; margin-bottom:10px; box-shadow:var(--shadow); transition:all .18s;
}
.paper-row:hover{ border-color:var(--theme-d); }
.paper-row .p-title{ font-weight:700; min-width:200px; }
.paper-row .p-meta{ display:flex; gap:6px; flex-wrap:wrap; flex:1; }
.paper-row .p-score{ font-size:12.5px; color:var(--ink-soft); }
.paper-empty{ text-align:center; color:var(--ink-soft); padding:40px 0; }

/* ---------- 试卷页 ---------- */
.paper-toolbar{
  position:sticky; top:60px; z-index:40;
  background:rgba(250,246,240,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft); border-radius:0 0 16px 16px;
  margin:-26px -20px 20px; padding:12px 24px;
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.paper-toolbar .title{ font-weight:700; font-size:16px; flex:1; min-width:180px; }
.section-card{ border-top:5px solid var(--theme); }
.section-card.sec-listening{ border-top-color:var(--sky-d); }
.section-card.sec-reading{ border-top-color:var(--matcha-d); }
.section-card.sec-writing{ border-top-color:var(--butter-d); }
.section-card.sec-translation{ border-top-color:var(--peach-d); }
.sec-label{ font-size:12px; font-weight:700; letter-spacing:1px; }

.passage{
  background:var(--surface-2); border:1px solid var(--line-soft);
  border-radius:var(--radius-s); padding:18px 20px; margin:12px 0;
  line-height:1.9; font-size:15px; text-align:justify;
}
.passage .blank{
  display:inline-block; min-width:64px; text-align:center;
  border-bottom:2px solid var(--ink-faint); color:var(--ink-faint);
  font-weight:600; margin:0 3px; letter-spacing:1px;
}
.passage .blank.filled{ color:var(--theme-d); border-color:var(--theme-d); }
.passage .blank.correct{ color:var(--ok); border-color:var(--ok); }
.passage .blank.wrong{ color:var(--bad); border-color:var(--bad); }

/* 可点击查词 */
.w{ cursor:pointer; border-radius:4px; padding:0 1px; transition:background .12s; }
.w:hover{ background:var(--butter); }
.w.hint{ background:var(--butter); box-shadow:inset 0 -2px 0 var(--butter-d); }

/* 题目 */
.q-item{ padding:14px 4px 10px; border-bottom:1px dashed var(--line-soft); }
.q-item:last-child{ border-bottom:none; }
.q-num{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:30px; height:26px; padding:0 8px; border-radius:8px;
  background:var(--theme-t); color:var(--theme-d); font-weight:700; font-size:13px;
  margin-right:10px;
}
.q-item.correct .q-num{ background:var(--matcha); color:var(--matcha-d); }
.q-item.wrong .q-num{ background:var(--pink); color:var(--pink-d); }
.q-stem{ display:inline; font-weight:500; }
.opts{ margin-top:10px; display:grid; gap:7px; }
.opt{
  display:flex; gap:10px; align-items:flex-start; padding:9px 14px;
  background:var(--surface); border:1.5px solid var(--line); border-radius:12px;
  cursor:pointer; transition:all .15s; font-size:14px;
}
.opt:hover{ border-color:var(--theme-d); background:var(--theme-t); }
.opt .letter{ font-weight:800; color:var(--ink-faint); }
.opt.selected{ border-color:var(--theme-d); background:var(--theme-t); }
.opt.selected .letter{ color:var(--theme-d); }
.opt.correct{ border-color:var(--ok); background:var(--matcha-t); }
.opt.correct .letter{ color:var(--ok); }
.opt.wrong{ border-color:var(--bad); background:var(--pink-t); }
.opt .dictable{ cursor:pointer; }

.word-bank{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.word-bank .wb{
  background:var(--lilac-t); border:1px solid var(--lilac); color:var(--lilac-d);
  border-radius:10px; padding:4px 12px; font-weight:700; font-size:13.5px; cursor:pointer;
}
.word-bank .wb.used{ opacity:.35; text-decoration:line-through; }
select.blank-select{
  border:1.5px solid var(--line); border-radius:8px; padding:3px 8px;
  font-family:inherit; color:var(--theme-d); font-weight:700; background:var(--surface);
}

textarea.answer-area{
  width:100%; min-height:170px; border:1.5px solid var(--line); border-radius:var(--radius-s);
  padding:14px 16px; font-family:inherit; font-size:14.5px; line-height:1.8;
  background:var(--surface); color:var(--ink); resize:vertical; transition:border .15s;
}
textarea.answer-area:focus{ outline:none; border-color:var(--theme-d); }
.answer-tools{ display:flex; gap:10px; align-items:center; margin-top:8px; font-size:12.5px; color:var(--ink-soft); }

/* 答题卡 */
.sheet{
  position:sticky; top:140px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-s);
  padding:16px; box-shadow:var(--shadow);
}
.sheet h4{ margin:0 0 10px; font-size:13.5px; color:var(--ink-soft); }
.sheet-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.sheet-cell{
  aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  border-radius:8px; font-size:12.5px; font-weight:600;
  background:var(--surface-2); border:1px solid var(--line); cursor:pointer; color:var(--ink-soft);
  transition:all .12s;
}
.sheet-cell:hover{ border-color:var(--theme-d); }
.sheet-cell.answered{ background:var(--theme); border-color:var(--theme-d); color:#fff; }
.sheet-cell.correct{ background:var(--matcha); border-color:var(--matcha-d); color:#fff; }
.sheet-cell.wrong{ background:var(--pink); border-color:var(--pink-d); color:#fff; }
.sheet-legend{ display:flex; gap:10px; margin-top:10px; font-size:11px; color:var(--ink-faint); flex-wrap:wrap; }

/* 分屏模式 */
.split-on .paper-layout{ grid-template-columns:1fr 1fr; }
.paper-layout{ display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:18px; align-items:start; }
.paper-layout.no-sheet{ grid-template-columns:minmax(0,1fr); }
.split-pane-right{
  position:sticky; top:140px; max-height:calc(100vh - 170px); overflow-y:auto;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:18px; box-shadow:var(--shadow);
}
.split-pane-right h4{ margin:0 0 8px; font-size:14px; }
.ans-row{
  display:flex; gap:10px; align-items:center; padding:7px 10px;
  border-radius:10px; font-size:13.5px; margin-bottom:4px; background:var(--surface-2);
}
.ans-row .mine{ font-weight:700; }
.ans-row.ok .mine{ color:var(--ok); } .ans-row.bad .mine{ color:var(--bad); }
.ans-row .truth{ color:var(--ink-soft); }
.ref-block{
  background:var(--peach-t); border:1px solid var(--peach); border-radius:var(--radius-s);
  padding:14px 16px; margin-top:10px; line-height:1.9; font-size:14px;
}
.ref-block b{ color:var(--peach-d); }

/* 听力播放器 */
.player-bar{
  background:linear-gradient(120deg,var(--sky-t),var(--mint-t));
  border:1px solid var(--sky); border-radius:var(--radius-s);
  padding:14px 18px; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  position:sticky; top:130px; z-index:30; box-shadow:var(--shadow);
}
.player-bar.playing{ border-color:var(--sky-d); }
.player-btn{
  width:44px; height:44px; border-radius:50%; border:none; cursor:pointer;
  background:var(--sky-d); color:#fff; font-size:17px; display:flex;
  align-items:center; justify-content:center; box-shadow:0 3px 10px rgba(122,168,204,.4);
  transition:transform .15s;
}
.player-btn:hover{ transform:scale(1.07); }
.player-info{ flex:1; min-width:160px; }
.player-info .pi-title{ font-weight:700; font-size:14px; }
.player-info .pi-sub{ font-size:12px; color:var(--ink-soft); }
.player-progress{ height:6px; background:var(--surface); border-radius:99px; overflow:hidden; margin-top:6px; }
.player-progress i{ display:block; height:100%; background:var(--sky-d); border-radius:99px; transition:width .3s; }
.player-controls{ display:flex; gap:8px; align-items:center; }
.player-controls select{ border:1.5px solid var(--line); border-radius:8px; padding:4px 8px; font-size:12.5px; }
.play-seg-btn{
  border:1.5px solid var(--sky); background:var(--surface); color:var(--sky-d);
  border-radius:999px; padding:5px 14px; font-size:12.5px; font-weight:700; cursor:pointer; transition:all .15s;
}
.play-seg-btn:hover{ background:var(--sky-t); border-color:var(--sky-d); }
.script-toggle{ font-size:12.5px; color:var(--ink-soft); }

/* ---------- 查词弹窗 ---------- */
#dict-pop{
  position:fixed; z-index:200; max-width:320px;
  background:var(--surface); border:1px solid var(--line); border-radius:16px;
  box-shadow:var(--shadow-lift); padding:16px 18px; display:none;
  animation:rise .18s ease both;
}
#dict-pop.show{ display:block; }
#dict-pop .dp-head{ display:flex; align-items:center; gap:8px; }
#dict-pop .dp-word{ font-size:19px; font-weight:800; letter-spacing:.5px; }
#dict-pop .dp-ph{ color:var(--ink-faint); font-size:12.5px; font-family:"SF Mono",Consolas,monospace; }
#dict-pop .dp-cn{ margin:8px 0 4px; font-size:14px; line-height:1.7; }
#dict-pop .dp-src{ font-size:11px; color:var(--ink-faint); }
#dict-pop .dp-actions{ display:flex; gap:6px; margin-top:10px; flex-wrap:wrap; }
#dict-pop .dp-actions button{
  border:1.5px solid var(--line); background:var(--surface); color:var(--ink-soft);
  border-radius:999px; padding:4px 12px; font-size:12px; cursor:pointer; transition:all .15s;
}
#dict-pop .dp-actions button:hover{ border-color:var(--theme-d); color:var(--theme-d); }
#dict-pop .dp-sent{ margin-top:8px; font-size:12.5px; color:var(--ink-soft); background:var(--butter-t); border-radius:10px; padding:8px 12px; line-height:1.7; }
#dict-pop .dp-sent b{ color:var(--butter-d); }
#dict-pop .dp-close{ position:absolute; top:8px; right:12px; cursor:pointer; color:var(--ink-faint); border:none; background:none; font-size:15px; }
#dict-pop .dp-rate{ display:flex; gap:6px; margin-top:10px; }
#dict-pop .dp-rate button{ flex:1; border:none; border-radius:10px; padding:6px 0; font-size:12.5px; font-weight:700; cursor:pointer; }
#dict-pop .dp-rate .r-know{ background:var(--matcha); color:var(--matcha-d); }
#dict-pop .dp-rate .r-fuzzy{ background:var(--butter); color:var(--butter-d); }
#dict-pop .dp-rate .r-forget{ background:var(--pink); color:var(--pink-d); }

/* ---------- 专题练习 ---------- */
.topic-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.topic-card{
  border-radius:var(--radius); padding:22px; display:block;
  border:1.5px solid var(--line); background:var(--surface); box-shadow:var(--shadow);
  transition:all .2s; position:relative; overflow:hidden;
}
.topic-card:hover{ box-shadow:var(--shadow-lift); }
.topic-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
}
.topic-card.t-sky::before{ background:var(--sky-d);} .topic-card.t-sky:hover{ border-color:var(--sky-d);}
.topic-card.t-matcha::before{ background:var(--matcha-d);} .topic-card.t-matcha:hover{ border-color:var(--matcha-d);}
.topic-card.t-butter::before{ background:var(--butter-d);} .topic-card.t-butter:hover{ border-color:var(--butter-d);}
.topic-card.t-peach::before{ background:var(--peach-d);} .topic-card.t-peach:hover{ border-color:var(--peach-d);}
.topic-card.t-lilac::before{ background:var(--lilac-d);} .topic-card.t-lilac:hover{ border-color:var(--lilac-d);}
.topic-card .t-emoji{ font-size:30px; }
.topic-card h4{ margin:10px 0 6px; font-size:17px; }
.topic-card p{ margin:0 0 10px; font-size:12.5px; color:var(--ink-soft); }
.topic-card .t-count{ font-size:12px; color:var(--ink-faint); }

.practice-head{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px;
}
.progress-line{ height:8px; background:var(--surface-2); border-radius:99px; overflow:hidden; flex:1; min-width:140px; }
.progress-line i{ display:block; height:100%; background:linear-gradient(90deg,var(--theme),var(--theme-d)); border-radius:99px; transition:width .25s; }

/* ---------- 背单词 ---------- */
.book-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; }
.book-card{ border-radius:var(--radius); padding:20px; border:1.5px solid var(--line); background:var(--surface); box-shadow:var(--shadow); transition:all .2s; }
.book-card:hover{ border-color:var(--blue-d); }
.book-card h4{ margin:0 0 4px; font-size:16px; }
.book-card .b-meta{ font-size:12px; color:var(--ink-soft); margin-bottom:12px; }
.book-card .b-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.study-top{ display:flex; gap:14px; align-items:center; margin-bottom:18px; flex-wrap:wrap; }
.study-card-wrap{ max-width:560px; margin:0 auto; }
.study-card{
  background:var(--surface); border:1.5px solid var(--line); border-radius:24px;
  box-shadow:var(--shadow); padding:40px 30px; text-align:center; min-height:300px;
  display:flex; flex-direction:column; justify-content:center; align-items:center; position:relative;
}
.study-card .sc-stage{ font-size:11.5px; color:var(--ink-faint); letter-spacing:2px; text-transform:uppercase; margin-bottom:14px; }
.study-card .sc-word{ font-size:40px; font-weight:800; letter-spacing:1px; line-height:1.2; }
.study-card .sc-ph{ color:var(--ink-faint); font-size:14px; margin:6px 0; font-family:"SF Mono",Consolas,monospace; }
.study-card .sc-cn{ font-size:16px; margin-top:10px; line-height:1.8; }
.study-card .sc-sent{
  margin-top:16px; background:var(--butter-t); border-radius:14px; padding:12px 16px;
  font-size:13.5px; color:var(--ink-soft); line-height:1.8; text-align:left;
}
.study-card .sc-sent b{ color:var(--butter-d); }
.study-card .sc-req{ position:absolute; top:14px; right:16px; }

.mc-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; width:100%; margin-top:20px; }
.mc-opt{
  padding:14px; border:1.5px solid var(--line); border-radius:14px; cursor:pointer;
  background:var(--surface); transition:all .15s; font-size:14px; text-align:left;
}
.mc-opt:hover{ border-color:var(--theme-d); background:var(--theme-t); }
.mc-opt.right{ border-color:var(--ok); background:var(--matcha-t); }
.mc-opt.bad{ border-color:var(--bad); background:var(--pink-t); }

.rate-row{ display:flex; gap:10px; margin-top:26px; width:100%; }
.rate-row button{
  flex:1; border:none; border-radius:14px; padding:13px 0; font-size:14.5px; font-weight:700; cursor:pointer; transition:all .15s;
}
.rate-row .r-know{ background:var(--matcha); color:var(--matcha-d); }
.rate-row .r-know:hover{ background:var(--matcha-d); color:#fff; }
.rate-row .r-fuzzy{ background:var(--butter); color:var(--butter-d); }
.rate-row .r-fuzzy:hover{ background:var(--butter-d); color:#fff; }
.rate-row .r-forget{ background:var(--pink); color:var(--pink-d); }
.rate-row .r-forget:hover{ background:var(--pink-d); color:#fff; }
.rate-row .interval-hint{ font-size:11px; display:block; opacity:.75; font-weight:500; }

.sentence-blank{
  font-size:16px; line-height:2.1; text-align:left; background:var(--surface-2);
  border-radius:14px; padding:18px 20px; width:100%;
}
.sentence-blank .hole{
  display:inline-block; min-width:90px; border-bottom:2px solid var(--lilac-d);
  text-align:center; color:var(--lilac-d); font-weight:700;
}

/* 词书详情词表 */
.word-table{ max-height:420px; overflow-y:auto; border:1px solid var(--line-soft); border-radius:var(--radius-s); }
.word-row{ display:flex; align-items:center; gap:12px; padding:9px 16px; border-bottom:1px solid var(--line-soft); font-size:13.5px; }
.word-row:last-child{ border-bottom:none; }
.word-row .wr-w{ font-weight:700; min-width:110px; }
.word-row .wr-cn{ flex:1; color:var(--ink-soft); }
.word-row .wr-st{ min-width:52px; text-align:right; }
.status-chip{ font-size:11px; padding:1px 9px; border-radius:99px; font-weight:700; }
.status-chip.new{ background:var(--surface-2); color:var(--ink-faint); }
.status-chip.learning{ background:var(--butter); color:var(--butter-d); }
.status-chip.review{ background:var(--sky); color:var(--sky-d); }
.status-chip.mastered{ background:var(--matcha); color:var(--matcha-d); }

/* ---------- 阅读识词 ---------- */
.upload-zone{
  border:2px dashed var(--lilac-d); background:var(--lilac-t); border-radius:var(--radius);
  padding:38px 20px; text-align:center; cursor:pointer; transition:all .2s;
}
.upload-zone:hover{ background:var(--lilac); }
.upload-zone .uz-emoji{ font-size:38px; }
.ocr-word-group{ margin-bottom:16px; }
.ocr-word-group h4{ display:flex; align-items:center; gap:8px; font-size:14.5px; margin:0 0 8px; }
.ocr-list{ display:flex; flex-wrap:wrap; gap:8px; }
.ocr-chip{
  border:1.5px solid var(--line); background:var(--surface); border-radius:12px;
  padding:7px 12px; font-size:13px; cursor:pointer; transition:all .15s;
  display:flex; align-items:center; gap:8px;
}
.ocr-chip:hover{ border-color:var(--lilac-d); }
.ocr-chip .o-w{ font-weight:700; }
.ocr-chip .o-cn{ color:var(--ink-soft); font-size:11.5px; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ocr-chip.selected{ border-color:var(--lilac-d); background:var(--lilac-t); }
.ocr-chip .o-st{ font-size:10.5px; padding:1px 7px; border-radius:99px; }

/* ---------- 拼写训练 ---------- */
.spell-slots{ display:flex; gap:7px; justify-content:center; flex-wrap:wrap; margin:22px 0; }
.slot{
  width:42px; height:52px; border-radius:12px; border:2px solid var(--line);
  background:var(--surface); display:flex; align-items:center; justify-content:center;
  font-size:23px; font-weight:800; text-transform:lowercase; color:var(--ink);
}
.slot.filled{ border-color:var(--lilac-d); background:var(--lilac-t); }
.slot.ok{ border-color:var(--ok); background:var(--matcha-t); color:var(--ok); }
.slot.bad{ border-color:var(--bad); background:var(--pink-t); color:var(--bad); animation:shake .3s; }
@keyframes shake{ 0%,100%{ transform:translateX(0);} 25%{ transform:translateX(-4px);} 75%{ transform:translateX(4px);} }
.spell-hint{ font-size:14px; color:var(--ink-soft); min-height:44px; display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
.spell-input{
  width:100%; border:none; border-bottom:2.5px solid var(--line); background:transparent;
  font-size:22px; text-align:center; letter-spacing:8px; padding:8px; color:var(--ink); font-family:inherit;
}
.spell-input:focus{ outline:none; border-color:var(--theme-d); }
.mode-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin:14px 0 22px; }
.mode-card{
  border:2px solid var(--line); border-radius:var(--radius); padding:20px; cursor:pointer;
  background:var(--surface); text-align:center; transition:all .18s;
}
.mode-card:hover{ border-color:var(--blue-d); }
.mode-card.selected{ border-color:var(--theme-d); background:var(--theme-t); }
.mode-card .m-emoji{ font-size:28px; }
.mode-card h5{ margin:8px 0 4px; font-size:15px; }
.mode-card p{ margin:0; font-size:12px; color:var(--ink-soft); }

/* ---------- 统计环 ---------- */
.ring{ position:relative; width:86px; height:86px; }
.ring svg{ transform:rotate(-90deg); }
.ring .ring-num{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; font-size:17px; font-weight:800;
  font-variant-numeric:tabular-nums;
}
.ring .ring-num small{ font-size:10px; color:var(--ink-faint); font-weight:500; }
.stat-row{ display:flex; gap:20px; flex-wrap:wrap; margin:14px 0; }

/* ---------- 弹层 ---------- */
.modal-mask{
  position:fixed; inset:0; background:rgba(87,80,106,.32); z-index:100;
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:fade .2s ease both;
}
@keyframes fade{ from{opacity:0;} to{opacity:1;} }
.modal{
  background:var(--surface); border-radius:22px; padding:26px; width:100%; max-width:520px;
  box-shadow:var(--shadow-lift); max-height:86vh; overflow-y:auto;
}
.modal h3{ margin:0 0 14px; }
.modal .m-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:18px; }
.input, .modal input[type=text], .modal select, .modal textarea{
  width:100%; border:1.5px solid var(--line); border-radius:12px; padding:10px 14px;
  font-family:inherit; font-size:14px; color:var(--ink); background:var(--surface);
}
.input:focus{ outline:none; border-color:var(--theme-d); }
.field{ margin-bottom:14px; }
.field label{ display:block; font-size:12.5px; color:var(--ink-soft); margin-bottom:5px; font-weight:600; }

/* toast */
#toast-box{ position:fixed; bottom:26px; left:50%; transform:translateX(-50%); z-index:300; display:flex; flex-direction:column; gap:8px; align-items:center; }
.toast{
  background:var(--ink); color:#fff; padding:10px 22px; border-radius:999px;
  font-size:13.5px; box-shadow:var(--shadow-lift); animation:rise .25s ease both;
}

/* ============================================================
   SVG 图标 / 账号 / 我的页面
   ============================================================ */
.ic{ width:1.15em; height:1.15em; vertical-align:-0.18em; fill:none;
     stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ic-lg{ width:30px; height:30px; }
.ic-nav{ width:22px; height:22px; }
.feature-card .emoji .ic{ width:26px; height:26px; color:var(--theme-d); }

.speak-mini{
  border:none; background:var(--surface-2); border-radius:8px; cursor:pointer;
  padding:3px 6px; color:var(--blue-d); vertical-align:middle; transition:all .15s;
}
.speak-mini:hover{ background:var(--blue-t); }
.sc-word.sc-speak{ cursor:pointer; border-radius:10px; }
.sc-word.sc-speak:hover{ color:var(--blue-d); text-shadow:0 0 1px var(--blue); }
.sc-word.sc-speak:active{ transform:scale(.97); }

/* 顶栏头像 */
.avatar-slot{
  width:34px; height:34px; border-radius:50%; border:none; cursor:pointer;
  background:var(--surface-2); border:1.5px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--ink-soft);
  padding:0; transition:all .15s;
}
.avatar-slot:hover{ border-color:var(--blue-d); color:var(--blue-d); }
.avatar-slot .ic{ width:18px; height:18px; }
.topbar-avatar{ width:100%; height:100%; border-radius:50%; object-fit:cover; }

/* 登录/注册 */
.auth-wrap{ max-width:460px; margin:24px auto; }
.auth-card{
  background:var(--surface); border:1px solid var(--line); border-radius:24px;
  box-shadow:var(--shadow); padding:30px 28px;
}
.auth-logo{ display:flex; align-items:center; gap:8px; font-weight:800; color:var(--ink); font-size:15px; }
.auth-card h2{ margin:12px 0 4px; font-size:22px; }
.auth-sub{ margin:0 0 20px; font-size:12.5px; color:var(--ink-soft); }
.field-label{ display:block; font-size:12.5px; color:var(--ink-soft); font-weight:700; margin-bottom:10px; }
.auth-methods{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.auth-method{
  border:2px solid var(--line); border-radius:16px; background:var(--surface-2);
  padding:18px 12px; text-align:center; cursor:pointer; transition:all .18s;
  display:flex; flex-direction:column; align-items:center; gap:6px;
}
.auth-method small{ font-size:10.5px; color:var(--ink-faint); font-weight:400; }
.auth-method.wx{ color:#3aa155; } .auth-method.wx:hover{ border-color:#3aa155; background:#eef8f0; }
.auth-method.qq{ color:#2c8ad6; } .auth-method.qq:hover{ border-color:#2c8ad6; background:#ecf5fc; }
.auth-note{ font-size:11.5px; color:var(--ink-faint); line-height:1.7; margin-top:14px; }
.auth-row{ display:flex; gap:10px; margin-bottom:12px; align-items:center; }
.auth-code-hint{ font-size:12px; color:var(--butter-d); font-weight:700; white-space:nowrap; }
.auth-btns{ display:flex; gap:10px; justify-content:flex-end; margin-top:6px; }
.auth-profile{ display:flex; gap:14px; align-items:flex-start; }
.avatar-edit{
  width:74px; height:74px; border-radius:50%; border:2px dashed var(--blue-d);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; cursor:pointer; color:var(--blue-d); font-size:10.5px; background:var(--blue-t);
  overflow:hidden; flex:none;
}
.avatar-edit img{ width:100%; height:100%; object-fit:cover; border-radius:50%; }
.avatar-edit span{ display:flex; align-items:center; gap:2px; }
.auth-tip{ font-size:11px; color:var(--ink-faint); margin:6px 0 0; }

/* 我的页面 */
.me-head{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:16px; }
.me-avatar{ width:58px; height:58px; border-radius:50%; object-fit:cover; border:2px solid var(--surface); box-shadow:var(--shadow); }
.me-info b{ font-size:18px; display:block; }
.me-info span{ font-size:12px; color:var(--ink-soft); }
.chart-svg{ width:100%; height:auto; display:block; }
.chart-legend{ display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--ink-soft); }
.chart-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:5px; vertical-align:-1px; }
@media (max-width: 768px){
  .auth-methods{ grid-template-columns:1fr; }
  .auth-card{ padding:22px 18px; }
}
.cover-grid{ display:none; }
.cover-card{
  border-radius:16px; padding:16px 14px; position:relative; overflow:hidden;
  border:1.5px solid var(--line); box-shadow:var(--shadow);
  min-height:118px; display:flex; flex-direction:column; justify-content:flex-end;
}
.cover-card::after{
  content:""; position:absolute; left:10px; right:10px; top:9px; height:5px;
  border-radius:99px; background:rgba(255,255,255,.55);
}
.cover-card.c-pink{ background:linear-gradient(160deg,var(--pink-t),var(--pink)); border-color:var(--pink); }
.cover-card.c-sky{ background:linear-gradient(160deg,var(--sky-t),var(--sky)); border-color:var(--sky); }
.cover-card.c-blue{ background:linear-gradient(160deg,var(--blue-t),var(--blue)); border-color:var(--blue); }
.cover-card.c-indigo{ background:linear-gradient(160deg,var(--indigo-t),var(--indigo)); border-color:var(--indigo); }
.cover-card.c-teal{ background:linear-gradient(160deg,var(--teal-t),var(--teal)); border-color:var(--teal); }
.cover-card.c-butter{ background:linear-gradient(160deg,var(--butter-t),var(--butter)); border-color:var(--butter); }
.cover-card.c-matcha{ background:linear-gradient(160deg,var(--matcha-t),var(--matcha)); border-color:var(--matcha); }
.cover-card.c-lilac{ background:linear-gradient(160deg,var(--lilac-t),var(--lilac)); border-color:var(--lilac); }
.cover-card.c-mint{ background:linear-gradient(160deg,var(--mint-t),var(--mint)); border-color:var(--mint); }
.cover-card.c-peach{ background:linear-gradient(160deg,var(--peach-t),var(--peach)); border-color:var(--peach); }
.cover-card .cc-year{ font-size:23px; font-weight:800; line-height:1.1; }
.cover-card .cc-year span{ font-size:12px; font-weight:600; color:var(--ink-soft); margin-left:2px; }
.cover-card .cc-title{ font-size:13px; font-weight:700; color:var(--ink-soft); margin:2px 0 6px; }
.cover-card .cc-badges{ font-size:11px; color:var(--ink-soft); }
.cover-card .cc-status{ font-size:12.5px; font-weight:800; margin-top:8px; color:var(--theme-d); }
.cover-card.missing{ border-style:dashed; background:transparent; box-shadow:none; align-items:center; justify-content:center; text-align:center; color:var(--ink-faint); }
.cover-card.missing .cc-year{ font-size:19px; }

/* 做题页底部操作坞（移动端） */
.paper-dock{
  display:none; position:fixed; left:10px; right:10px;
  bottom:calc(62px + env(safe-area-inset-bottom, 0px)); z-index:58;
  background:rgba(255,253,251,.96); backdrop-filter:blur(14px);
  border:1px solid var(--line); border-radius:16px;
  padding:8px; gap:8px; box-shadow:0 8px 24px rgba(120,105,90,.18);
}
.paper-dock button{
  flex:1; border:none; background:transparent; border-radius:12px;
  padding:9px 4px; font-size:12.5px; font-weight:700; color:var(--ink);
  display:flex; flex-direction:column; gap:2px; align-items:center; cursor:pointer;
}
.paper-dock button i{ font-style:normal; font-size:19px; }
.paper-dock button:active{ background:var(--theme-t); }

/* 答题卡抽屉（bottom sheet） */
.sheet-mask{ position:fixed; inset:0; background:rgba(87,80,106,.35); z-index:70; animation:fade .18s ease both; }
.sheet-drawer{
  position:fixed; left:0; right:0; bottom:0; z-index:71;
  background:var(--surface); border-radius:22px 22px 0 0;
  padding:16px 18px calc(18px + env(safe-area-inset-bottom, 0px));
  max-height:66vh; overflow-y:auto; box-shadow:0 -8px 30px rgba(120,105,90,.25);
  animation:up .22s ease both;
}
@keyframes up{ from{ transform:translateY(40px); opacity:.4;} to{ transform:none; opacity:1;} }
.sheet-drawer .sd-grip{ width:40px; height:4px; border-radius:99px; background:var(--line); margin:0 auto 12px; }

@media (max-width: 768px){
  .cover-grid{
    display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px;
    margin-bottom:20px;
  }
  .year-group{ display:none; }   /* 移动端用封面书架，桌面用年份行式 */
  .paper-dock{ display:flex; }
  body{ --dock-h:104px; }
  #view{ padding-bottom:calc(118px + env(safe-area-inset-bottom, 0px)); }
  .paper-main-pad{ padding-bottom:calc(120px + env(safe-area-inset-bottom, 0px)); }
  .player-bar{ bottom:calc(116px + env(safe-area-inset-bottom, 0px)); }
  .split-jump{ display:none; }   /* 有操作坞，不再需要悬浮跳转 */
}
@media (min-width: 769px){
  .sheet-mask,.sheet-drawer{ display:none; }
}
@media (max-width: 900px){
  .paper-layout{ grid-template-columns:1fr; }
  .split-on .paper-layout{ grid-template-columns:1fr; }
  .sheet{ position:static; }
  .split-pane-right{ position:static; max-height:none; }
  .hero h1{ font-size:26px; }
}
@media (max-width: 640px){
  .topbar-inner{ padding:0 12px; gap:10px; }
  .logo-sub{ display:none; }
  #view{ padding:18px 12px 50px; }
  .paper-toolbar{ margin:-18px -12px 16px; padding:10px 14px; }
  .q-num{ min-width:24px; }
}

/* ============================================================
   移动端 / 平板适配（手机优先核心体验）
   ============================================================ */
#bottom-nav{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:rgba(255,253,251,.94);
  backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
}
#bottom-nav a{
  flex:1; display:flex; flex-direction:column; align-items:center; gap:1px;
  font-size:10.5px; color:var(--ink-soft); text-decoration:none; padding:3px 0;
  border-radius:10px;
}
#bottom-nav a i{ font-style:normal; font-size:20px; line-height:1.25; }
#bottom-nav a.active{ color:var(--theme-d); font-weight:700; }

@media (max-width: 768px){
  #bottom-nav{ display:flex; }
  #main-nav{ display:none; }
  #footer{ padding-bottom:84px; }
  body{ font-size:14.5px; }
  #view{ padding-bottom:calc(84px + env(safe-area-inset-bottom, 0px)); }

  .topbar-inner{ height:54px; }
  .logo{ font-size:15.5px; }
  .today-pill{ display:none; }
  .lv-btn{ padding:5px 11px; }

  .hero{ padding:26px 8px 20px; }
  .hero h1{ font-size:23px; }
  .hero p{ font-size:13.5px; }
  .macaron{ width:40px; height:40px; }
  .subject-cards{ gap:14px; }
  .subject-card{ padding:24px 20px 20px; }
  .subject-card h2{ font-size:21px; }
  .stat-row{ gap:12px; }

  .page-head h1{ font-size:20px; }

  /* 触控目标放大 */
  .btn{ padding:11px 18px; }
  .opt{ padding:12px 14px; font-size:14.5px; }
  .mc-opt{ padding:14px; }
  .sheet-cell{ border-radius:10px; }
  .wb{ padding:7px 13px; font-size:14px; }
  select.blank-select{ padding:6px 10px; font-size:14px; }

  /* 试卷工具栏 & 播放器 */
  .paper-toolbar{ position:static; margin:0 0 12px; border-radius:14px; border:1px solid var(--line-soft); }
  .paper-toolbar .title{ font-size:14.5px; width:100%; order:-1; }
  .player-bar{
    position:fixed; left:10px; right:10px;
    bottom:calc(64px + env(safe-area-inset-bottom, 0px)); z-index:55;
    box-shadow:0 8px 24px rgba(120,105,90,.25);
  }
  .paper-main-pad{ padding-bottom:110px; }
  .player-btn{ width:40px; height:40px; }
  .player-controls select{ font-size:12px; }

  /* 学习卡 & 拼写 */
  .study-card{ padding:26px 16px; min-height:260px; }
  .study-card .sc-word{ font-size:30px; }
  .spell-slots{ gap:5px; }
  .slot{ width:32px; height:42px; font-size:18px; }
  .spell-input{ font-size:18px; letter-spacing:5px; }
  .rate-row button{ padding:12px 0; }

  .sheet{ padding:14px; }
  .sheet-grid{ grid-template-columns:repeat(5,1fr); gap:5px; }
  .modal{ padding:20px 16px; border-radius:18px; }
  #dict-pop{ max-width:calc(100vw - 24px); }

  .grid-2, .grid-3, .topic-grid, .feature-grid, .mode-cards{ grid-template-columns:1fr; }
  .word-row{ flex-wrap:wrap; gap:6px; }
  .ans-row{ font-size:12.5px; }

  /* 分屏对答案：竖排 + 悬浮跳转按钮 */
  .split-jump{
    position:fixed; right:14px;
    bottom:calc(74px + env(safe-area-inset-bottom, 0px)); z-index:56;
    width:52px; height:52px; border-radius:50%;
    background:var(--matcha-d); color:#fff; border:none; font-size:22px;
    box-shadow:0 6px 18px rgba(133,173,118,.5); cursor:pointer;
  }
}
@media (min-width: 769px){
  .split-jump{ display:none; }
}
@media (max-width: 1024px) and (min-width: 769px){
  /* 平板：双栏收窄，触控目标中等 */
  .grid-2{ grid-template-columns:1fr; }
  .subject-cards{ max-width:640px; }
  .study-card .sc-word{ font-size:34px; }
  .paper-layout{ grid-template-columns:minmax(0,1fr) 200px; }
  .opt{ padding:11px 14px; }
}


.ans-row,.p-score,.cc-status,.stat-row,.sheet-legend{ font-variant-numeric:tabular-nums; }

/* 科目卡色点 & 细节收尾 */
.lv-dot{ display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:9px; vertical-align:-1px; }
.lv-dot.d4{ background:var(--blue-d); box-shadow:0 0 0 3px var(--blue); }
.lv-dot.d6{ background:var(--indigo-d); box-shadow:0 0 0 3px var(--indigo); }
.split-jump .ic{ width:22px; height:22px; }
.today-pill{ display:inline-flex; align-items:center; gap:5px; }
.today-pill .ic{ width:14px; height:14px; }
.paper-dock button .ic{ width:20px; height:20px; }
.player-btn .ic{ width:18px; height:18px; }
.play-seg-btn .ic{ width:13px; height:13px; vertical-align:-2px; }
#pt-play .ic,#pt-split .ic,#pt-submit .ic{ width:14px; height:14px; vertical-align:-2px; }
h3 .ic{ width:16px; height:16px; vertical-align:-2px; color:var(--blue-d); }

/* ============================================================
   首页重设计：呼吸感主视觉 + 今日学习磁贴
   ============================================================ */
.hero-new{
  display:flex; align-items:center; gap:40px;
  padding:56px 8px 44px; flex-wrap:wrap;
}
.hero-copy{ flex:1 1 320px; min-width:280px; }
.hero-kicker{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; letter-spacing:1.5px;
  color:var(--blue-d); background:var(--blue-t);
  border:1px solid var(--blue); border-radius:999px; padding:5px 14px;
}
.hero-copy h1{
  font-size:44px; margin:18px 0 12px; letter-spacing:1px; line-height:1.25;
}
.hero-copy p{ color:var(--ink-soft); font-size:14.5px; margin:0 0 24px; }
.hero-art{ flex:1 1 340px; min-width:300px; max-width:480px; width:100%; height:auto; }

.today-grid{
  display:grid; grid-template-columns:repeat(5, 1fr); gap:14px; margin-top:6px;
}
.today-tile{
  border-radius:14px; padding:16px 10px 14px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:4px;
}
.today-tile .tt-icon .ic{ width:20px; height:20px; }
.today-tile b{ font-size:22px; font-weight:800; font-variant-numeric:tabular-nums; }
.today-tile span:last-child{ font-size:11.5px; color:var(--ink-soft); }
.today-card{ padding:22px 26px; }

@media (max-width: 900px){
  .today-grid{ grid-template-columns:repeat(3, 1fr); }
}
@media (max-width: 640px){
  .hero-new{ padding:34px 4px 28px; gap:18px; }
  .hero-copy h1{ font-size:32px; }
  .hero-copy p{ font-size:13px; }
  .hero-art{ max-width:320px; margin:0 auto; }
  .today-grid{ grid-template-columns:repeat(2, 1fr); gap:10px; }
}

/* 专题练习：阅读类分屏（左文章右题目） */
.tp-split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; margin-top:10px; }
.tp-split-l{ position:sticky; top:76px; align-self:start; max-height:calc(100vh - 100px); overflow-y:auto; padding-right:4px; }
.tp-split-r{ min-width:0; }
@media (max-width: 900px){
  .tp-split{ grid-template-columns:1fr; }
  .tp-split-l{ position:static; max-height:none; }
}
.me-card h3 .ic{ margin-right:2px; }

/* 马卡龙色块统计（今日学习，无图标版） */
.today-block{
  border-radius:16px; padding:20px 10px 16px; text-align:center;
  display:flex; flex-direction:column; gap:4px; min-height:96px; justify-content:center;
}
.today-block b{ font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; }
.today-block span{ font-size:11.5px; color:var(--ink-soft); font-weight:600; }
.macaron-row{ display:flex; gap:14px; margin:4px 0 22px; }
.macaron{
  width:46px; height:46px; border-radius:50%;
  box-shadow:0 4px 12px rgba(80,100,135,.16), inset 0 -6px 0 rgba(255,255,255,.4);
  animation:bounce 2.6s ease-in-out infinite;
}
.macaron:nth-child(2){ animation-delay:.2s;} .macaron:nth-child(3){ animation-delay:.4s;}
.macaron:nth-child(4){ animation-delay:.6s;} .macaron:nth-child(5){ animation-delay:.8s;}
@keyframes bounce{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-6px);} }
.hero-copy .macaron-row{ justify-content:flex-start; }