* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;
  background:#f5f7fa; color:#0f172a; font-size:14px; }
header { display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 22px; background:#fff; border-bottom:1px solid #e6ebf2; position:sticky; top:0; z-index:20; }
.brand { font-size:18px; font-weight:700; }
.who { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.childtag { background:#eff6ff; color:#1d4ed8; border-radius:999px; padding:3px 12px; font-weight:600; font-size:13px; }

.tabs { display:flex; gap:6px; padding:12px 22px 0; flex-wrap:wrap; }
.tabs button { border:1px solid #e2e8f0; background:#fff; padding:8px 16px; border-radius:9px 9px 0 0;
  cursor:pointer; font-size:14px; color:#475569; border-bottom:none; }
.tabs button.on { background:#1d4ed8; border-color:#1d4ed8; color:#fff; font-weight:600; }

main { padding:0 26px 70px; max-width:1440px; }
section { padding-top:14px; }
.card { background:#fff; border:1px solid #e6ebf2; border-radius:12px; padding:16px 18px; margin-bottom:14px; }
.card h2 { font-size:16px; margin:0 0 10px; }
.cardhead { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.cardhead h2 { margin:0; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:10px 0; }
.hint { font-size:12.5px; color:#64748b; line-height:1.8; }
.msg { font-size:13px; color:#16a34a; }

input, select { border:1px solid #dbe2ec; border-radius:8px; padding:8px 10px; font-size:14px;
  background:#fff; color:#0f172a; font-family:inherit; }
input[type=text], input:not([type]), #paperTitle, #obName, #obCity { min-width:240px; }
label { display:block; font-size:13px; color:#334155; font-weight:600; margin:16px 0 7px; }
button { border:1px solid #dbe2ec; background:#fff; border-radius:8px; padding:8px 14px; cursor:pointer;
  font-size:14px; color:#334155; font-family:inherit; }
button:hover { background:#f8fafc; }
button.primary { background:#1d4ed8; border-color:#1d4ed8; color:#fff; font-weight:600; }
button.primary:hover { background:#1740b5; }
button.ghost { color:#1d4ed8; border-color:#c7d5f5; }
button.mini { padding:4px 10px; font-size:12.5px; }
button:disabled { opacity:.5; cursor:not-allowed; }

.progress { margin-top:10px; background:#eef2f7; border-radius:8px; padding:10px 12px; font-size:13px; color:#334155; }
.progress .bar { height:6px; background:#dbe2ec; border-radius:4px; overflow:hidden; margin-top:8px; }
.progress .bar > i { display:block; height:100%; background:#1d4ed8; width:0%; transition:width .4s; }

.list { display:flex; flex-direction:column; gap:10px; }
.item { border:1px solid #e9eef5; border-radius:10px; padding:12px 14px; }
.item .top { display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; }
.item .stem { line-height:1.9; margin:8px 0 6px; }
.meta { font-size:12.5px; color:#64748b; }
.badge { display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; background:#eef2f7; color:#475569; margin-right:6px; }
.badge.warn { background:#fef2f2; color:#b91c1c; }
.badge.ok { background:#f0fdf4; color:#15803d; }
.badge.blue { background:#eff6ff; color:#1d4ed8; }
.overview { line-height:1.9; font-size:14px; }

.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(175px,1fr)); gap:9px; }
.tile { border-radius:10px; padding:11px 13px; color:#fff; }
.tile .nm { font-size:12.5px; font-weight:600; line-height:1.35; }
.tile .pc { font-size:20px; font-weight:700; margin-top:5px; }
.tile .sm { font-size:11px; opacity:.88; margin-top:2px; }
.tile.untested { color:#94a3b8; border:1px dashed #cbd5e1; background:#fff; }
.tile.notlearned { color:#a8b3c2; border:1px dashed #e2e8f0; background:#fbfcfe; }
.legend { font-size:12px; color:#64748b; margin-top:10px; }
table { width:100%; border-collapse:collapse; font-size:13.5px; }
th { background:#f1f5f9; text-align:left; padding:9px 11px; font-size:12.5px; color:#475569; font-weight:600; }
td { padding:8px 11px; border-top:1px solid #eef2f7; vertical-align:middle; }
.pill { display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; color:#fff; }
.empty { color:#94a3b8; font-size:13px; padding:10px 0; }

/* ---- 首次登录引导 ---- */
#onboard[hidden] { display:none !important; }
#onboard { position:fixed; inset:0; z-index:200; background:rgba(15,23,42,.45);
  overflow:auto; padding:34px 16px 70px; }
.onboard-box { max-width:640px; margin:0 auto; }
.onboard-box h1 { font-size:20px; margin:0 0 6px; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.chips { display:flex; gap:8px; flex-wrap:wrap; }
.chip { border:1px solid #dbe2ec; background:#fff; border-radius:999px; padding:7px 16px; cursor:pointer;
  font-size:13.5px; color:#334155; user-select:none; }
.chip.on { background:#1d4ed8; border-color:#1d4ed8; color:#fff; font-weight:600; }
/* 省份：用药丸而不用原生 <select>，手机上才点得开 */
.prov { display:flex; flex-wrap:wrap; gap:7px; }
.prov .chip { min-width:70px; text-align:center; padding:8px 10px; }

/* ---- 上传照片暂存区 ---- */
.hiddenfile { position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; }
.btnfile { display:inline-flex; align-items:center; border:1px solid #c7d5f5; color:#1d4ed8;
  background:#fff; border-radius:8px; padding:9px 16px; font-size:14px; cursor:pointer; white-space:nowrap; }
.btnfile:active { background:#f0f6ff; }
.filelist { display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:9px; margin-top:12px; }
.fitem { border:1px solid #e6ebf2; border-radius:10px; overflow:hidden; background:#fff; }
.fitem img { display:block; width:100%; height:100px; object-fit:cover; background:#f1f5f9; }
.fmeta { padding:7px 9px 2px; font-size:12.5px; color:#334155; display:flex; flex-direction:column; gap:2px; }
.fbtns { display:flex; gap:5px; padding:7px 9px 9px; }
.mods { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:6px;
  max-height:250px; overflow:auto; border:1px solid #e6ebf2; border-radius:10px; padding:10px; background:#fbfcfe; }
.mod { display:flex; gap:7px; align-items:flex-start; font-size:13px; color:#334155; cursor:pointer; padding:3px 2px; }
.mod input { margin-top:3px; }

/* ---- 画框核对 ---- */
.pageTabs { display:flex; gap:6px; flex-wrap:wrap; }
.stage { display:grid; grid-template-columns:minmax(0,1fr) 430px; gap:16px; align-items:start; }
.stage-img { position:relative; background:#fff; border:1px solid #e6ebf2; border-radius:12px; overflow:hidden; }
.stage-img img { display:block; width:100%; height:auto; }
#boxLayer { position:absolute; inset:0; }
.box { position:absolute; border:2px solid #16a34a; border-radius:4px; background:rgba(22,163,74,.07);
  cursor:pointer; transition:background .12s, border-color .12s; }
.box:hover { background:rgba(22,163,74,.16); }
.box.wrong { border-color:#dc2626; background:rgba(220,38,38,.09); }
.box.wrong:hover { background:rgba(220,38,38,.18); }
.box.sel { box-shadow:0 0 0 3px rgba(29,78,216,.35); }
.box .no { position:absolute; left:0; top:0; background:#16a34a; color:#fff; opacity:.95;
  font-size:11px; font-weight:700; line-height:1; padding:3px 7px; border-radius:0 0 5px 0; pointer-events:none; }
.box.wrong .no { background:#dc2626; }
.box .gear { position:absolute; right:0; top:0; background:#0f172a; color:#fff; opacity:.9;
  border:none; border-radius:0 0 0 5px; font-size:11px; line-height:1; padding:3px 7px; cursor:pointer; }
.box .gear:hover { background:#334155; opacity:1; }
.box:hover { z-index:5; } .box.sel { z-index:6; }
.side { background:#fff; border:1px solid #e6ebf2; border-radius:12px; padding:14px 16px; position:sticky; top:70px; }
.side h3 { font-size:14px; margin:0 0 8px; }
.side .stem { line-height:1.9; font-size:13.5px; margin:8px 0; max-height:220px; overflow:auto; }
.side .lbl { font-size:12.5px; color:#64748b; margin:12px 0 4px; }
@media (max-width:1180px) { .stage { grid-template-columns:1fr; } .side { position:static; } }
.chip.off { background:#f1f5f9; border-color:#e2e8f0; color:#cbd5e1; cursor:not-allowed;
  text-decoration:line-through; text-decoration-color:#e2e8f0; }
.chip.off:hover { background:#f1f5f9; }
.chip .soon { font-size:10.5px; opacity:.85; margin-left:4px; text-decoration:none; display:inline-block; }

.subjectsel { border:1px solid #c7d5f5; background:#f4f7ff; color:#1d4ed8; font-weight:600;
  border-radius:8px; padding:6px 10px; font-size:13.5px; }
.subjectsel:disabled { opacity:.5; }
.chip.soon { font-size:10.5px; opacity:.85; margin-left:4px; }
.chip.off { background:#f1f5f9; border-color:#e2e8f0; color:#cbd5e1; cursor:not-allowed; text-decoration:line-through; }

body.modal-open { overflow:hidden; }

/* 顶部提示条 */
.banner { position:fixed; top:14px; left:50%; transform:translateX(-50%); z-index:400;
  max-width:min(680px, 92vw); padding:11px 16px; border-radius:10px; font-size:14px; line-height:1.7;
  box-shadow:0 6px 20px rgba(15,23,42,.18); display:flex; gap:12px; align-items:flex-start; }
.banner.ok   { background:#f0fdf4; border:1px solid #86efac; color:#14532d; }
.banner.err  { background:#fef2f2; border:1px solid #fca5a5; color:#7f1d1d; }
.banner.info { background:#eff6ff; border:1px solid #bfdbfe; color:#1e3a8a; }
.banner b { font-weight:700; }
.banner .x { cursor:pointer; opacity:.6; margin-left:auto; font-size:16px; line-height:1; }
.warnmsg { font-size:13px; color:#d97706; font-weight:600; margin-left:6px; }

/* 页码按钮的选中态 */
.ptab.on { background:#1d4ed8 !important; border-color:#1d4ed8 !important; color:#fff !important; font-weight:600; }
.ptab { min-width:74px; }
.side { font-size:13.5px; }
.side .chip { padding:6px 13px; font-size:13px; }

.progressmeta { display:flex; justify-content:flex-start; align-items:baseline;
  gap:18px; font-size:12.5px; color:#64748b; margin-top:9px; }
.progressmeta .pct { font-size:15px; font-weight:700; color:#1d4ed8; }
.progresswrap .pmsg { font-size:13.5px; color:#334155; }
.badge.partial { background:#fff7ed; color:#c2410c; }

/* 悬浮进度面板：不管在哪个页签都看得见 */
.jobfloat { position:fixed; top:74px; right:18px; width:min(380px, 92vw); z-index:360;
  background:#fff; border:1px solid #dbe2ec; border-radius:12px; padding:14px 16px 15px;
  box-shadow:0 12px 32px rgba(15,23,42,.20); }
.jobfloat .jfhead { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:2px; }
.jobfloat .jfhead b { font-size:13.5px; color:#0f172a; }
.jobfloat .x { cursor:pointer; color:#94a3b8; font-size:16px; line-height:1; }
.jobfloat .pmsg { font-size:13px; color:#334155; margin-top:6px; }

button.danger { color:#b91c1c; border-color:#fecaca; }
button.danger:hover { background:#fef2f2; }

/* 考点明细下钻 */
details.drill { border:1px solid #eef2f7; border-radius:9px; margin:6px 0; padding:2px 10px 4px; background:#fff; }
details.drill.lv2 { margin:6px 0 6px 18px; background:#fbfcfe; }
details.drill > summary { cursor:pointer; padding:8px 2px; font-size:13.5px; list-style:none; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
details.drill > summary::-webkit-details-marker { display:none; }
details.drill > summary::before { content:'▸'; color:#94a3b8; font-size:12px; }
details.drill[open] > summary::before { content:'▾'; }
details.drill .meta { font-size:12px; color:#64748b; }
details.drill table { font-size:13px; margin-bottom:6px; }

.trendsvg { width:100%; height:auto; display:block; }
.lbl { font-size:13px; color:#475569; font-weight:600; margin:14px 0 6px; }

.alertbox { display:flex; flex-direction:column; gap:3px; padding:11px 14px; border-radius:9px; margin:8px 0;
  border:1px solid #e6ebf2; background:#fbfcfe; font-size:13.5px; }
.alertbox.ok   { background:#f0fdf4; border-color:#bbf7d0; }
.alertbox.err  { background:#fef2f2; border-color:#fecaca; }
.alertbox.warn { background:#fffbeb; border-color:#fde68a; }
.alertbox.info { background:#eff6ff; border-color:#bfdbfe; }
.alertbox .meta { color:#64748b; font-size:12.5px; }