/* ============================================================
   SAT for you —— 学生端
   亮色友好：白底 + 蓝绿点缀，字大、对比清楚，长时间做题不累眼
   ============================================================ */
:root{
  --bg:#f5f7fb; --card:#ffffff; --ink:#1f2937; --ink-2:#374151;
  --muted:#6b7280; --muted-2:#9ca3af; --line:#e5e7eb; --line-2:#d1d5db;
  --blue:#2563eb; --blue-d:#1d4ed8; --blue-l:#eff6ff;
  --green:#16a34a; --green-l:#ecfdf5; --green-d:#15803d;
  --amber:#d97706; --amber-l:#fffbeb;
  --red:#dc2626; --red-l:#fef2f2;
  --purple:#7c3aed; --purple-l:#f5f3ff;
  --radius:12px;
  --shadow:0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.06);
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",
              "Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:16px; line-height:1.65;
}
a{color:var(--blue); text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}

/* ---------------------------------------------------- 顶栏 */
.topbar{
  background:var(--card); border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:50;
}
.topbar-in{
  max-width:960px; margin:0 auto; padding:12px clamp(14px,3vw,20px);
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.05rem}
.brand .logo{
  width:32px; height:32px; border-radius:9px; flex:none;
  background:linear-gradient(140deg,var(--blue),var(--purple));
  color:#fff; display:grid; place-items:center; font-size:13px; font-weight:800;
}
.brand small{display:block; font-size:10px; letter-spacing:1.6px;
             color:var(--muted-2); font-weight:600}
.navlinks{margin-left:auto; display:flex; gap:4px; flex-wrap:wrap}
.navlinks a{
  padding:6px 12px; border-radius:8px; color:var(--ink-2);
  font-size:.9rem; font-weight:500;
}
.navlinks a:hover{background:var(--blue-l); color:var(--blue); text-decoration:none}
.navlinks a.on{background:var(--blue); color:#fff}

/* ---------------------------------------------------- 布局 */
.wrap{max-width:960px; margin:0 auto; padding:24px clamp(14px,3vw,20px) 80px}
.wrap.wide{max-width:1120px}
.card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:20px; margin-bottom:18px;
}
.card-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-bottom:14px;
}
.card-head h2{margin:0; font-size:1.1rem; font-weight:700}
.card-head .sub{color:var(--muted); font-size:.85rem}
h1.page-title{margin:0 0 6px; font-size:1.5rem; font-weight:800; letter-spacing:-.2px}
p.page-sub{margin:0 0 22px; color:var(--muted); font-size:.95rem}
.lbl{font-size:11px; font-weight:700; letter-spacing:1.2px;
     text-transform:uppercase; color:var(--muted-2)}

/* ---------------------------------------------------- 按钮 */
.btn{
  font:inherit; font-size:.95rem; font-weight:600; cursor:pointer;
  padding:10px 18px; border-radius:10px; border:1px solid transparent;
  background:var(--blue); color:#fff; transition:.16s ease;
  display:inline-flex; align-items:center; gap:8px;
}
.btn:hover{background:var(--blue-d)}
.btn.ghost{background:var(--card); border-color:var(--line-2); color:var(--ink-2)}
.btn.ghost:hover{background:#f3f4f6}
.btn.green{background:var(--green)} .btn.green:hover{background:var(--green-d)}
.btn.purple{background:var(--purple)} .btn.purple:hover{background:#6d28d9}
.btn.amber{background:var(--amber)}
.btn.red{background:var(--red)}
.btn.sm{padding:6px 12px; font-size:.85rem; border-radius:8px}
.btn.lg{padding:14px 26px; font-size:1.05rem; border-radius:12px}
.btn:disabled{opacity:.45; cursor:not-allowed}
.btn-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center}

/* ---------------------------------------------------- 指标卡 */
.tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
       gap:12px; margin-bottom:18px}
.tile{background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
      padding:14px 16px; box-shadow:var(--shadow)}
.tile b{display:block; font-size:1.8rem; font-weight:800; line-height:1.2;
        font-family:var(--mono)}
.tile.blue b{color:var(--blue)} .tile.green b{color:var(--green)}
.tile.amber b{color:var(--amber)} .tile.red b{color:var(--red)}
.tile.purple b{color:var(--purple)}

/* ---------------------------------------------------- 数学排版 */
.frac{display:inline-flex; flex-direction:column; vertical-align:-0.55em;
      text-align:center; margin:0 .15em; line-height:1.15}
