/* ============================================================
   合规风控刷题 · 响应式静态应用样式
   视觉忠实 design_src/合规风控刷题.dc.html 的 PHONE / DESKTOP 呈现，
   组件令牌复用 spectrum-tokens.css。
   断点：窄屏 = 手机布局（底部 Tab）；≥1024px = 电脑布局（左侧栏 + 主区）。
   ============================================================ */

/* ---- 颜色别名：把设计稿使用的 --*-color-* / indigo 名称映射到现有色板，
   var() 在使用处解析，因此暗色主题会随 --green-* 等自动切换 ---- */
:root{
  --positive-color-200:var(--green-200); --positive-color-300:var(--green-300);
  --positive-color-500:var(--green-500); --positive-color-700:var(--green-700);
  --positive-color-1000:var(--green-1000); --positive-color-1100:var(--green-1100);
  --negative-color-200:var(--red-200); --negative-color-300:var(--red-300);
  --negative-color-500:var(--red-500); --negative-color-700:var(--red-700);
  --negative-color-1000:var(--red-1000); --negative-color-1100:var(--red-1100);
  --notice-color-200:var(--orange-200); --notice-color-300:var(--orange-300);
  --notice-color-500:var(--orange-500); --notice-color-700:var(--orange-700);
  --notice-color-900:var(--orange-900); --notice-color-1100:var(--orange-900);
  --notice-color-1200:var(--orange-900);
  --indigo-200:rgb(225,227,253); --indigo-1100:rgb(58,52,180);
  --hair:rgba(20,30,60,.08);
}
[data-theme="dark"]{
  --indigo-200:rgb(28,30,74); --indigo-1100:rgb(152,156,250);
  --hair:rgba(255,255,255,.08);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;}
body{
  font-family:var(--font-sans);
  background:var(--background-layer-1);
  color:var(--body-color);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button{font-family:inherit;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:var(--gray-400);border-radius:9px;}
::-webkit-scrollbar-track{background:transparent;}
*{scrollbar-width:thin;scrollbar-color:var(--gray-400) transparent;}

@keyframes fadeUp{from{opacity:.4;transform:translateY(7px);}to{opacity:1;transform:translateY(0);}}
@keyframes slideUp{from{transform:translateY(100%);}to{transform:translateY(0);}}
@keyframes spin{to{transform:rotate(360deg);}}

/* ============================================================
   外壳布局
   ============================================================ */
#app{
  min-height:100%;
  display:flex;
  flex-direction:column;
  background:var(--background-layer-1);
}

