:root {
  --bg: #f5f7fa; --card: #ffffff; --line: #e3e8ef; --text: #1f2937;
  --muted: #6b7280; --brand: #1a56db; --brand-dark: #1447b8; --ok: #059669; --warn: #d97706;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: "Microsoft YaHei", "PingFang SC", sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }

.topbar { display: flex; align-items: center; gap: 28px; padding: 0 28px; height: 58px; background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 50; }
.logo { font-size: 19px; font-weight: 700; color: var(--brand); white-space: nowrap; }
.topbar nav { display: flex; gap: 6px; flex: 1; justify-content: center; }
.topbar nav a { padding: 7px 14px; border-radius: 8px; font-size: 14.5px; color: var(--muted); }
.topbar nav a:hover { background: var(--bg); color: var(--text); }
.topbar nav a.active { background: #eaf0fe; color: var(--brand); font-weight: 600; }
.user-box { font-size: 14px; white-space: nowrap; }
.user-box .pts { color: var(--warn); font-weight: 700; margin-right: 12px; }
.user-box a.btn { margin-left: 8px; }

main { flex: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 26px 22px 50px; }
.foot { text-align: center; color: var(--muted); font-size: 12.5px; padding: 16px; border-top: 1px solid var(--line); background: #fff; }

.btn { display: inline-block; border: none; cursor: pointer; border-radius: 8px; padding: 8px 18px; font-size: 14px; background: var(--brand); color: #fff; transition: .15s; }
.btn:hover { background: var(--brand-dark); }
.btn.ghost { background: #fff; color: var(--brand); border: 1px solid var(--brand); }
.btn.gray { background: #eef1f5; color: var(--text); }
.btn.gray:hover { background: #e2e7ee; }
.btn.small { padding: 4px 12px; font-size: 13px; }
.btn.danger { background: #fee2e2; color: #b91c1c; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

/* 首页 */
.hero { background: linear-gradient(135deg, #1e3a8a 0%, #1a56db 60%, #3b82f6 100%); color: #fff; border-radius: 16px; padding: 52px 46px; margin-bottom: 26px; }
.hero h1 { font-size: 32px; margin-bottom: 14px; }
.hero p { opacity: .92; line-height: 1.8; max-width: 760px; }
.hero .acts { margin-top: 24px; display: flex; gap: 12px; }
.hero .acts .btn { background: #fff; color: var(--brand); font-weight: 600; padding: 11px 26px; }
.hero .acts .btn:hover { background: #eaf0fe; }

/* 导航下拉菜单（电路图库） */
.nav-drop { position: relative; }
.nav-drop .caret { font-size: 11px; opacity: .7; }
.nav-drop .drop-menu {
  display: none; position: absolute; top: 100%; left: 0; min-width: 158px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .13); padding: 6px; z-index: 60;
}
.nav-drop:hover .drop-menu, .nav-drop.open .drop-menu { display: block; }
.nav-drop .drop-menu a { display: block; padding: 9px 13px; border-radius: 7px; font-size: 14px; color: var(--text); }
.nav-drop .drop-menu a:hover { background: var(--bg); }
.nav-drop .drop-menu a.active { background: #eaf0fe; color: var(--brand); font-weight: 600; }
.nav-drop > a.active { background: #eaf0fe; color: var(--brand); font-weight: 600; }

/* 首页校园图片 */
.hero { display: flex; align-items: center; gap: 34px; }
.hero-text { flex: 1; min-width: 0; }
.hero-img {
  flex: 0 0 44%; max-width: 480px; border-radius: 14px; box-shadow: 0 12px 32px rgba(0, 0, 0, .25);
  border: 3px solid rgba(255, 255, 255, .55); object-fit: cover; aspect-ratio: 4 / 3;
}
.feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); gap: 16px; }
.feat { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 22px; }
.feat .ic { font-size: 26px; margin-bottom: 10px; }
.feat h3 { font-size: 16.5px; margin-bottom: 8px; }
.feat p { font-size: 13.5px; color: var(--muted); line-height: 1.7; }

/* 卡片与表单 */
.card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 24px; margin-bottom: 18px; }
.card h2 { font-size: 18px; margin-bottom: 14px; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 900px) { .grid2 { grid-template-columns: 1fr; } }
label.f { display: block; font-size: 13.5px; color: var(--muted); margin: 10px 0 4px; }
input[type=text], input[type=password], select { width: 100%; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; outline: none; background: #fff; }
input:focus, select:focus { border-color: var(--brand); }
.form-narrow { max-width: 420px; margin: 40px auto; }
.hint { font-size: 12.5px; color: var(--muted); margin-top: 8px; line-height: 1.6; }
.err { color: #dc2626; font-size: 13.5px; margin-top: 10px; }
.okmsg { color: var(--ok); font-size: 13.5px; margin-top: 10px; }

/* 图库 */
.cir-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 18px; }
.cir-card { background: var(--card); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.cir-card .prev { background: #fff; border-bottom: 1px solid var(--line); min-height: 210px; display: flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; }
.cir-card .prev svg { max-width: 100%; height: auto; }
.cir-card .info { padding: 14px 16px 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.cir-card h3 { font-size: 15.5px; }
.cir-card .desc { font-size: 12.5px; color: var(--muted); line-height: 1.6; flex: 1; }
.cir-card .row { display: flex; align-items: center; justify-content: space-between; }
.price { color: var(--warn); font-weight: 700; font-size: 13.5px; }

/* 编辑器 */
.ed-wrap { display: grid; grid-template-columns: 240px 1fr 250px; gap: 14px; align-items: start; }
@media (max-width: 1050px) { .ed-wrap { grid-template-columns: 1fr; } }
.palette { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pal-cat { font-size: 12px; color: var(--muted); font-weight: 600; margin: 10px 0 6px; border-bottom: 1px solid var(--line); padding-bottom: 3px; }
.pal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pal-item { background: #fff; border: 1.5px solid var(--line); border-radius: 10px; padding: 8px 4px 4px; text-align: center; cursor: pointer; font-size: 12px; color: var(--muted); transition: .12s; }
.pal-item:hover { border-color: var(--brand); }
.pal-item.on { border-color: var(--brand); background: #eaf0fe; color: var(--brand); font-weight: 600; }
.pal-item svg { width: 54px; height: 54px; }
.ed-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.ed-canvas { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.ed-canvas svg { display: block; width: 100%; height: auto; cursor: crosshair; }
.props .card { padding: 16px; }
.kv { font-size: 13px; color: var(--muted); margin: 6px 0; }
.mode-tip { font-size: 12.5px; color: var(--brand); background: #eaf0fe; border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; display: none; }

/* 表格 */
table.tb { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.tb th, table.tb td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); }
table.tb th { color: var(--muted); font-weight: 600; font-size: 12.5px; }
.plus { color: var(--ok); font-weight: 600; }
.minus { color: #dc2626; font-weight: 600; }
.pkg { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.pkg .card { margin: 0; text-align: center; }
.pkg .amount { font-size: 24px; font-weight: 800; color: var(--brand); margin: 8px 0; }
.pkg .amount small { font-size: 13px; color: var(--muted); font-weight: 400; }

.result-svg { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 10px; overflow-x: auto; }
.result-svg svg { max-width: 100%; height: auto; }
.spin-note { color: var(--muted); font-size: 13px; }

/* ================= 学考测试模块 ================= */
.exam-subjects { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin: 14px 0; }
.exam-subject h3 { margin: 0 0 6px; }
.exam-chapters { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.exam-chapter { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; text-decoration: none; color: inherit; background: var(--bg, #fff); transition: box-shadow .15s, transform .15s; }
.exam-chapter:hover { box-shadow: 0 4px 14px rgba(29,78,216,.15); transform: translateY(-1px); }

.exam-q { max-width: 860px; }
.exam-qhead { display: flex; justify-content: space-between; align-items: center; font-size: 14px; color: var(--muted); margin-bottom: 10px; gap: 8px; flex-wrap: wrap; }
.exam-timer { font-size: 20px; font-weight: 700; color: var(--brand); font-variant-numeric: tabular-nums; }
.exam-timer.is-danger { color: #dc2626; animation: blink 1s infinite; }
@keyframes blink { 50% { opacity: .4; } }
.exam-stem p { font-size: 17px; line-height: 1.7; margin: 6px 0; }
.exam-img { max-width: 100%; max-height: 300px; display: block; margin: 8px auto; border: 1px solid var(--line); border-radius: 8px; background: #fff; padding: 6px; }
.exam-opts { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
.exam-opt { text-align: left; padding: 11px 14px; border: 1.5px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; font-size: 15.5px; line-height: 1.5; transition: border-color .12s, background .12s; }
.exam-opt b { color: var(--brand); margin-right: 6px; }
.exam-opt:hover { border-color: var(--brand); }
.exam-opt.is-pick { border-color: var(--brand); background: #eff6ff; }
.exam-opt.is-right { border-color: #16a34a; background: #f0fdf4; }
.exam-opt.is-right b { color: #16a34a; }
.exam-opt.is-wrong { border-color: #dc2626; background: #fef2f2; }
.exam-opt.is-wrong b { color: #dc2626; }
.exam-opts.static { pointer-events: none; }
.exam-acts { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.exam-type { display: inline-block; font-size: 12px; padding: 1px 8px; border-radius: 99px; background: #eff6ff; color: var(--brand); margin-right: 4px; }

.exam-palette { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 12px; }
.exam-dot { width: 34px; height: 34px; border-radius: 8px; border: 1.5px solid var(--line); background: #fff; cursor: pointer; font-size: 13px; }
.exam-dot.is-done { background: #eff6ff; border-color: var(--brand); color: var(--brand); }
.exam-dot.is-cur { background: var(--brand); border-color: var(--brand); color: #fff; }

.exam-result { text-align: center; padding: 30px 20px; }
.exam-score { font-size: 64px; font-weight: 800; color: var(--brand); line-height: 1.1; }
.exam-score small { font-size: 20px; font-weight: 400; color: var(--muted); }
.exam-review { border-top: 1px dashed var(--line); padding: 14px 0; }
.exam-review.is-bad > p:first-child b:first-child { color: #dc2626; }
.errmsg { color: #dc2626; }
.okmsg { color: #16a34a; }

.exam-statcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin: 14px 0; text-align: center; }
.exam-stat { border: 1px solid var(--line); border-radius: 12px; padding: 14px 8px; font-size: 13px; color: var(--muted); }
.exam-stat .num { font-size: 30px; font-weight: 800; color: var(--brand); }
.exam-bar-row { display: grid; grid-template-columns: 150px 1fr 110px; align-items: center; gap: 10px; margin: 8px 0; font-size: 14px; }
.exam-bar { height: 14px; border-radius: 99px; background: #eef2f7; overflow: hidden; }
.exam-bar-fill { height: 100%; border-radius: 99px; }
.exam-bar-fill.is-good { background: #16a34a; }
.exam-bar-fill.is-mid { background: #f59e0b; }
.exam-bar-fill.is-low { background: #dc2626; }
.exam-bar-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ================= 手机适配 ================= */
@media (max-width: 760px) {
  .topbar { flex-wrap: wrap; padding: 10px 14px; height: auto; min-height: 58px; }
  .topbar nav { order: 3; flex: 0 0 100%; width: 100%; justify-content: flex-start; flex-wrap: wrap; overflow: visible; gap: 4px; padding-bottom: 4px; }
  .topbar nav a { white-space: nowrap; padding: 6px 10px; }
  main { padding: 12px; }
  .grid2 { grid-template-columns: 1fr; }
  .cir-grid { grid-template-columns: 1fr; }
  .pkg { grid-template-columns: 1fr 1fr; }
  .exam-stem p { font-size: 16px; }
  .exam-opt { padding: 13px 14px; font-size: 16px; }
  .exam-bar-row { grid-template-columns: 96px 1fr 84px; font-size: 13px; }
  .exam-dot { width: 30px; height: 30px; }
  .exam-acts .btn { flex: 1; }
  table.tb { font-size: 13px; display: block; overflow-x: auto; }
  .hero { flex-direction: column; padding: 30px 20px; gap: 18px; }
  .hero-img { flex: none; width: 100%; max-width: none; }
  /* 手机端：下拉菜单折叠为点击展开，避免平铺后挤掉后续菜单 */
  .nav-drop { display: block; position: relative; flex: 0 0 auto; }
  .nav-drop .drop-menu {
    display: none; position: absolute; left: 0; top: calc(100% + 4px); z-index: 60;
    min-width: 168px; background: #fff; border: 1px solid var(--line);
    border-radius: 10px; box-shadow: 0 12px 28px rgba(15, 23, 42, .16); padding: 6px;
  }
  .nav-drop.open .drop-menu { display: block; }
  /* 触屏没有真正的 hover，禁用悬停展开，避免点过一次后菜单卡住不收 */
  .nav-drop:hover .drop-menu { display: none; }
  .nav-drop.open .drop-menu, .nav-drop.open:hover .drop-menu { display: block; }
  .nav-drop .caret { display: inline; font-size: 10px; }
  .hero h1 { font-size: 22px; }
}

/* 学考题库：题干整图（英语图文理解等） */
.exam-block-img{display:block;width:auto;min-width:70%;max-width:100%;height:auto;max-height:85vh;margin:10px auto;border-radius:6px;border:1px solid var(--line,#e5e7eb)}

/* ---------- 职教动态 ---------- */
.news-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.news-tab{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border:1px solid var(--line);border-radius:99px;font-size:13px;color:#374151;background:#fff;text-decoration:none}
.news-tab:hover{border-color:var(--brand);color:var(--brand)}
.news-tab.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.news-tab span{font-size:11px;opacity:.75}
.news-row{display:flex;gap:14px;justify-content:space-between;align-items:flex-start;padding:14px 0;border-bottom:1px dashed var(--line);text-decoration:none;color:inherit}
.news-row:last-child{border-bottom:0}
.news-row:hover h3{color:var(--brand)}
.news-row-main h3{margin:0 0 6px;font-size:16px;font-weight:600}
.news-row-main p{margin:0;font-size:13px;color:#6b7280;line-height:1.6}
.news-row-side{flex:none;text-align:right;font-size:12px;color:#9ca3af;display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.news-cat{background:#eff6ff;color:var(--brand);padding:1px 8px;border-radius:99px;font-size:12px}
.news-detail h1{font-size:24px;line-height:1.45;margin:6px 0 8px}
.news-crumb{margin:0;font-size:13px;color:#9ca3af}
.news-crumb a{color:#6b7280;text-decoration:none}
.news-meta{margin:0 0 16px;font-size:13px;color:#9ca3af}
.news-body{font-size:15px;line-height:1.9;color:#1f2937;word-break:break-word}
.news-body p{margin:0 0 14px;text-indent:2em}
.news-body h2{font-size:19px;margin:22px 0 10px;line-height:1.5;color:#111827}
.news-body h3{font-size:17px;margin:18px 0 8px;line-height:1.5;color:#1f2937}
.news-body img{display:block;max-width:100%;height:auto;margin:12px auto;border-radius:8px}
.news-body ul,.news-body ol{margin:0 0 14px;padding-left:1.8em}
.news-body li{margin:4px 0;line-height:1.85}
.news-body blockquote{margin:12px 0;padding:8px 14px;border-left:3px solid var(--brand);background:#f8fafc;color:#4b5563}
.news-body blockquote p{text-indent:0;margin:0}
.news-body a{color:var(--brand);text-decoration:underline}
.news-body table{border-collapse:collapse;width:100%;margin:12px 0}
.news-body td,.news-body th{border:1px solid var(--line);padding:6px 8px;font-size:14px}

/* ---------- 后台富文本编辑器 ---------- */
.rte-wrap{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.rte-bar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 8px;background:#f8fafc;border-bottom:1px solid var(--line)}
.rte-bar button,.rte-bar select,.rte-bar .rte-img{
  font-size:13px;line-height:1;padding:6px 9px;border:1px solid var(--line);border-radius:7px;
  background:#fff;color:#374151;cursor:pointer;font-family:inherit}
.rte-bar button:hover,.rte-bar select:hover,.rte-bar .rte-img:hover{border-color:var(--brand);color:var(--brand)}
.rte-bar input[type=color]{width:30px;height:28px;padding:0;border:1px solid var(--line);border-radius:7px;background:#fff;cursor:pointer}
.rte{min-height:260px;max-height:60vh;overflow:auto;padding:12px 14px;font-size:15px;line-height:1.85;color:#1f2937;outline:none}
.rte:empty:before{content:'在这里输入正文，可加粗、改字号颜色、插图片…';color:#9ca3af}
.rte img{max-width:100%;height:auto;border-radius:6px}
.rte blockquote{margin:10px 0;padding:8px 12px;border-left:3px solid var(--brand);background:#f8fafc;color:#4b5563}
@media (max-width: 760px){ .rte{min-height:200px} }
.news-nav{display:flex;justify-content:space-between;gap:16px;margin-top:24px;padding-top:14px;border-top:1px solid var(--line);font-size:14px}
.news-nav a{color:var(--brand);text-decoration:none}

/* ---------- 试题解析与纠错 ---------- */
.exam-explain{margin:10px 0 4px;padding:10px 12px;background:#f8fafc;border-left:3px solid var(--brand);border-radius:4px;font-size:14px;line-height:1.75;color:#374151}
.exam-explain b{color:var(--brand)}
.exam-report{margin:6px 0 0;font-size:12px}
.report-link{color:#9ca3af;text-decoration:none}
.report-link:hover{color:var(--brand);text-decoration:underline}

/* ---------- 组卷导出 ---------- */
.pp-chaps{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px;max-height:230px;overflow:auto;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff}
.pp-chaps label{display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
.pp-chaps small{color:#9ca3af}
.pp-types{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;margin:4px 0}
.pp-types label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}