.frac .fn{border-bottom:1.4px solid currentColor; padding:0 .3em}
.frac .fd{padding:0 .3em}
.mixed{display:inline-flex; align-items:center; gap:.1em}
.rad{
  display:inline-block; position:relative; white-space:nowrap;
  border-top:1.3px solid currentColor; padding:0 .18em 0 0;
  margin-left:.72em;                 /* 给左边的 √ 让出位置，别压到前一个字符 */
}
.rad::before{content:"\221A"; position:absolute; left:-.62em; top:-.04em;
             border-top:none}
.seg{border-top:1.4px solid currentColor; padding-top:1px}
sup{font-size:.72em; vertical-align:.5em}
.stem-math{margin:12px 0; text-align:center; font-size:1.1rem}
.stem-block{margin:10px 0}
.fig{display:block; max-width:min(440px,100%); height:auto; margin:16px auto}
.fig-wrap{margin:14px 0; text-align:center}
.fig-wrap img{max-width:min(440px,100%); height:auto; border-radius:8px}

/* ---------------------------------------------------- 答题页 */
.exam-bar{
  position:sticky; top:57px; z-index:40; background:var(--card);
  border-bottom:1px solid var(--line); padding:10px clamp(14px,3vw,20px);
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
}
.exam-bar .clock{font-family:var(--mono); font-size:1.25rem; font-weight:700}
.exam-bar .clock.warn{color:var(--amber)}
.exam-bar .clock.over{color:var(--red)}
.exam-bar .qcount{color:var(--muted); font-size:.9rem}
.exam-bar .spacer{margin-left:auto}