/* ---- 顶部品牌栏（手机/电脑通用，sticky）---- */
.brandbar{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;justify-content:center;
  border-bottom:1px solid var(--hair);
  background:color-mix(in srgb,var(--background-base) 82%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.brandbar-inner{
  width:100%;max-width:1640px;
  display:flex;align-items:center;gap:14px;
  padding:11px 18px;
}
.brand-logo{
  width:36px;height:36px;flex:none;border-radius:11px;
  background:var(--accent-background);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px -3px var(--accent-background);
  border:none;cursor:pointer;padding:0;
}
.brand-name{font-size:16px;font-weight:800;color:var(--heading-color);letter-spacing:-.01em;line-height:1.1;}
.brand-sub{font-size:12px;color:var(--neutral-subdued-content);font-weight:500;}
.brand-titles{display:flex;flex-direction:column;gap:1px;min-width:0;cursor:pointer;}
.brand-spacer{flex:1;}
.brand-status{
  display:none;align-items:center;gap:7px;
  font-size:12px;color:var(--neutral-subdued-content);font-weight:600;
}
.brand-status i{width:7px;height:7px;border-radius:50%;background:var(--positive-color-700);display:block;}
.theme-toggle{
  display:flex;align-items:center;background:var(--gray-100);
  border-radius:9999px;padding:3px;gap:2px;border:1px solid var(--hair);
}
.theme-toggle button{
  appearance:none;border:none;cursor:pointer;
  font-size:13px;font-weight:700;padding:5px 14px;border-radius:9999px;
  background:transparent;color:var(--neutral-subdued-content);
  transition:all .13s;
}
.theme-toggle button.on{
  background:var(--background-base);color:var(--accent-content);
  box-shadow:0 1px 3px rgba(0,0,0,.12);
}

/* ---- 主体行：侧栏 + 主区 ---- */
.shell{flex:1;min-height:0;display:flex;width:100%;max-width:1640px;margin:0 auto;}

/* ---- 电脑侧边栏（默认隐藏，≥1024 显示）---- */
.sidebar{display:none;}

/* ---- 主内容区 ---- */
.main{flex:1;min-width:0;overflow-x:hidden;padding-bottom:78px;}
.view{animation:fadeUp .26s ease;}
.page{max-width:1020px;margin:0 auto;padding:18px 16px 26px;display:flex;flex-direction:column;gap:16px;}
.page-head .eyebrow{font-size:13px;color:var(--neutral-subdued-content);font-weight:600;}
.page-head h1{font-size:22px;font-weight:800;color:var(--heading-color);margin:2px 0 0;line-height:1.25;letter-spacing:-.01em;}
.page-head .lede{font-size:14px;color:var(--neutral-subdued-content);margin-top:6px;line-height:1.55;}

/* ---- 底部 Tab 栏（手机）---- */
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:30;
  display:flex;border-top:1px solid var(--gray-200);
  background:color-mix(in srgb,var(--background-base) 92%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:7px 4px calc(9px + env(safe-area-inset-bottom));
}
.tabbar button{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
  background:none;border:none;cursor:pointer;padding:3px 0;color:var(--gray-500);
}
.tabbar button span{font-size:10.5px;font-weight:600;}
.tabbar button.on{color:var(--accent-background);}
.tabbar button.on span{font-weight:700;}

/* ============================================================
   通用组件
   ============================================================ */
.card{background:var(--background-base);border:1px solid var(--gray-200);border-radius:16px;}
.icon{display:block;flex:none;}
.btn{
  appearance:none;cursor:pointer;border:none;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-weight:800;border-radius:9999px;transition:all .13s;
}
.btn-accent{background:var(--accent-background);color:#fff;box-shadow:0 8px 18px -8px var(--accent-background);}
.btn-accent:hover{background:var(--accent-background-hover);}
.btn-ghost{background:var(--background-base);color:var(--neutral-content);border:1px solid var(--gray-300);}
.btn-block{width:100%;}
.btn-lg{height:50px;padding:0 28px;font-size:16px;border-radius:14px;}
.btn-md{height:44px;padding:0 22px;font-size:15px;}
.btn[disabled]{background:var(--disabled-background);color:var(--disabled-content);box-shadow:none;cursor:default;}

/* ---- chips：题型 / 状态 / 待核实 ---- */
.chip{
  display:inline-flex;align-items:center;height:21px;padding:0 9px;
  border-radius:9999px;font-size:11.5px;font-weight:700;flex:none;white-space:nowrap;
}
.chip-cat{
  height:21px;padding:0 9px;font-weight:600;
  background:var(--gray-100);color:var(--neutral-subdued-content);
  border:1px solid var(--gray-200);
}
.chip-review{background:var(--notice-color-200);color:var(--notice-color-1100);font-weight:700;}
.chip-type.t-single{background:var(--blue-200);color:var(--blue-1100);}
.chip-type.t-multiple{background:var(--indigo-200);color:var(--indigo-1100);}
.chip-type.t-judge{background:var(--gray-200);color:var(--gray-800);}
.chip-type.t-indeterminate{background:var(--orange-200);color:var(--notice-color-1200);}
.chip-status.s-correct{background:var(--positive-color-200);color:var(--positive-color-700);}
.chip-status.s-wrong{background:var(--negative-color-200);color:var(--negative-color-1000);}
.chip-status.s-unanswered{background:var(--gray-200);color:var(--gray-700);}
.chip-status.s-ungraded{background:var(--notice-color-200);color:var(--notice-color-1100);}

/* ---- 选择性 chip（筛选 / 题量 / 时长）---- */
.selchip{
  display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;
  border-radius:9999px;font-size:13.5px;font-weight:600;cursor:pointer;
  border:1.5px solid var(--gray-300);background:var(--background-base);
  color:var(--neutral-content);transition:all .12s;
}
.selchip .muted{opacity:.55;}
.selchip.on{
  border-color:var(--accent-background);
  background:color-mix(in srgb,var(--accent-background) 12%,var(--background-base));
  color:var(--accent-content);
}
.chips-wrap{display:flex;flex-wrap:wrap;gap:8px;}
.field-label{font-size:12px;font-weight:700;color:var(--gray-600);letter-spacing:.04em;margin-bottom:9px;}

/* ---- segmented（顺序/随机）---- */
.seg{display:flex;background:var(--gray-100);border-radius:11px;padding:3px;gap:3px;}
.seg button{
  flex:1;appearance:none;border:none;cursor:pointer;font-size:14px;font-weight:700;
  padding:9px 0;border-radius:9px;transition:all .12s;
  background:transparent;color:var(--neutral-subdued-content);
}
.seg button.on{background:var(--background-base);color:var(--accent-content);box-shadow:0 1px 3px rgba(0,0,0,.12);}

/* ============================================================
   题目选项行
   ============================================================ */
.options{display:flex;flex-direction:column;gap:10px;}
.opt{
  display:flex;align-items:flex-start;gap:12px;padding:13px 14px;
  border-radius:13px;border:1.5px solid var(--gray-300);background:var(--background-base);
  cursor:pointer;transition:all .13s;text-align:left;width:100%;
}
button.opt{font-family:inherit;}
.opt-letter{
  flex:none;width:25px;height:25px;border-radius:50%;
  border:2px solid var(--gray-400);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:var(--gray-600);background:transparent;
}
.opt--multi .opt-letter{border-radius:7px;}
.opt-text{flex:1;font-size:15px;line-height:1.5;color:var(--neutral-content);font-weight:500;}
.opt-mark{flex:none;margin-top:2px;}
.opt.is-selected{border:2px solid var(--accent-background);background:color-mix(in srgb,var(--accent-background) 8%,var(--background-base));}
.opt.is-selected .opt-letter{border-color:var(--accent-background);background:var(--accent-background);color:#fff;}
.opt.is-correct{border:2px solid var(--positive-color-700);background:color-mix(in srgb,var(--positive-color-500) 16%,var(--background-base));}
.opt.is-correct .opt-letter{border-color:var(--positive-color-700);background:var(--positive-color-700);color:#fff;}
.opt.is-wrong{border:2px solid var(--negative-color-700);background:color-mix(in srgb,var(--negative-color-500) 13%,var(--background-base));}
.opt.is-wrong .opt-letter{border-color:var(--negative-color-700);background:var(--negative-color-700);color:#fff;}
.opt.is-static{cursor:default;}

/* 复习/错题/收藏卡片里的紧凑只读选项 */
.opt-ro{
  display:flex;align-items:flex-start;gap:10px;padding:9px 11px;border-radius:10px;
  border:1.5px solid var(--gray-200);background:var(--background-base);
}
.opt-ro .opt-letter{width:22px;height:22px;font-size:12px;}

/* ---- 题干 / 元信息 ---- */
.q-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.q-stem{font-size:17px;line-height:1.6;font-weight:600;color:var(--neutral-content);}
.q-hint{text-align:center;font-size:12.5px;color:var(--neutral-subdued-content);}

/* ---- 作答反馈横幅 + 解析 ---- */
.banner{display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:13px;font-size:15px;font-weight:800;}
.banner .right{margin-left:auto;font-size:13px;font-weight:700;opacity:.9;}
.banner.b-correct{background:var(--positive-color-200);color:var(--positive-color-700);}
.banner.b-wrong{background:var(--negative-color-200);color:var(--negative-color-1000);}
.banner.b-review{background:var(--notice-color-200);color:var(--notice-color-1100);}
.explain{background:var(--background-layer-1);border:1px solid var(--gray-200);border-radius:13px;padding:14px;}
.explain-row{display:flex;gap:18px;margin-bottom:10px;}
.explain-row .k{font-size:11px;color:var(--neutral-subdued-content);font-weight:600;}
.explain-row .v{font-size:15px;font-weight:800;color:var(--neutral-content);margin-top:2px;}
.explain-row .v.good{color:var(--positive-color-700);}
.explain-block{border-top:1px solid var(--gray-200);padding-top:10px;}
.explain-block .lbl{font-size:11px;color:var(--neutral-subdued-content);font-weight:700;margin-bottom:4px;}
.explain-block .body{font-size:14px;line-height:1.6;color:var(--neutral-content);}
.explain-review{border-top:1px solid var(--gray-200);padding-top:10px;font-size:13px;line-height:1.6;color:var(--notice-color-1100);}
.explain-src{margin-top:10px;font-size:11.5px;color:var(--gray-500);}

/* ============================================================
   练习 / 考试 作答布局（手机：单列；电脑：左导航 + 右题区）
   ============================================================ */
.doing{display:flex;flex-direction:column;min-height:0;}
.doing-nav{display:none;}
.doing-main{flex:1;min-width:0;display:flex;flex-direction:column;min-height:0;background:var(--background-base);}
.doing-top{flex:none;padding:10px 12px 11px;border-bottom:1px solid var(--gray-200);background:var(--background-base);}
.doing-top-row{display:flex;align-items:center;gap:8px;}
.icon-btn{
  display:flex;align-items:center;justify-content:center;width:32px;height:32px;
  border-radius:9px;border:none;background:var(--gray-100);cursor:pointer;
}
.icon-btn.ghost{background:none;}
.src-chip{font-size:12px;font-weight:700;color:var(--neutral-subdued-content);background:var(--gray-100);padding:4px 10px;border-radius:9999px;}
.counter{font-size:14px;font-weight:800;color:var(--neutral-content);}
.counter .sep{color:var(--gray-500);font-weight:600;}
.progress{height:6px;border-radius:9999px;background:var(--gray-200);overflow:hidden;margin-top:9px;}
.progress > i{display:block;height:100%;border-radius:9999px;background:var(--accent-background);transition:width .25s;}
.prog-inline{flex:1;margin-top:0;}
.wfull-mobile{width:100%;}
.list-stack{display:flex;flex-direction:column;gap:12px;margin-top:14px;}
.doing-scroll{flex:1;min-height:0;overflow-y:auto;padding:15px 14px 18px;display:flex;flex-direction:column;gap:14px;}
.doing-foot{flex:none;border-top:1px solid var(--gray-200);background:var(--background-base);padding:11px 14px calc(14px + env(safe-area-inset-bottom));display:flex;gap:10px;}
.doing-foot .btn{height:46px;border-radius:13px;font-size:15px;}
.doing-foot .grow{flex:1;}
.doing-foot .grow-2{flex:1.4;}
.doing-foot .flagbtn{flex:none;width:54px;}

/* 网格题号导航（手机底部 sheet / 电脑左栏共用单元格样式） */
.grid{display:grid;gap:8px;}
.grid-cell{
  position:relative;width:100%;aspect-ratio:1/1;min-width:0;
  border-radius:9px;border:1.5px solid var(--gray-300);background:var(--background-base);
  color:var(--neutral-subdued-content);font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .12s;
}
.grid-cell .flag-dot{position:absolute;top:2px;right:2px;width:6px;height:6px;border-radius:50%;background:var(--notice-color-700);}
.grid-cell.answered{background:color-mix(in srgb,var(--accent-background) 14%,var(--background-base));border-color:var(--accent-background);color:var(--accent-content);}
.grid-cell.correct{border-color:var(--positive-color-700);color:var(--positive-color-700);background:color-mix(in srgb,var(--positive-color-500) 15%,var(--background-base));}
.grid-cell.wrong{border-color:var(--negative-color-700);color:var(--negative-color-1000);background:color-mix(in srgb,var(--negative-color-500) 12%,var(--background-base));}
.grid-cell.review{border-color:var(--notice-color-700);color:var(--notice-color-1100);background:color-mix(in srgb,var(--notice-color-500) 15%,var(--background-base));}
.grid-cell.current{background:var(--accent-background);border-color:var(--accent-background);color:#fff;box-shadow:0 3px 9px -3px var(--accent-background);}

/* 考试运行顶部（手机）：计时 + 答题卡 + 交卷 */
.exam-top-row{display:flex;align-items:center;gap:8px;}
.timer-pill{display:flex;align-items:center;gap:5px;padding:5px 11px;border-radius:9999px;background:var(--gray-100);}
.timer-label{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--neutral-content);}
.timer-label.low{color:var(--negative-content);}
.card-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:9999px;border:1px solid var(--gray-300);background:var(--background-base);cursor:pointer;font-size:13px;font-weight:700;color:var(--neutral-content);}
.submit-pill{margin-left:auto;padding:8px 16px;border-radius:9999px;border:none;background:var(--accent-background);color:#fff;font-size:14px;font-weight:800;cursor:pointer;}
.exam-answered{margin-top:9px;display:flex;align-items:center;gap:8px;}
.exam-answered .lbl{font-size:11.5px;font-weight:600;color:var(--neutral-subdued-content);white-space:nowrap;}
.exam-answered .bar{flex:1;height:5px;border-radius:9999px;background:var(--gray-200);overflow:hidden;}
.exam-answered .bar > i{display:block;height:100%;border-radius:9999px;background:var(--accent-background);transition:width 1s linear;}
.exam-answered .bar > i.low{background:var(--negative-background);}

/* 手机底部答题卡 sheet */
.sheet-mask{position:fixed;inset:0;z-index:40;background:rgba(8,12,28,.42);display:flex;flex-direction:column;justify-content:flex-end;}
.sheet{background:var(--background-base);border-radius:22px 22px 0 0;padding:16px 16px calc(22px + env(safe-area-inset-bottom));animation:slideUp .26s cubic-bezier(.32,.72,0,1);max-height:74vh;display:flex;flex-direction:column;}
.sheet-head{display:flex;align-items:center;margin-bottom:12px;}
.sheet-head .title{font-size:16px;font-weight:800;color:var(--heading-color);}
.sheet-head .sub{margin-left:8px;font-size:12px;color:var(--neutral-subdued-content);}
.sheet-head .close{margin-left:auto;font-size:13px;font-weight:700;color:var(--accent-content);background:none;border:none;cursor:pointer;}
.sheet .grid{overflow-y:auto;grid-template-columns:repeat(6,1fr);}

/* ============================================================
   首页 / 概览
   ============================================================ */
.home-ring-card{display:flex;gap:16px;align-items:center;padding:17px;border-radius:18px;box-shadow:var(--shadow-emphasized);}
.ring{position:relative;flex:none;border-radius:50%;}
.ring .hole{position:absolute;border-radius:50%;background:var(--background-base);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.ring .hole .big{font-weight:800;color:var(--heading-color);line-height:1;}
.ring .hole .sm{font-size:10px;color:var(--neutral-subdued-content);margin-top:3px;}
.home-ring-stats{flex:1;min-width:0;}
.home-ring-stats .lead{display:flex;align-items:baseline;gap:7px;}
.home-ring-stats .lead .n{font-size:27px;font-weight:800;color:var(--heading-color);line-height:1;}
.home-ring-stats .lead .d{font-size:13px;color:var(--neutral-subdued-content);}
.mini-stats{display:flex;gap:16px;margin-top:13px;}
.mini-stats .m .v{font-size:18px;font-weight:800;line-height:1;}
.mini-stats .m .l{font-size:11px;color:var(--neutral-subdued-content);margin-top:3px;}
.home-cta{display:flex;gap:12px;}
.cta{flex:1;display:flex;flex-direction:column;gap:9px;padding:16px;border-radius:16px;cursor:pointer;text-align:left;border:1px solid var(--gray-300);background:var(--background-base);color:var(--neutral-content);}
.cta.primary{border:none;background:var(--accent-background);color:#fff;box-shadow:0 8px 20px -8px var(--accent-background);}
.cta .t{display:block;font-size:16px;font-weight:800;}
.cta .s{display:block;font-size:11.5px;margin-top:2px;opacity:.85;}
.cta:not(.primary) .s{color:var(--neutral-subdued-content);opacity:1;}
.section-head{display:flex;align-items:center;justify-content:space-between;margin:2px 2px 9px;}
.section-head .t{font-size:12px;font-weight:700;color:var(--gray-600);letter-spacing:.04em;}
.section-head .more{font-size:12px;font-weight:600;color:var(--accent-content);background:none;border:none;cursor:pointer;padding:0;}
.cat-list{background:var(--background-base);border:1px solid var(--gray-200);border-radius:16px;overflow:hidden;}
.cat-row{display:flex;align-items:center;gap:11px;width:100%;padding:12px 14px;border:none;border-bottom:1px solid var(--gray-100);background:none;cursor:pointer;text-align:left;}
.cat-row:last-child{border-bottom:none;}
.cat-row .name{font-size:14px;font-weight:600;color:var(--neutral-content);width:74px;flex:none;}
.cat-row .track{flex:1;height:7px;border-radius:9999px;background:var(--gray-200);overflow:hidden;}
.cat-row .track > i{display:block;height:100%;border-radius:9999px;}
.cat-row .frac{font-size:12px;font-weight:700;color:var(--neutral-subdued-content);width:50px;text-align:right;flex:none;}
.home-quick{display:flex;gap:10px;}
.quick{flex:1;display:flex;flex-direction:column;gap:7px;align-items:flex-start;padding:14px;border:1px solid var(--gray-200);border-radius:14px;background:var(--background-base);cursor:pointer;}
.quick .t{font-size:13px;font-weight:700;color:var(--neutral-content);}

/* 概览统计卡（电脑用网格） */
.ov-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ov-card{padding:14px;border-radius:14px;background:var(--background-base);border:1px solid var(--gray-200);}
.ov-card .v{font-size:24px;font-weight:800;line-height:1;}
.ov-card .v .d{font-size:13px;color:var(--neutral-subdued-content);font-weight:600;}
.ov-card .l{font-size:12px;color:var(--neutral-subdued-content);margin-top:5px;}

/* ============================================================
   错题 / 收藏 / 列表卡片
   ============================================================ */
.list-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.list-head .titles{display:flex;align-items:baseline;gap:8px;}
.list-head .titles h1{font-size:22px;font-weight:800;color:var(--heading-color);margin:0;}
.list-head .titles .n{font-size:13px;color:var(--neutral-subdued-content);}
.list-head .pillbtn{display:inline-flex;align-items:center;height:34px;padding:0 15px;border:none;border-radius:9999px;background:var(--accent-background);color:#fff;font-size:13px;font-weight:700;cursor:pointer;}
.review-card{background:var(--background-base);border:1px solid var(--gray-200);border-radius:14px;padding:14px;}
.review-card .head{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:10px;}
.review-card .stem{font-size:15px;line-height:1.55;font-weight:600;color:var(--neutral-content);margin-bottom:11px;}
.review-card .yc{margin-top:9px;font-size:12.5px;color:var(--neutral-subdued-content);}
.review-card .yc .bad{color:var(--negative-content);font-weight:700;}
.review-card .yc .good{color:var(--positive-color-700);font-weight:700;}
.review-card .yc .neu{color:var(--neutral-content);font-weight:700;}
.review-card .expl{margin-top:8px;padding-top:8px;border-top:1px solid var(--gray-100);font-size:13px;line-height:1.6;color:var(--neutral-content);}
.review-card .expl b{color:var(--neutral-subdued-content);font-size:11px;}
.review-card .acts{display:flex;gap:8px;margin-top:12px;}
.review-card .acts .practice{flex:1;height:40px;border:none;border-radius:11px;background:color-mix(in srgb,var(--accent-background) 12%,var(--background-base));color:var(--accent-content);font-size:14px;font-weight:700;cursor:pointer;}
.review-card .acts .remove{flex:none;display:inline-flex;align-items:center;gap:5px;height:40px;padding:0 14px;border:1px solid var(--gray-300);border-radius:11px;background:var(--background-base);color:var(--neutral-subdued-content);font-size:13px;font-weight:600;cursor:pointer;}
.star-btn{width:30px;height:30px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-left:auto;}
.opt-ro-grid{display:flex;flex-direction:column;gap:7px;}
.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:50px 30px;text-align:center;min-height:50vh;}
.empty .t{font-size:15px;font-weight:700;color:var(--neutral-content);}
.empty .s{font-size:13px;color:var(--neutral-subdued-content);line-height:1.6;}

/* ============================================================
   成绩页
   ============================================================ */
.result-card{display:flex;flex-direction:column;align-items:center;gap:13px;padding:20px;border-radius:18px;box-shadow:var(--shadow-emphasized);}
.pass-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 14px;border-radius:9999px;font-size:14px;font-weight:800;}
.pass-chip.pass{background:var(--positive-color-200);color:var(--positive-color-1000);}
.pass-chip.fail{background:var(--negative-color-200);color:var(--negative-color-1000);}
.result-nums{display:flex;gap:20px;}
.result-nums .col{text-align:center;}
.result-nums .col .v{font-size:20px;font-weight:800;}
.result-nums .col .l{font-size:11px;color:var(--neutral-subdued-content);}
.result-time{font-size:12px;color:var(--neutral-subdued-content);}

/* ============================================================
   统计
   ============================================================ */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.radar-card{display:flex;flex-direction:column;align-items:center;padding:16px;}
.radar-card .h{align-self:flex-start;font-size:14px;font-weight:800;color:var(--heading-color);margin-bottom:6px;}
.cat-detail .h{font-size:14px;font-weight:800;color:var(--heading-color);margin-bottom:13px;}
.cat-detail .rows{display:flex;flex-direction:column;gap:13px;}
.cat-detail .row .top{display:flex;align-items:center;gap:7px;margin-bottom:6px;}
.cat-detail .row .dot{width:9px;height:9px;border-radius:50%;flex:none;}
.cat-detail .row .nm{font-size:13.5px;font-weight:600;color:var(--neutral-content);}
.cat-detail .row .lvl{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:9999px;font-size:11px;font-weight:700;color:#fff;}
.cat-detail .row .meta{margin-left:auto;font-size:12px;color:var(--neutral-subdued-content);}
.cat-detail .row .track{height:8px;border-radius:9999px;background:var(--gray-200);overflow:hidden;}
.cat-detail .row .track > i{display:block;height:100%;border-radius:9999px;}
.reset-btn{height:44px;border:1px solid var(--negative-color-300);border-radius:12px;background:var(--background-base);color:var(--negative-content);font-size:14px;font-weight:700;cursor:pointer;}

/* 载入提示 */
.splash{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--background-layer-1);}
.splash .logo{width:54px;height:54px;border-radius:15px;background:var(--accent-background);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px -8px var(--accent-background);}
.splash .row{display:flex;align-items:center;gap:11px;}
.splash .sp{width:18px;height:18px;border:2.5px solid var(--gray-300);border-top-color:var(--accent-background);border-radius:50%;animation:spin .7s linear infinite;display:block;}
.splash .tx{font-size:14px;font-weight:600;color:var(--neutral-subdued-content);}

/* ============================================================
   电脑布局 ≥1024px
   ============================================================ */
@media (min-width:1024px){
  .brand-status{display:flex;}
  .brandbar-inner{padding:13px 28px;}

  .main{padding-bottom:0;background:var(--background-layer-1);}
  .tabbar{display:none;}

  .sidebar{
    display:flex;flex-direction:column;width:240px;flex:none;
    border-right:1px solid var(--gray-200);background:var(--background-base);
    padding:18px 12px;
  }
  .nav-list{display:flex;flex-direction:column;gap:3px;}
  .nav-item{
    display:flex;align-items:center;gap:11px;width:100%;padding:9px 11px;border-radius:10px;
    border:none;cursor:pointer;text-align:left;background:transparent;
    color:var(--neutral-content);font-weight:600;
  }
  .nav-item .label{font-size:14px;font-weight:600;}
  .nav-item .nav-spacer{flex:1;}
  .nav-item.on{color:var(--accent-content);background:color-mix(in srgb,var(--accent-background) 12%,transparent);font-weight:700;}
  .nav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:9999px;font-size:11px;font-weight:700;color:#fff;}
  .nav-badge.wrong{background:var(--negative-background);}
  .nav-badge.fav{background:var(--notice-background);}
  .sidebar-foot{margin-top:auto;border-top:1px solid var(--gray-200);padding-top:13px;display:flex;flex-direction:column;gap:9px;}
  .sidebar-note{display:flex;align-items:center;gap:8px;padding:0 8px;font-size:11.5px;color:var(--neutral-subdued-content);font-weight:600;}
  .sidebar-note i{width:7px;height:7px;border-radius:50%;background:var(--positive-color-700);flex:none;}
  .sidebar-reset{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:9px;border:none;background:none;cursor:pointer;color:var(--neutral-subdued-content);font-size:13px;font-weight:600;}

  .page{max-width:1000px;padding:30px 36px 44px;gap:22px;}
  .page-head h1{font-size:28px;}

  /* 概览：横向卡片网格 */
  .ov-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;}
  .ov-card{padding:20px;border-radius:16px;}
  .ov-card .v{font-size:30px;}
  .home-grid{display:flex;gap:20px;flex-wrap:wrap;}
  .home-grid .col-main{flex:2;min-width:340px;}
  .home-grid .col-side{flex:1;min-width:240px;}

  /* 作答：左导航 + 右题区 */
  .doing{flex-direction:row;height:calc(100vh - 64px);}
  .doing-nav{
    display:flex;flex-direction:column;width:250px;flex:none;min-height:0;
    border-right:1px solid var(--gray-200);background:var(--background-base);
  }
  .doing-nav.wide{width:266px;}
  .doing-nav .nav-top{padding:16px 16px 12px;border-bottom:1px solid var(--gray-200);}
  .doing-nav .nav-body{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;}
  .doing-nav .nav-foot{border-top:1px solid var(--gray-200);padding:12px 16px;}
  .doing-nav .grid{grid-template-columns:repeat(5,1fr);}
  .exam-nav .grid{grid-template-columns:repeat(6,1fr);}
  .nav-exit{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;color:var(--neutral-subdued-content);font-size:13px;font-weight:600;padding:0;}
  .nav-source{margin-top:12px;font-size:13px;font-weight:700;color:var(--accent-content);}
  .nav-progress{margin-top:2px;font-size:13px;color:var(--neutral-subdued-content);}
  .legend{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:11.5px;color:var(--neutral-subdued-content);}
  .legend i{display:inline-block;width:12px;height:12px;border-radius:4px;border:1.5px solid var(--gray-300);}
  .legend i.ok{background:color-mix(in srgb,var(--positive-color-500) 15%,var(--background-base));border-color:var(--positive-color-700);}
  .legend i.no{background:color-mix(in srgb,var(--negative-color-500) 12%,var(--background-base));border-color:var(--negative-color-700);}
  .exam-clock-lg{font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
  .exam-clock-lg.low{color:var(--negative-content);}

  .doing-main{min-height:0;}
  .doing-top{padding:14px 28px 12px;}
  .doing-top-row{gap:14px;}
  .doing-scroll{padding:24px 28px;}
  .doing-scroll .inner{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:18px;}
  .q-stem{font-size:20px;font-weight:700;}
  .doing-foot{padding:14px 28px;justify-content:space-between;}
  .doing-foot .btn{height:44px;border-radius:9999px;}
  .doing-foot .grow,.doing-foot .grow-2{flex:none;}
  .doing-foot.exam-foot{justify-content:flex-start;}
  .doing-foot.exam-foot .next{margin-left:auto;}
  .doing-foot .flagbtn{width:auto;padding:0 18px;}
  .wfull-mobile{width:auto;}
  .opt-rogrid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}

  /* 错题/收藏卡片在电脑上的操作排布 */
  .review-card .head .acts-inline{margin-left:auto;display:flex;gap:6px;}
  .fav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:14px;align-items:start;}

  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
  .stats-cols{display:flex;gap:20px;flex-wrap:wrap;}
  .stats-cols .radar-card{flex:1;min-width:320px;border-radius:16px;}
  .stats-cols .cat-detail{flex:1.3;min-width:360px;}

  .hide-desktop{display:none !important;}
}

/* 仅手机显示的元素，在电脑端隐藏 */
@media (max-width:1023px){
  .hide-mobile{display:none !important;}
}