/* MEM exam studio theme: paper, margin notes, focused practice. */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Noto+Serif+SC:wght@600;700&display=swap");

:root {
  --t: #1f2430 !important;
  --d: #6f7582 !important;
  --l: #ece3d4 !important;
  --bg: #f7f1e6 !important;
  --bd: #dacdb8 !important;
  --ac: #2457a6 !important;
  --ok: #238456 !important;
  --no: #bd3e35 !important;
  --card: #fffaf0 !important;
  --paper-shadow: 0 18px 42px rgba(70, 52, 25, .12);
}

html,
body {
  background:
    linear-gradient(90deg, rgba(189, 62, 53, .08) 1px, transparent 1px) 72px 0 / 1px 100% no-repeat,
    linear-gradient(rgba(36, 87, 166, .05) 1px, transparent 1px) 0 0 / 100% 32px,
    radial-gradient(circle at 12% 8%, rgba(36, 87, 166, .1), transparent 24%),
    var(--bg) !important;
  color: var(--t) !important;
  font-family: "IBM Plex Sans", "Microsoft YaHei", -apple-system, sans-serif !important;
}

.hero {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 46px 24px 18px !important;
  text-align: left !important;
}

.hero h1 {
  color: var(--t) !important;
  font-family: "Noto Serif SC", "Songti SC", serif !important;
  font-size: clamp(34px, 5vw, 58px) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

.hero p,
.ft,
.pass-card span,
.plan-card p,
.plan-card li,
.subject-card p,
.weak-item p,
.note-bd,
.paper-head p,
.year-card span,
.paper-meta,
.q-num {
  color: var(--d) !important;
}

.stats-bar {
  justify-content: flex-start !important;
  gap: 24px !important;
}

.stat .num {
  color: var(--ac) !important;
  font-variant-numeric: tabular-nums;
}

.pass-grid,
.modebar,
.tabs,
.wrap {
  max-width: 1120px !important;
}

.pass-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  padding: 0 24px !important;
  margin-top: 22px !important;
}

.pass-card,
.q-card,
.plan-card,
.subject-card,
.weak-item,
.note-section,
.year-card,
.paper-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .72), rgba(255, 250, 240, .92)),
    var(--card) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 14px !important;
  color: var(--t) !important;
  box-shadow: var(--paper-shadow) !important;
}

.pass-card b,
.plan-card h3,
.subject-card h3,
.weak-item h3,
.note-hd,
.paper-head h2,
.year-card b,
.q-text,
.paper-answer b {
  color: var(--t) !important;
}

.modebar,
.tabs {
  background: rgba(236, 227, 212, .74) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 999px !important;
  padding: 5px !important;
}

.mode,
.tab,
.chip {
  color: #6b665d !important;
  border-radius: 999px !important;
}

.mode.active,
.tab.active,
.chip.active,
.btn-primary {
  background: var(--ac) !important;
  border-color: var(--ac) !important;
  color: #fffaf0 !important;
  box-shadow: 0 12px 24px rgba(36, 87, 166, .2) !important;
}

.btn-ghost,
.q-tag,
.explain,
.q-raw,
.paper-answer,
.note-bd .formula {
  background: #f1e8da !important;
  border: 1px solid var(--bd) !important;
  color: var(--t) !important;
}

.opt {
  background: rgba(255, 250, 240, .82) !important;
  border: 1px solid var(--bd) !important;
  color: var(--t) !important;
}

.opt:hover {
  border-color: var(--ac) !important;
}

.opt .letter,
.exam-rule .badge {
  background: rgba(36, 87, 166, .1) !important;
  color: var(--ac) !important;
}

.opt.correct {
  border-color: var(--ok) !important;
  background: rgba(35, 132, 86, .08) !important;
}

.opt.correct .letter {
  background: var(--ok) !important;
  color: #fff !important;
}

.opt.wrong {
  border-color: var(--no) !important;
  background: rgba(189, 62, 53, .08) !important;
}

.opt.wrong .letter {
  background: var(--no) !important;
  color: #fff !important;
}

.mini-meter,
.pdf-frame {
  background: #eadfce !important;
  border-color: var(--bd) !important;
}

.mini-meter span {
  background: linear-gradient(90deg, var(--ac), #4b78bd) !important;
}

.notice {
  background: rgba(201, 124, 36, .1) !important;
  border-color: rgba(201, 124, 36, .24) !important;
  color: #765522 !important;
}

@media (max-width: 760px) {
  .hero {
    padding: 30px 18px 12px !important;
  }

  .pass-grid,
  .plan-grid,
  .subject-grid {
    grid-template-columns: 1fr !important;
  }

  .modebar,
  .tabs {
    justify-content: flex-start !important;
    overflow-x: auto;
    margin-left: 16px !important;
    margin-right: 16px !important;
    border-radius: 14px !important;
  }
}