.qnav{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px}
.qnav button{
  width:38px; height:38px; border-radius:9px; border:1.5px solid var(--line-2);
  background:var(--card); color:var(--ink-2); font:inherit; font-weight:700;
  font-size:.85rem; cursor:pointer; transition:.14s; position:relative;
}
.qnav button:hover{border-color:var(--blue)}
.qnav button.on{background:var(--blue); border-color:var(--blue); color:#fff}
.qnav button.answered{background:var(--blue-l); border-color:var(--blue)}
.qnav button.on.answered{background:var(--blue); color:#fff}
.qnav button.known::after{
  content:""; position:absolute; right:-2px; top:-2px; width:9px; height:9px;
  border-radius:50%; background:var(--green); border:1.5px solid var(--card);
}
.qnav button.flagged::before{
  content:""; position:absolute; left:-2px; top:-2px; width:9px; height:9px;
  border-radius:50%; background:var(--amber); border:1.5px solid var(--card);
}

.qnum{font-size:.85rem; font-weight:700; color:var(--blue); letter-spacing:.4px}
.stem{font-size:1.12rem; line-height:1.8; margin:8px 0 4px}
.w{cursor:pointer; border-radius:3px; padding:0 1px}
.w:hover{background:var(--amber-l); outline:1px solid #fcd34d}
.w.circled{
  background:var(--red-l); box-shadow:inset 0 0 0 2px var(--red);
  border-radius:6px; padding:0 3px;
}
.picker-hint{
  font-size:.85rem; color:var(--amber); background:var(--amber-l);
  border:1px solid #fde68a; border-radius:8px; padding:8px 12px; margin:10px 0;
}

.choices{display:grid; gap:10px; margin:18px 0 6px}
.choice{
  display:flex; align-items:center; gap:14px; padding:12px 16px;
  border:1.6px solid var(--line-2); border-radius:11px; cursor:pointer;
  background:var(--card); transition:.14s; font-size:1.05rem;
}
.choice:hover{border-color:var(--blue); background:var(--blue-l)}
.choice input{display:none}
.choice .key{
  width:30px; height:30px; flex:none; border-radius:8px; display:grid;
  place-items:center; background:#f3f4f6; font-weight:800; font-size:.9rem;
  color:var(--ink-2);
}
.choice.sel{border-color:var(--blue); background:var(--blue-l)}
.choice.sel .key{background:var(--blue); color:#fff}
.choice.right{border-color:var(--green); background:var(--green-l)}
.choice.right .key{background:var(--green); color:#fff}
.choice.wrong{border-color:var(--red); background:var(--red-l)}
.choice.wrong .key{background:var(--red); color:#fff}

.marks{border-top:1px dashed var(--line); margin-top:20px; padding-top:16px}
.mark-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.chip{
  padding:8px 14px; border-radius:999px; border:1.5px solid var(--line-2);
  background:var(--card); cursor:pointer; font-size:.9rem; font-weight:600;
  color:var(--ink-2); transition:.14s;
}
.chip:hover{border-color:var(--muted)}
.chip.green.on{background:var(--green-l); border-color:var(--green); color:var(--green-d)}
.chip.amber.on{background:var(--amber-l); border-color:var(--amber); color:var(--amber)}
.chip.blue.on{background:var(--blue-l); border-color:var(--blue); color:var(--blue)}
textarea,input[type=text],input[type=password],input[type=number],select{
  font:inherit; padding:9px 12px; border:1.5px solid var(--line-2);
  border-radius:9px; background:var(--card); color:var(--ink); width:100%;
}
textarea:focus,input:focus,select:focus{
  outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

/* 生词浮层 */
.pop{
  position:absolute; z-index:200; max-width:300px; background:#111827; color:#fff;
  border-radius:10px; padding:10px 13px; font-size:.9rem; line-height:1.55;
  box-shadow:0 12px 30px rgba(0,0,0,.28);
}
.pop b{color:#fcd34d}
.pop .ctx{display:block; margin-top:5px; padding-top:5px;
          border-top:1px solid rgba(255,255,255,.18); color:#a7f3d0}
.pop .miss{color:#fca5a5}

/* ---------------------------------------------------- 报告 / 图表 */
.bars{display:grid; gap:8px}
.bar-row{display:grid; grid-template-columns:104px 1fr 56px; gap:10px;
         align-items:center; font-size:.9rem}
/* 这两个必须是 block：它们是 <span>，行内元素上的 height 不生效，条会是空的 */
/* position:relative：.prev-mark 是 absolute 的，没有定位上下文会被 top/bottom
   拉成一条贯穿整页的竖线。weekly.js 现在写了行内 style 兜着，这里补上免得以后忘 */
.bar-track{display:block; position:relative; background:#f3f4f6; border-radius:999px;
           height:20px; overflow:hidden}
.bar-fill{display:block; height:100%; min-width:3px; border-radius:999px;
          background:var(--blue); transition:width .5s ease}
.bar-fill.green{background:var(--green)} .bar-fill.amber{background:var(--amber)}
.bar-fill.red{background:var(--red)} .bar-fill.purple{background:var(--purple)}
.bar-row .val{text-align:right; font-family:var(--mono); color:var(--muted)}

.legend{display:flex; gap:14px; flex-wrap:wrap; font-size:.85rem; color:var(--muted)}
.legend i{width:11px; height:11px; border-radius:3px; display:inline-block;
          margin-right:5px; vertical-align:-1px}

table{width:100%; border-collapse:collapse; font-size:.9rem}
thead th{
  text-align:left; padding:9px 10px; font-size:11px; letter-spacing:1px;
  text-transform:uppercase; color:var(--muted); border-bottom:1.5px solid var(--line);
  font-weight:700; white-space:nowrap;
}
tbody td{padding:10px; border-bottom:1px solid var(--line); vertical-align:top}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:#fafbfc}
td.num,th.num{font-family:var(--mono)}
.table-scroll{overflow-x:auto}

.pill{display:inline-block; padding:2px 9px; border-radius:999px; font-size:.78rem;
      font-weight:700; white-space:nowrap}
.pill.green{background:var(--green-l); color:var(--green-d)}
.pill.red{background:var(--red-l); color:var(--red)}
.pill.amber{background:var(--amber-l); color:var(--amber)}
.pill.blue{background:var(--blue-l); color:var(--blue)}
.pill.purple{background:var(--purple-l); color:var(--purple)}
.pill.gray{background:#f3f4f6; color:var(--muted)}

/* ---------------------------------------------------- 每日错题 */
.stage-head{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:14px 18px; border-radius:var(--radius); margin-bottom:16px;
  background:linear-gradient(135deg,var(--blue-l),var(--purple-l));
  border:1px solid #dbeafe;
}
.stage-head h2{margin:0; font-size:1.15rem}
.stage-head .hint{color:var(--ink-2); font-size:.92rem; width:100%}
.steps{counter-reset:st}
.step{
  border:1px solid var(--line); border-radius:11px; padding:14px 16px;
  margin-bottom:10px; background:var(--card); position:relative;
}
.step.blocked{border-color:var(--amber); background:var(--amber-l)}
.step h4{margin:0 0 6px; font-size:1rem; display:flex; align-items:center; gap:9px}
.step h4 .no{
  width:24px; height:24px; border-radius:7px; background:var(--blue); color:#fff;
  display:grid; place-items:center; font-size:.8rem; flex:none;
}
.step .body{color:var(--ink-2); font-size:.97rem}
.step .blockbtn{
  position:absolute; right:12px; top:12px; font-size:.78rem; padding:3px 9px;
  border-radius:7px; border:1px solid var(--line-2); background:var(--card);
  cursor:pointer; color:var(--muted);
}
.step .blockbtn:hover{border-color:var(--amber); color:var(--amber)}
.step.blocked .blockbtn{border-color:var(--amber); color:var(--amber); font-weight:700}

.video-box{margin:16px 0}
.video-frame{
  position:relative; width:100%; aspect-ratio:16/9; border-radius:11px;
  overflow:hidden; background:#000; border:1px solid var(--line);
}
.video-frame iframe{width:100%; height:100%; border:0}
.video-gate{
  display:flex; align-items:center; gap:10px; margin-top:10px; font-size:.9rem;
  color:var(--amber); background:var(--amber-l); border:1px solid #fde68a;
  border-radius:9px; padding:9px 13px;
}
.note{
  background:var(--blue-l); border:1px solid #dbeafe; border-left:4px solid var(--blue);
  border-radius:9px; padding:11px 14px; margin:14px 0; font-size:.94rem;
}
.note.green{background:var(--green-l); border-color:#bbf7d0; border-left-color:var(--green)}
.note.red{background:var(--red-l); border-color:#fecaca; border-left-color:var(--red)}
.note.amber{background:var(--amber-l); border-color:#fde68a; border-left-color:var(--amber)}

.quiz-q{border:1px solid var(--line); border-radius:11px; padding:14px 16px;
        margin-bottom:12px}
.quiz-q .word{font-size:1.15rem; font-weight:800; color:var(--purple);
              margin-bottom:10px; font-family:var(--mono)}
.quiz-opts{display:grid; gap:8px}
.quiz-opt{
  padding:9px 13px; border:1.5px solid var(--line-2); border-radius:9px;
  cursor:pointer; font-size:.95rem; transition:.14s;
}
.quiz-opt:hover{border-color:var(--purple); background:var(--purple-l)}
.quiz-opt.sel{border-color:var(--purple); background:var(--purple-l); font-weight:600}
.quiz-opt.right{border-color:var(--green); background:var(--green-l)}
.quiz-opt.wrong{border-color:var(--red); background:var(--red-l)}

.empty{text-align:center; padding:48px 20px; color:var(--muted)}
.empty .big{font-size:2.4rem; margin-bottom:8px}

.toast{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%);
  background:#111827; color:#fff; padding:12px 20px; border-radius:10px;
  font-weight:600; z-index:9999; box-shadow:0 16px 36px rgba(0,0,0,.25);
  max-width:92vw; text-align:center;
}
.toast.good{background:var(--green-d)} .toast.bad{background:var(--red)}

@media (max-width:640px){
  .bar-row{grid-template-columns:84px 1fr 48px; font-size:.85rem}
  .stem{font-size:1.05rem}
  .exam-bar{top:53px}
}

/* ---------------------------------------------------- 生词本 */
.wb-head{display:flex; align-items:flex-start; justify-content:space-between;
         gap:16px; flex-wrap:wrap}
.wb-head .page-sub{margin-bottom:16px}
.wb-word{font-size:1.05rem; letter-spacing:.2px}
.wb-ctx{color:var(--green-d); font-size:.85rem; margin-top:3px}
.wb-src{color:var(--muted); font-size:.85rem}
.wb-streak{color:var(--muted-2); font-size:.78rem; font-family:var(--mono)}
.wb-todo{color:var(--red); font-size:.87rem}
.wb-missing{background:var(--red-l)}
.wb-table td{vertical-align:middle}
.wb-foot{color:var(--muted); font-size:.8rem; text-align:center; margin-top:18px}
.print-only{display:none}

/* ---------------------------------------------------- 打印：只留词表 */
@media print{
  @page{margin:14mm}
  body{background:#fff; font-size:11.5pt}
  .topbar, .exam-bar, .no-print, .toast, .tiles{display:none !important}
  .print-only{display:block}
  .wrap{max-width:none; padding:0}
  .page-title{font-size:16pt; margin-bottom:2px}
  .page-sub{margin-bottom:10px; font-size:10pt}
  .card{box-shadow:none; border:none; padding:0; margin:0}
  .card-head{border-bottom:1.5px solid #333; padding-bottom:6px; margin-bottom:10px}
  .card-head h2{font-size:13pt}
  .table-scroll{overflow:visible}
  table{font-size:10.5pt}
  thead th{border-bottom:1.5px solid #333; color:#000}
  tbody td{border-bottom:1px solid #ccc; padding:7px 8px}
  tbody tr{break-inside:avoid}
  tbody tr:hover{background:none}
  .wb-missing{background:none}
  .wb-todo{color:#666}
  .wb-ctx{color:#333}
  a{color:#000; text-decoration:none}
}
.wb-acts{white-space:nowrap; display:flex; gap:6px}
.wb-acts .wb-del{color:var(--muted)}
.wb-acts .wb-del:hover{color:var(--red); border-color:var(--red)}

/* ---------------------------------------------------- 每题用时柱状图 */
.tchart-wrap{position:relative; overflow-x:auto}
.tchart{display:block; width:100%; min-width:640px; height:auto}
.tchart-hit rect{cursor:default}
.tchart-hit rect:focus{outline:none}
.tchart-hit rect:hover, .tchart-hit rect:focus{fill:rgba(31,41,55,.04)}
.tchart-tip{
  position:absolute; z-index:20; pointer-events:none;
  background:#111827; color:#fff; border-radius:9px; padding:9px 12px;
  font-size:.85rem; line-height:1.5; white-space:nowrap;
  box-shadow:0 10px 26px rgba(0,0,0,.22);
}
.tchart-tip b{color:#fff}
.tchart-tip .t-sub{color:#c7cbd1; font-size:.8rem}
.tchart-tip .pill{font-size:.7rem}
@media print{ .tchart-tip{display:none} .tchart{min-width:0} }

/* ---------------------------------------------------- 今日任务队列 */
.queue{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:14px 16px; margin-bottom:16px;
}
.queue-head{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:11px}
.queue-head .sub{color:var(--muted); font-size:.85rem}
.queue-chips{display:flex; gap:9px; flex-wrap:wrap}
.qchip{
  font:inherit; text-align:left; cursor:pointer; padding:8px 13px; border-radius:10px;
  border:1.6px solid var(--line-2); background:var(--card); transition:.14s;
  display:grid; gap:1px; min-width:118px;
}
.qchip:hover{border-color:var(--blue)}
.qchip.on{border-color:var(--blue); background:var(--blue-l)}
.qchip.done{opacity:.62}
.qchip.late{border-color:var(--amber)}
.qchip .qk{font-size:.72rem; font-weight:700; letter-spacing:.4px; color:var(--purple)}
.qchip .qn{font-size:.95rem; font-weight:700; color:var(--ink)}
.qchip .qs{font-size:.75rem; color:var(--muted)}
.qchip.late .qs{color:var(--amber); font-weight:600}
.qchip.done .qs{color:var(--green-d)}
.qchip .qk{white-space:nowrap}
.queue-head #moreBtn{flex:none}

/* ============================================================
   SAT：短文 / 双栏答题 / 模块计时
   ============================================================ */
.brand .logo{font-size:11px; letter-spacing:.3px}

/* 模块进度条 */
.stage-strip{display:flex; align-items:stretch; gap:6px; flex-wrap:wrap; margin:4px 0 0}
.stage-strip .stg{
  flex:1 1 120px; border:1.5px solid var(--line-2); border-radius:10px; padding:8px 12px;
  background:var(--card); display:grid; gap:1px; min-width:0;
}
.stage-strip .stg b{font-size:.88rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.stage-strip .stg span{font-size:.78rem; color:var(--muted)}
.stage-strip .stg.brk{flex:0 1 96px; background:#f9fafb}
.stage-strip .stg.done{opacity:.6}
.stage-strip .stg.done span{color:var(--green-d)}
.stage-strip .stg.now{border-color:var(--blue); background:var(--blue-l)}
.stage-strip .stg.now span{color:var(--blue); font-weight:700}
.stage-strip .stg-arrow{align-self:center; color:var(--muted-2); font-style:normal}
.stage-strip.compact{margin:0 0 14px}
.stage-strip.compact .stg{padding:5px 10px}
@media (max-width:640px){ .stage-strip .stg-arrow{display:none} .stage-strip .stg{flex:1 1 40%} }

.exam-bar .stage-name{font-weight:800; font-size:.95rem; color:var(--ink)}

/* 题目 */
.qhead{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.qbody{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:26px; align-items:start}
.qbody.single{grid-template-columns:minmax(0,1fr)}
.qbody.math.single .qside{max-width:760px}
@media (max-width:860px){ .qbody{grid-template-columns:minmax(0,1fr); gap:14px} }

.passage{
  font-size:1.06rem; line-height:1.8; padding:4px 22px 4px 0;
  border-right:1px solid var(--line);
}
.qbody.single .passage{border-right:none; padding-right:0}
@media (max-width:860px){ .passage{border-right:none; padding-right:0; border-bottom:1px dashed var(--line); padding-bottom:10px} }
.passage p{margin:0 0 .85em}
.passage p.intro{color:var(--ink-2); font-size:.98rem}
.passage p.tlabel{font-weight:800; margin:.4em 0 .2em; color:var(--ink)}
.passage .poem{padding-left:1.6em; margin:0 0 .85em; line-height:1.75}
.passage ul.notes{margin:.2em 0 .9em; padding-left:1.3em}
.passage ul.notes li{margin:.35em 0}
.passage u, .stem u, .ctext u{text-decoration-thickness:1.5px; text-underline-offset:3px}
.blank{display:inline-block; min-width:4.2em; border-bottom:1.6px solid var(--ink); color:transparent;
       line-height:1; margin:0 2px; user-select:none}
.passage .fig-wrap img, .qside .fig-wrap img{max-width:min(520px,100%)}

.stem{font-size:1.06rem}
.stem p{margin:0 0 .6em}
.stem-math{margin:12px 0; text-align:center; font-size:1.12rem; line-height:1.9}
.choice .ctext{flex:1; min-width:0}
.choice .ctext .w{cursor:help}
.qside .choices{margin-top:14px}

.picker-hint.quiet{background:#f9fafb; border-color:var(--line); color:var(--muted)}

/* 表格（题目里的数据表） */
.dtable-wrap{overflow-x:auto; margin:4px 0 14px}
table.dtable{width:auto; min-width:60%; margin:0 auto; border-collapse:collapse; font-size:.92rem; line-height:1.4}
table.dtable caption{font-weight:700; padding:0 0 6px; color:var(--ink); caption-side:top}
table.dtable th, table.dtable td{border:1px solid var(--line-2); padding:5px 9px; text-align:center;
  vertical-align:middle; text-transform:none; letter-spacing:0; font-size:.9rem; color:var(--ink); white-space:normal}
table.dtable thead th{background:#f3f4f6; font-weight:700}
table.dtable tbody tr:hover{background:none}
.dtable-note{font-size:.82rem; color:var(--muted); margin-top:4px}

/* 数学填空 */
.spr{margin:16px 0 6px; padding:14px 16px; border:1.6px dashed var(--line-2); border-radius:11px; background:#fafbff}
.spr-input{font-family:var(--mono) !important; font-size:1.35rem !important; max-width:220px;
           letter-spacing:1px; margin:6px 0 8px}
.spr-tip{font-size:.8rem; color:var(--muted)}
.spr.right{border-color:var(--green); background:var(--green-l)}
.spr.wrong{border-color:var(--red); background:var(--red-l)}

/* 查词浮层 */
.pop .ph{color:#9ca3af; font-family:var(--mono); font-size:.8rem}
.pop .mean{margin-top:3px}

/* 休息 */
.break-card{text-align:center; padding:48px 20px}
.break-card .big{font-size:3rem}
.break-card h2{margin:6px 0 10px}
.break-card p{color:var(--ink-2)}
.break-card .sub{color:var(--muted); font-size:.9rem}

/* 分数卡 */
.score-band{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px}
.score-band .sb{flex:1 1 180px; background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:14px 18px}
.score-band .sb b{display:block; font-family:var(--mono); font-size:1.7rem; font-weight:800; line-height:1.25}
.score-band .sb .lbl{display:block}
.score-band .sb small{color:var(--muted); font-size:.82rem}
.score-band .sb.total{background:linear-gradient(135deg,var(--blue-l),var(--purple-l)); border-color:#dbeafe}
.score-band .sb.total b{color:var(--blue)}

.points{display:flex; gap:5px; flex-wrap:wrap; margin-top:3px}
.points .pill{font-weight:600}
.tabs{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px}
table.dtable tbody tr:last-child td{border-bottom:1px solid var(--line-2)}
.stage-strip .stg.brk{flex:0 1 118px}
.bar-row.wide{grid-template-columns:minmax(150px,300px) 1fr 56px}
.bar-row.wide > span:first-child{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
@media (max-width:640px){ .bar-row.wide{grid-template-columns:120px 1fr 44px} }
.bar-fill.gray{background:var(--muted-2)}
hr.soft{border:none; border-top:1px dashed var(--line); margin:18px 0}

/* 原因登记：三类 */
.stuck-opts{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px}
.stuck-opt{border:1.6px solid var(--line-2); border-radius:11px; padding:12px 14px; cursor:pointer;
  display:grid; gap:3px; transition:.14s; background:var(--card)}
.stuck-opt:hover{border-color:var(--blue)}
.stuck-opt span{font-size:.84rem; color:var(--muted)}
.stuck-opt.on{border-color:var(--blue); background:var(--blue-l)}
.step.pickable{padding-right:96px}
.bar-track .prev-mark{position:absolute; top:-3px; bottom:-3px; width:2px; margin-left:-1px;
  background:var(--ink); border-radius:1px}
.bar-track:has(.prev-mark){overflow:visible}

/* 数学：n 次根号、大括号 */
.nroot{display:inline-flex; align-items:flex-start; white-space:nowrap}
.nroot sup.idx{font-size:.58em; vertical-align:0; margin-right:-.55em; position:relative; top:-.15em; left:.05em}
.paren{font-size:1.55em; line-height:1; vertical-align:-.12em; font-weight:300}
.qbody.math .fig-wrap{margin:4px 0 12px}
.qbody.math .fig-wrap img{max-width:min(420px,100%)}
.qbody.math .dtable-wrap table.dtable{min-width:0}
.math-table{margin:6px auto 12px}
.ctext .dtable-wrap{margin:2px 0}
.ctext table.dtable{min-width:0; margin:0}
.fig-note{font-size:.88rem; color:var(--muted); text-align:center; margin:-6px 0 10px}
/* 分数：整体竖直居中（inline-flex 的基线是分子，会把整个分数拉到基线以下） */
.frac{display:inline-block; vertical-align:middle; text-align:center; margin:.15em .12em}
.frac .fn, .frac .fd{display:block; line-height:1.2}
.rad .frac{margin-top:.2em}
.spr-input{max-width:240px}
.spr-input::placeholder{font-size:.95rem; letter-spacing:0}

/* 模块交卷后的答案页 */
.review-next{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  background:linear-gradient(135deg,var(--green-l),var(--blue-l)); border-color:#bbf7d0}
.review-next h2{margin:0 0 4px; font-size:1.15rem}
.review-next p{margin:0; color:var(--ink-2); font-size:.93rem}
.review-table tr.wrong td:first-child{box-shadow:inset 3px 0 0 var(--red)}
.rv-detail td{background:#fafbfd; padding:14px 16px}
.rv-detail .rv-problem{max-width:1040px}
.stage-strip .stg.next{border-color:var(--green); border-style:dashed}
.stage-strip .stg.next span{color:var(--green-d); font-weight:700}

/* 练习模式 */
.pr-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px}
.pr-mod{border:1.5px solid var(--line-2); border-radius:11px; padding:12px 14px; display:grid; gap:4px; align-content:start}
.pr-mod b{font-size:.98rem}
.pr-mod span{font-size:.84rem; color:var(--muted)}
.pr-mod .pr-meta{color:var(--ink-2)}
.pr-mod .btn{justify-self:start; margin-top:6px}
.pr-mod.locked{background:#f9fafb; opacity:.75}
.pr-bar{position:static; border:1px solid var(--line); border-radius:var(--radius); margin-bottom:12px}
.qnav button.ok{background:var(--green-l); border-color:var(--green); color:var(--green-d)}
.qnav button.bad{background:var(--red-l); border-color:var(--red); color:var(--red)}
.qnav button.on.ok, .qnav button.on.bad{box-shadow:0 0 0 2px var(--blue)}
.pr-feedback{margin-top:16px}

/* 选项本身是图（如 PT5 数学 M1 #16） */
.ctext img.cimg{display:block; width:100%; max-width:260px; height:auto; margin:2px 0}
.choices:has(.cimg){display:grid; grid-template-columns:1fr 1fr; gap:10px}
.choices:has(.cimg) .choice{margin:0}
@media (max-width:560px){ .choices:has(.cimg){grid-template-columns:1fr} }

/* 今日单词卡片 */
.wc-box .card-head{margin-bottom:8px}
.wc-progress{height:6px; background:var(--line); border-radius:99px; overflow:hidden; margin-bottom:14px}
.wc-progress span{display:block; height:100%; background:var(--purple); transition:width .3s}
.wc-card{border:1px solid var(--line); border-radius:14px; padding:22px 22px 18px; text-align:center;
  background:linear-gradient(180deg,#fff,var(--purple-l)); cursor:pointer; min-height:170px}
.wc-tags{min-height:22px}
.wc-word{font-size:2.1rem; font-weight:800; color:var(--purple); letter-spacing:.3px; margin-top:4px; word-break:break-word}
.wc-phon{color:var(--muted); font-family:var(--mono); font-size:.9rem; margin-top:2px}
.wc-ex{margin:14px auto 0; max-width:640px; font-size:1.02rem; line-height:1.65; color:var(--ink, #1f2937); text-align:left}
.wc-ex mark{background:#fde68a; padding:0 2px; border-radius:3px}
.wc-src{color:var(--muted-2); font-size:.8rem; margin-top:8px}
.wc-back{border-top:1px dashed var(--line); margin-top:14px; padding-top:12px; cursor:default}
.wc-ctx{font-size:1.1rem; color:var(--green-d)}
.wc-mean{color:var(--muted); font-size:.92rem; margin-top:6px; white-space:pre-line}
.wc-btns{justify-content:center; margin-top:14px}
.wc-btns .btn{min-width:150px}
.wc-no{color:var(--red)}

/* 首页：今天的任务 · 打卡 */
.today-card .card-head{margin-bottom:10px}
.streak{font-size:.92rem; color:var(--muted); background:var(--bg); border:1px solid var(--line);
  border-radius:99px; padding:4px 12px; white-space:nowrap}
.streak.on{color:#c2410c; background:#fff7ed; border-color:#fed7aa}
.streak b{font-size:1.1rem}
.today-list{display:grid; gap:8px}
.today-item{display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line);
  border-radius:12px; color:var(--ink); text-decoration:none; background:#fff}
.today-item:hover{border-color:var(--blue); background:var(--blue-l)}
.today-item .tick{width:26px; height:26px; flex:none; border-radius:50%; border:2px solid var(--line-2);
  display:grid; place-items:center; font-weight:800; color:#fff}
.today-item.done{background:var(--green-l); border-color:#bbf7d0}
.today-item.done .tick{background:var(--green); border-color:var(--green)}
.today-item .t-main{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.today-item .t-main small{color:var(--muted)}
.today-item .t-go{color:var(--blue); font-weight:600; font-size:.9rem; white-space:nowrap}
.today-item.done .t-go{color:var(--green-d)}
.t-bar{display:block; height:6px; background:var(--line); border-radius:99px; overflow:hidden; max-width:260px; margin-top:4px}
.t-bar span{display:block; height:100%; background:var(--blue)}
.today-item.done .t-bar span{background:var(--green)}
.today-foot{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:14px}
.week-dots{display:flex; gap:8px}
.wd{display:flex; flex-direction:column; align-items:center; gap:3px; font-size:.75rem; color:var(--muted)}
.wd i{width:24px; height:24px; border-radius:50%; background:var(--line); display:grid; place-items:center;
  font-style:normal; color:#fff; font-weight:800; font-size:.8rem}
.wd.done i{background:var(--green)}
.wd.today i{box-shadow:0 0 0 2px var(--blue)}
.wd.future i{background:var(--bg); border:1px dashed var(--line-2)}
.today-msg{color:var(--muted); font-size:.9rem}

/* 练习：按题型 */
.sk-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:10px}
.sk-item{border:1px solid var(--line); border-radius:12px; padding:12px 14px; display:flex; flex-direction:column; gap:4px; background:#fff}
.sk-item b{font-size:1rem}
.sk-item .sk-en{color:var(--muted-2); font-size:.78rem}
.sk-item .sk-meta{color:var(--muted); font-size:.85rem}
.sk-item .btn{align-self:flex-start; margin-top:6px}
.sk-acc{font-weight:700}
.sk-acc.low{color:var(--red)} .sk-acc.mid{color:var(--amber)} .sk-acc.high{color:var(--green)}
.sk-sec{margin:4px 0 10px; font-weight:700; color:var(--ink-2)}

/* 登录页 */
.login-wrap{display:grid; place-items:center; min-height:60vh}
.login-card{max-width:420px; width:100%; text-align:center; padding:34px 28px}
.login-card h1{margin:10px 0 4px; font-size:1.5rem}
.login-logo{width:56px; height:56px; margin:0 auto; border-radius:14px; background:var(--blue);
  color:#fff; font-weight:800; display:grid; place-items:center; letter-spacing:.5px}
.gbtn{display:inline-flex; align-items:center; gap:10px; background:#fff; color:var(--ink);
  border:1px solid var(--line-2); margin-top:8px}
.gbtn:hover{background:var(--bg); border-color:var(--line-2)}
.login-foot{color:var(--muted-2); font-size:.8rem; margin:18px 0 0}
.userchip{display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:.85rem}
.userchip a{color:var(--muted)}

/* 官方解析（折叠） */
.official{margin-top:10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); padding:0 12px}
.official summary{cursor:pointer; padding:10px 0; font-weight:600; color:var(--blue); font-size:.92rem}
.official[open] summary{border-bottom:1px solid var(--line); margin-bottom:8px}
.official > div{padding:0 0 12px; line-height:1.75; color:var(--ink-2)}
.official p{margin:0 0 8px}
.official .wrong-opt{color:var(--muted); font-size:.9rem}
