/* =========================================================
   Morandi Theme Override — 学理 Xueli
   Drop-in stylesheet that reskins the ICETEA pages.
   Loaded AFTER each page's own <style> so it wins on specificity.
   ========================================================= */

:root {
  --mo-paper:   #F4EFE6;
  --mo-paper-2: #ECE5D8;
  --mo-paper-3: #E0D8C7;
  --mo-paper-0: #FAF6EE;
  --mo-border:  #D9D1C2;
  --mo-divider: #CDC3B0;
  --mo-ink:     #2C2822;
  --mo-ink-2:   #4A4338;
  --mo-ink-3:   #6B6459;
  --mo-ink-4:   #8A8275;
  --mo-clay:    #A89B82;
  --mo-clay-d:  #8D8068;
  --mo-clay-l:  #F1E9DD;
  --mo-sage:    #8FA68E;
  --mo-blue:    #8B9AAA;
  --mo-ochre:   #C9A66B;
  --mo-rose:    #C69A95;
  --mo-mauve:   #A897A6;
  --mo-terra:   #B87A6A;
  --mo-focus:   #B89B5A;
}

/* ---------- Base reset ---------- */
html {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
html, body {
  background: var(--mo-paper) !important;
  color: var(--mo-ink) !important;
  font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
body { background-image: none !important; }

/* Kill all rainbow gradients on headings */
h1, h2, h3, h4, .signature, .card .code, .card-code, .code,
.hero h1, .sidebar-title, .brand h1 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: initial !important;
  color: var(--mo-ink) !important;
  font-family: 'Fraunces', 'Noto Serif SC', serif !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}
.signature, .hero .signature, .sidebar-signature {
  color: var(--mo-clay) !important;
  font-family: 'Fraunces', serif !important;
  font-style: italic !important;
  letter-spacing: 0.06em !important;
  font-weight: 400 !important;
  font-size: 12px !important;
}

/* Subtitles / muted */
.subtitle, .hero .subtitle, .sidebar-subtitle,
.welcome-sub, .topbar-progress, .card-name, .card .name, .card .desc, .card-desc,
aside h3, .brand p, .loading, .nav-part-label, .bottom-info .tip {
  color: var(--mo-ink-3) !important;
}

/* ---------- Cards ---------- */
.card, .course-card, .placeholder-card,
aside, section.workspace, .tabs, .chapter-view .placeholder-card,
.bottom-info .tip {
  background: var(--mo-paper-2) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--mo-border) !important;
  box-shadow: none !important;
}
.card:hover, .course-card:hover {
  background: var(--mo-paper-3) !important;
  border-color: var(--mo-clay) !important;
  box-shadow: 0 10px 28px -14px rgba(44,40,34,0.25) !important;
  transform: translateY(-2px) !important;
}
.card::before, .course-card::before { display: none !important; }

/* Per-card accent (overrides CSS vars set by the original) */
.card.comp, .course-card.cal1 { --accent: var(--mo-clay) !important; --accent-shadow: rgba(168,155,130,0.35) !important; --shadow: rgba(168,155,130,0.35) !important; }
.card.mast { --accent: var(--mo-sage) !important; --accent-shadow: rgba(143,166,142,0.35) !important; }
.card.econ { --accent: var(--mo-ochre) !important; --accent-shadow: rgba(201,166,107,0.35) !important; }
.card.fba  { --accent: var(--mo-rose) !important; --accent-shadow: rgba(198,154,149,0.35) !important; }
.card.macro { --accent: var(--mo-mauve) !important; --accent-shadow: rgba(168,151,166,0.35) !important; }
.card.micro { --accent: var(--mo-blue) !important; --accent-shadow: rgba(139,154,170,0.35) !important; }
.course-card.cal2 { --accent: var(--mo-blue) !important; --shadow: rgba(139,154,170,0.35) !important; }
.course-card.future { --accent: var(--mo-mauve) !important; --shadow: rgba(168,151,166,0.35) !important; }

.card .icon, .card-icon, .hero .icon { color: var(--accent, var(--mo-clay)) !important; opacity: 0.95; }
.card .code, .card-code { color: var(--accent, var(--mo-ink)) !important; font-family: 'Fraunces', serif !important; letter-spacing: 0.02em !important; }

/* Badges (right-top pills) */
.badge, .card-badge { 
  background: transparent !important;
  color: var(--mo-ink-4) !important;
  font-family: 'Fraunces', serif !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-size: 10px !important;
  padding: 2px 0 !important;
  border: 0 !important;
}
.badge.soon, .card-badge.soon { color: var(--mo-ink-4) !important; opacity: 0.7; }

/* ---------- Headers / nav ---------- */
header, .topbar { 
  background: var(--mo-paper) !important; 
  border-bottom: 1px solid var(--mo-border) !important; 
  color: var(--mo-ink) !important;
  backdrop-filter: none !important;
}
header a { color: var(--mo-clay-d) !important; }
.top-nav a.back, .sidebar-back, .back-link {
  color: var(--mo-ink-3) !important;
  border: 1px solid var(--mo-border) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  text-decoration: none !important;
  font-family: 'Fraunces', serif !important;
  letter-spacing: 0.04em !important;
  background: transparent !important;
  transition: all 120ms cubic-bezier(0.2,0.8,0.2,1) !important;
}
.top-nav a.back:hover, .sidebar-back:hover, .back-link:hover {
  color: var(--mo-ink) !important;
  border-color: var(--mo-clay) !important;
  background: var(--mo-paper-2) !important;
}

/* Language toggles */
#lang-toggle, .top-nav #lang-toggle, .lang-btn {
  background: transparent !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-3) !important;
  border-radius: 999px !important;
  font-family: 'Fraunces', serif !important;
  letter-spacing: 0.08em !important;
  padding: 5px 14px !important;
}
.lang-btn.active { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; }

/* ---------- Sidebar (mast-calculus2, practice) ---------- */
.sidebar, aside {
  background: var(--mo-paper-0) !important;
  border-right: 1px solid var(--mo-border) !important;
  border-color: var(--mo-border) !important;
}
.formulae-btn {
  background: var(--mo-clay-l) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-clay-d) !important;
}
.formulae-btn:hover { background: var(--mo-paper-3) !important; border-color: var(--mo-clay) !important; }
.nav-chapter { color: var(--mo-ink-3) !important; }
.nav-chapter:hover { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; }
.nav-chapter.active {
  background: var(--mo-clay-l) !important;
  color: var(--mo-clay-d) !important;
  border-left: 3px solid var(--mo-clay) !important;
}

/* Practice-page sidebar question buttons */
.qbtn {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
.qbtn:hover { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; }
.qbtn.active { background: var(--mo-clay) !important; color: var(--mo-paper-0) !important; border-color: var(--mo-clay) !important; }
.qbtn.done { border-left: 3px solid var(--mo-sage) !important; }
.paper-title { color: var(--mo-clay-d) !important; font-family: 'Fraunces', serif !important; }

/* ---------- Practice workspace ---------- */
.workspace, section.workspace { background: var(--mo-paper-2) !important; border: 1px solid var(--mo-border) !important; color: var(--mo-ink) !important; }
.qtitle { color: var(--mo-ink) !important; font-family: 'Fraunces', serif !important; font-weight: 500 !important; }
.marks { background: var(--mo-clay-l) !important; color: var(--mo-clay-d) !important; border: 1px solid var(--mo-border) !important; }
.qbody { 
  background: var(--mo-paper-0) !important; 
  border-left: 3px solid var(--mo-clay) !important; 
  color: var(--mo-ink) !important;
}
.qbody code { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; border: 1px solid var(--mo-border) !important; }
.examples {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}

/* Action buttons — Morandi-shifted */
button.action { 
  font-family: 'Inter', sans-serif !important; 
  font-weight: 500 !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}
.btn-run   { background: var(--mo-sage) !important; color: var(--mo-paper-0) !important; }
.btn-test  { background: var(--mo-clay) !important; color: var(--mo-paper-0) !important; }
.btn-hint  { background: var(--mo-ochre) !important; color: var(--mo-paper-0) !important; }
.btn-sol   { background: var(--mo-terra) !important; color: var(--mo-paper-0) !important; }
.btn-reset { background: var(--mo-paper-3) !important; color: var(--mo-ink-2) !important; border: 1px solid var(--mo-border) !important; }
.btn-refresh { background: var(--mo-blue) !important; color: var(--mo-paper-0) !important; }

/* Text inputs */
input, textarea.editor, .expr-row input {
  background: var(--mo-paper-0) !important;
  color: var(--mo-ink) !important;
  border: 1px solid var(--mo-border) !important;
  border-radius: 8px !important;
}
input:focus, textarea.editor:focus, .expr-row input:focus {
  border-color: var(--mo-focus) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(184,155,90,0.18) !important;
}
.expr-row label { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; border: 1px solid var(--mo-border) !important; }
.expr-row .mini-reset { background: var(--mo-paper-3) !important; color: var(--mo-ink-2) !important; }

/* Output / feedback */
.output { background: var(--mo-paper-0) !important; color: var(--mo-sage) !important; border: 1px solid var(--mo-border) !important; }
.output.err { color: var(--mo-terra) !important; }
.result-ok { color: var(--mo-sage) !important; }
.result-bad { color: var(--mo-terra) !important; }
.hint-box { background: #F6ECD6 !important; border-left: 3px solid var(--mo-ochre) !important; color: #7A612F !important; }
.hint-box code { background: #EDE0C4 !important; color: #5A4820 !important; padding: 1px 5px; border-radius: 3px; font-family: "SF Mono", Menlo, monospace; }
.hint-box b { color: #5A3E10 !important; }
.sol-box  { background: #F0DDD6 !important; border-left: 3px solid var(--mo-terra) !important; color: #8B4E3F !important; }
.sol-box code { background: #E8D0C8 !important; color: #6A3830 !important; padding: 1px 5px; border-radius: 3px; font-family: "SF Mono", Menlo, monospace; }
.sol-box b { color: #6A3020 !important; }
.sol-box pre { background: var(--mo-paper-0) !important; border: 1px solid var(--mo-border) !important; color: var(--mo-ink) !important; }

/* ---------- Login / auth ---------- */
.brand h1 { color: var(--mo-ink) !important; }
.tabs { background: var(--mo-paper-0) !important; border: 1px solid var(--mo-border) !important; padding: 3px !important; }
.tabs button { color: var(--mo-ink-3) !important; background: transparent !important; font-family: 'Inter', sans-serif !important; }
.tabs button.active { background: var(--mo-clay) !important; color: var(--mo-paper-0) !important; }
button.primary {
  background: var(--mo-clay) !important;
  color: var(--mo-paper-0) !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}
button.primary:hover { background: var(--mo-clay-d) !important; }
.msg.error { background: #F0DDD6 !important; color: #8B4E3F !important; }
.msg.success, .msg.ok { background: #E7EDE4 !important; color: #4F6550 !important; }

/* Scrollbars */
::-webkit-scrollbar-track { background: var(--mo-paper) !important; }
::-webkit-scrollbar-thumb { background: var(--mo-border) !important; border-radius: 5px !important; }
::-webkit-scrollbar-thumb:hover { background: var(--mo-clay) !important; }

/* Tab bars (chapter views) */
.tab-bar { border-bottom: 1px solid var(--mo-border) !important; }
.tab-btn { color: var(--mo-ink-3) !important; }
.tab-btn:hover { color: var(--mo-ink-2) !important; }
.tab-btn.active { color: var(--mo-clay-d) !important; border-bottom-color: var(--mo-clay) !important; }

/* Chapter headings inside notes view */
.chapter-header h1 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.chapter-header p { color: var(--mo-ink-3) !important; }
.welcome-title { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.welcome h2 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }

/* Tags */
.tag { 
  background: var(--mo-paper-2) !important; 
  color: var(--mo-ink-3) !important; 
  border: 1px solid var(--mo-border) !important;
  border-radius: 999px !important;
}

/* AI chat widget (chat-widget.js injects dark styles — full Morandi reskin) */
#ai-fab {
  background: var(--mo-clay) !important;
  box-shadow: 0 8px 24px -10px rgba(168,155,130,0.6) !important;
  color: var(--mo-paper-0) !important;
}
#ai-panel {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  box-shadow: 0 16px 40px -10px rgba(44,40,34,0.2) !important;
  color: var(--mo-ink) !important;
}
#ai-header {
  background: var(--mo-paper-2) !important;
  border-bottom: 1px solid var(--mo-border) !important;
}
#ai-header .title { color: var(--mo-ink) !important; }
#ai-header .title .dot { background: var(--mo-sage) !important; }
#ai-header button {
  background: transparent !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-3) !important;
}
#ai-header button:hover {
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
}
#ai-subject {
  background: var(--mo-paper-2) !important;
  border-bottom: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
#ai-subject .label { color: var(--mo-clay-d) !important; }
#ai-subject .no-q { color: var(--mo-ochre) !important; }
#ai-subject .preview { color: var(--mo-ink-3) !important; }
#ai-quota {
  background: var(--mo-paper-2) !important;
  border-bottom: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-3) !important;
}
#ai-quota .bar { background: var(--mo-paper-3) !important; }
#ai-quota .bar > span { background: linear-gradient(90deg, var(--mo-sage), #A8C47A) !important; }
#ai-quota.warn .bar > span { background: linear-gradient(90deg, var(--mo-ochre), var(--mo-terra)) !important; }
#ai-quota.danger { color: var(--mo-terra) !important; }
#ai-tools {
  background: var(--mo-paper-2) !important;
  border-bottom: 1px solid var(--mo-border) !important;
}
#ai-tools button {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
#ai-tools button:hover {
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
}
#ai-messages {
  background: var(--mo-paper-0) !important;
}
.ai-msg.user {
  background: var(--mo-clay) !important;
  color: var(--mo-paper-0) !important;
}
.ai-msg.assistant {
  background: var(--mo-paper-2) !important;
  color: var(--mo-ink) !important;
}
.ai-msg.assistant pre {
  background: var(--mo-paper-3) !important;
  color: var(--mo-ink) !important;
}
.ai-msg.assistant code {
  background: var(--mo-paper-3) !important;
  color: var(--mo-ink) !important;
}
.ai-msg.system-hint { color: var(--mo-ink-4) !important; }
.ai-empty { color: var(--mo-ink-4) !important; }
#ai-input-bar {
  background: var(--mo-paper-2) !important;
  border-top: 1px solid var(--mo-border) !important;
}
#ai-input {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink) !important;
}
#ai-input:focus { border-color: var(--mo-focus) !important; }
#ai-input::placeholder { color: var(--mo-ink-4) !important; }
#ai-send {
  background: var(--mo-clay) !important;
  color: var(--mo-paper-0) !important;
  border: none !important;
}
#ai-send:hover { background: var(--mo-clay-d) !important; }

/* ---------- Auth user-bar (injected by auth.js) ---------- */
#user-bar {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-left: 0 !important;
  flex-shrink: 0 !important;
  font-size: 13px !important;
}
#user-info { color: var(--mo-ink-3) !important; font-size: 12px !important; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#support-link {
  color: var(--mo-ochre) !important;
  border: 1px solid rgba(201,166,107,0.4) !important;
  border-radius: 999px !important;
  padding: 5px 12px !important;
}
#support-link:hover { background: rgba(201,166,107,0.1) !important; border-color: var(--mo-ochre) !important; }
#login-btn, #logout-btn {
  padding: 5px 14px !important;
  border: 1px solid var(--mo-border) !important;
  background: transparent !important;
  color: var(--mo-ink-3) !important;
  border-radius: 999px !important;
  font-family: 'Inter', sans-serif !important;
}
#login-btn:hover, #logout-btn:hover {
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
}
#admin-link {
  color: var(--mo-terra) !important;
  border: 1px solid rgba(184,122,106,0.3) !important;
  border-radius: 999px !important;
}
#admin-link:hover { background: rgba(184,122,106,0.1) !important; }

/* Focus ring */
*:focus-visible { outline: 2px solid var(--mo-focus) !important; outline-offset: 2px !important; border-radius: 6px !important; }

/* ---------- R-Notes page ---------- */
.cat-title { color: var(--mo-clay-d) !important; }
.note-btn { color: var(--mo-ink-2) !important; }
.note-btn:hover { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; }
.note-btn.active { background: var(--mo-clay-l) !important; color: var(--mo-clay-d) !important; border-left-color: var(--mo-clay) !important; }
section.content { background: var(--mo-paper) !important; }
.note-title { color: var(--mo-ink) !important; border-bottom-color: var(--mo-border) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.note-cat { background: var(--mo-clay-l) !important; color: var(--mo-clay-d) !important; }
.md-body { color: var(--mo-ink-2) !important; }
.md-body h1, .md-body h2, .md-body h3 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.md-body h2 { border-left-color: var(--mo-clay) !important; }
.md-body code { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; border: 1px solid var(--mo-border) !important; }
.md-body pre { background: var(--mo-paper-0) !important; border: 1px solid var(--mo-border) !important; }
.md-body blockquote { border-left-color: var(--mo-ochre) !important; background: #F6ECD6 !important; color: #7A612F !important; }
.search-box { background: var(--mo-paper-0) !important; border: 1px solid var(--mo-border) !important; color: var(--mo-ink) !important; }
.search-box:focus { border-color: var(--mo-focus) !important; }

/* ---------- Admin page ---------- */
table { background: var(--mo-paper-2) !important; border-radius: 10px !important; }
th { background: var(--mo-paper-3) !important; color: var(--mo-clay-d) !important; }
td { border-bottom-color: var(--mo-border) !important; }
tr:hover td { background: var(--mo-clay-l) !important; }
.badge.yes { background: var(--mo-ochre) !important; color: var(--mo-paper-0) !important; }
.badge.no { background: var(--mo-paper-3) !important; color: var(--mo-ink-4) !important; }
button.toggle { background: var(--mo-paper-3) !important; color: var(--mo-ink-2) !important; }
button.toggle:hover { background: var(--mo-clay-l) !important; }
.msg.err { background: #F0DDD6 !important; color: #8B4E3F !important; border-color: var(--mo-terra) !important; }
.msg.ok { background: #E7EDE4 !important; color: #4F6550 !important; border-color: var(--mo-sage) !important; }
header .pill { background: var(--mo-terra) !important; color: var(--mo-paper-0) !important; }
.stat .num { color: var(--mo-clay-d) !important; font-family: 'Fraunces',serif !important; }
.stat .label { color: var(--mo-ink-3) !important; }

/* ---------- Support page ---------- */
.hero h2 { font-family: 'Fraunces','Noto Serif SC',serif !important; }
.why { background: var(--mo-paper-2) !important; border: 1px solid var(--mo-border) !important; }
.why h3 { color: var(--mo-clay-d) !important; }
.why li b { color: var(--mo-ochre) !important; }

/* ---------- Stats bar (index) ---------- */
.stats-bar { background: var(--mo-paper-2) !important; border: 1px solid var(--mo-border) !important; }
.stat-item { border-right-color: var(--mo-border) !important; }
.stat-num { font-family: 'Fraunces',serif !important; color: var(--mo-ink) !important; }
.stat-label { color: var(--mo-ink-3) !important; }

/* ---------- Topbar (index) ---------- */
.topbar { background: var(--mo-paper-0) !important; border-bottom: 1px solid var(--mo-border) !important; }
.topbar .logo { font-family: 'Fraunces','Noto Serif SC',serif !important; color: var(--mo-ink) !important; }
.topbar .logo span { color: var(--mo-clay) !important; }

/* ---------- CodeMirror light override (for non-editor areas) ---------- */
.CodeMirror { background: var(--mo-paper-0) !important; color: var(--mo-ink) !important; border: 1px solid var(--mo-border) !important; }
.CodeMirror-gutters { background: var(--mo-paper-2) !important; border-right: 1px solid var(--mo-border) !important; }
.CodeMirror-linenumber { color: var(--mo-ink-4) !important; }
.CodeMirror-cursor { border-left-color: var(--mo-ink) !important; }
.CodeMirror-activeline-background { background: var(--mo-clay-l) !important; }
.CodeMirror-selected { background: rgba(168,155,130,0.3) !important; }

/* ---------- Dark CodeMirror inside .editor-wrap (VS Code dark) ---------- */
.editor-wrap .CodeMirror { background: #0f172a !important; color: #e2e8f0 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; outline: none !important; }
.editor-wrap .CodeMirror-scroll { border: none !important; }
.editor-wrap .CodeMirror-sizer { border-right: none !important; }
.editor-wrap .CodeMirror-gutters { background: #0f172a !important; border-right: 1px solid #334155 !important; }
.editor-wrap .CodeMirror-linenumber { color: #475569 !important; }
.editor-wrap .CodeMirror-cursor { border-left-color: #60a5fa !important; }
.editor-wrap .CodeMirror-activeline-background { background: rgba(255,255,255,0.04) !important; }
.editor-wrap .CodeMirror-selected { background: rgba(96,165,250,0.2) !important; }
.editor-wrap .CodeMirror-lines { border: none !important; }

/* ========== mast-calculus.html — full Morandi override ========== */

/* --- Main area --- */
main { background: var(--mo-paper) !important; }

/* Top header bar */
header.top { border-bottom-color: var(--mo-border) !important; }
header.top .title { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
header.top .progress-box { color: var(--mo-ink-3) !important; }
header.top .progress-box b { color: var(--mo-sage) !important; }

/* Progress bar */
.progress-bar { background: var(--mo-border) !important; }
#progressFill, .progress-bar div { background: var(--mo-sage) !important; }

/* Tool buttons (mode/chapter/action row) */
.tool-btn {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
.tool-btn:hover {
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
  background: var(--mo-paper-2) !important;
}
.tool-btn.active {
  background: var(--mo-clay) !important;
  border-color: var(--mo-clay) !important;
  color: var(--mo-paper-0) !important;
}
.tool-btn .badge-count { background: var(--mo-terra) !important; color: var(--mo-paper-0) !important; }

/* Exam banner */
#examBanner {
  background: linear-gradient(90deg, rgba(184,122,106,0.12), rgba(201,166,107,0.12)) !important;
  border-color: var(--mo-terra) !important;
  color: var(--mo-ink-2) !important;
}
#examBanner b { color: var(--mo-terra) !important; }
#examBanner #examRemaining { color: var(--mo-ochre) !important; }

/* --- Question cards --- */
.q-card {
  background: var(--mo-paper-0) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--mo-border) !important;
}
.q-card h3 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.q-card h3 .tag {
  background: var(--mo-clay-l) !important;
  color: var(--mo-clay-d) !important;
}
.q-card h3 .tag.mcq { background: rgba(139,154,170,0.15) !important; color: var(--mo-blue) !important; }
.q-card h3 .tag.dropdown { background: rgba(168,151,166,0.15) !important; color: var(--mo-mauve) !important; }
.q-card h3 .tag.proof { background: rgba(198,154,149,0.15) !important; color: var(--mo-rose) !important; }
.q-card h3 .tag.hard { background: rgba(201,166,107,0.15) !important; color: var(--mo-ochre) !important; }
.q-card .q-body { color: var(--mo-ink-2) !important; }
.q-card .q-body .math-block {
  background: var(--mo-paper-2) !important;
  border-left: 3px solid var(--mo-sage) !important;
  color: var(--mo-ink) !important;
}

/* Sub-question viewport */
.subs-viewport {
  background: var(--mo-paper-2) !important;
  border: 1px solid var(--mo-border) !important;
}
.sub-q { border-left-color: transparent !important; }
.sub-q.solved {
  border-left-color: var(--mo-sage) !important;
  background: linear-gradient(90deg, rgba(143,166,142,0.08), transparent 70%) !important;
}
.sub-q .sub-label { color: var(--mo-ink) !important; }

/* Sub-question nav */
.subs-nav {
  background: var(--mo-paper-3) !important;
  border-top: 1px solid var(--mo-border) !important;
}
.subs-nav .nav-btn {
  background: var(--mo-paper-0) !important;
  color: var(--mo-clay-d) !important;
  border: 1px solid var(--mo-border) !important;
}
.subs-nav .nav-btn:hover:not(:disabled) {
  background: var(--mo-clay-l) !important;
  border-color: var(--mo-clay) !important;
}
.subs-nav .nav-btn:disabled { opacity: 0.35 !important; }
.subs-dots .dot { background: var(--mo-border) !important; }
.subs-dots .dot.active { background: var(--mo-clay) !important; box-shadow: 0 0 0 3px rgba(168,155,130,0.2) !important; }
.subs-dots .dot.solved { background: var(--mo-sage) !important; }
.subs-dots .dot.solved.active { background: var(--mo-sage) !important; box-shadow: 0 0 0 3px rgba(143,166,142,0.25) !important; }
.subs-counter { color: var(--mo-ink-4) !important; }

/* Math input */
.math-input {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink) !important;
}
.math-input:focus {
  border-color: var(--mo-focus) !important;
  box-shadow: 0 0 0 3px rgba(184,155,90,0.18) !important;
}
.math-preview {
  background: var(--mo-paper-2) !important;
  border: 1px dashed var(--mo-border) !important;
  color: var(--mo-ink) !important;
}
.math-preview.empty { color: var(--mo-ink-4) !important; }

/* MCQ options */
.mcq-opt {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
.mcq-opt:hover { border-color: var(--mo-blue) !important; background: rgba(139,154,170,0.08) !important; }
.mcq-opt.selected { border-color: var(--mo-blue) !important; background: rgba(139,154,170,0.12) !important; color: var(--mo-ink) !important; }
.mcq-opt.correct { border-color: var(--mo-sage) !important; background: rgba(143,166,142,0.15) !important; color: #3D6B3E !important; }
.mcq-opt.wrong { border-color: var(--mo-terra) !important; background: rgba(184,122,106,0.12) !important; color: #8B4E3F !important; }

/* Dropdown */
.dropdown-inline {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink) !important;
}
.dropdown-inline:focus { border-color: var(--mo-focus) !important; }

/* Check / action buttons */
.btn-check {
  background: var(--mo-sage) !important;
  color: var(--mo-paper-0) !important;
}
.btn-check:hover { box-shadow: 0 4px 12px rgba(143,166,142,0.4) !important; }
.btn-mini {
  background: var(--mo-clay-l) !important;
  color: var(--mo-clay-d) !important;
  border: 1px solid var(--mo-border) !important;
}
.btn-mini:hover { background: var(--mo-paper-3) !important; border-color: var(--mo-clay) !important; }
.btn-mini.hint {
  background: rgba(201,166,107,0.12) !important;
  color: #7A612F !important;
  border-color: rgba(201,166,107,0.3) !important;
}
.btn-mini.hint:hover { background: rgba(201,166,107,0.22) !important; }
.action-bar { border-top-color: var(--mo-border) !important; }
.action-bar .lock-msg { color: var(--mo-terra) !important; }
.btn-hint {
  background: rgba(201,166,107,0.12) !important;
  color: #7A612F !important;
  border-color: var(--mo-ochre) !important;
}
.btn-hint:hover { background: rgba(201,166,107,0.22) !important; }
.btn-show {
  background: rgba(198,154,149,0.12) !important;
  color: #8B4E3F !important;
  border-color: var(--mo-rose) !important;
}
.btn-show:hover { background: rgba(198,154,149,0.22) !important; }

/* Feedback */
.feedback.ok {
  background: #E7EDE4 !important;
  border: 1px solid var(--mo-sage) !important;
  color: #3D6B3E !important;
}
.feedback.no {
  background: #F0DDD6 !important;
  border: 1px solid var(--mo-terra) !important;
  color: #8B4E3F !important;
}

/* Solution box */
.solution {
  background: var(--mo-paper-2) !important;
  border-left: 3px solid var(--mo-mauve) !important;
  color: var(--mo-ink-2) !important;
}
.solution b { color: var(--mo-ink) !important; }

/* --- Modal (stats / wrong book) --- */
.modal-bg { background: rgba(44,40,34,0.5) !important; }
.modal {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink) !important;
}
.modal h3 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.modal h3 .x { color: var(--mo-ink-4) !important; }
.modal h3 .x:hover { color: var(--mo-terra) !important; }
.stat-row { border-bottom-color: var(--mo-border) !important; color: var(--mo-ink-2) !important; }
.stat-bar-wrap { background: var(--mo-paper-3) !important; }
.stat-bar { background: var(--mo-sage) !important; }
.wrong-item {
  background: rgba(184,122,106,0.06) !important;
  border: 1px solid rgba(184,122,106,0.3) !important;
  color: var(--mo-ink-2) !important;
}
.wrong-item:hover { background: rgba(184,122,106,0.12) !important; }
.wrong-item .chips-wrong { color: var(--mo-terra) !important; }

/* --- FAB buttons --- */
.fab {
  background: var(--mo-clay) !important;
  color: var(--mo-paper-0) !important;
  box-shadow: 0 6px 20px rgba(168,155,130,0.5) !important;
}
.fab:hover { background: var(--mo-clay-d) !important; }
#cheatBtn {
  background: var(--mo-ochre) !important;
  color: var(--mo-paper-0) !important;
}
#cheatBtn:hover { background: #B8923D !important; }
.fab-timer {
  background: var(--mo-paper-0) !important;
  color: var(--mo-ochre) !important;
  border: 1px solid var(--mo-border) !important;
  backdrop-filter: none !important;
}

/* --- Symbol palette (数学符号速查) --- */
.palette {
  background: var(--mo-paper-0) !important;
  border: 1px solid var(--mo-border) !important;
  backdrop-filter: none !important;
  box-shadow: 0 10px 40px rgba(44,40,34,0.2) !important;
}
.palette h4 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.palette h4 .close { color: var(--mo-ink-4) !important; }
.palette h4 .close:hover { color: var(--mo-terra) !important; }
.palette .group-title { color: var(--mo-ink-3) !important; }
.chip {
  background: var(--mo-paper-2) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-ink-2) !important;
}
.chip:hover {
  background: var(--mo-clay-l) !important;
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
}
.chip .sym { color: var(--mo-clay-d) !important; }
.palette .note {
  color: var(--mo-ink-3) !important;
  background: rgba(201,166,107,0.08) !important;
  border-left: 2px solid var(--mo-ochre) !important;
}
.palette .note b { color: var(--mo-ink-2) !important; }
.palette .note code { color: var(--mo-ochre) !important; }

/* --- Cheatsheet (知识点速查) --- */
.cheatsheet {
  background: var(--mo-paper-0) !important;
  border-left: 1px solid var(--mo-border) !important;
  backdrop-filter: none !important;
  box-shadow: -8px 0 24px rgba(44,40,34,0.15) !important;
}
.cheatsheet h3 { color: var(--mo-ink) !important; font-family: 'Fraunces','Noto Serif SC',serif !important; }
.cheatsheet h3 .x { color: var(--mo-ink-4) !important; }
.cheatsheet .ch-title {
  color: var(--mo-clay-d) !important;
  border-bottom-color: var(--mo-border) !important;
}
.cheatsheet .ch-item {
  background: var(--mo-paper-2) !important;
  color: var(--mo-ink-2) !important;
}
.cheatsheet .ch-item b { color: var(--mo-ink) !important; }
.cheatsheet .ch-item .katex { color: var(--mo-ink) !important; }

/* --- Sidebar aside for mast-calculus --- */
aside .back { color: var(--mo-clay-d) !important; }
aside .back:hover { color: var(--mo-ink) !important; }
aside h2 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: initial !important;
  color: var(--mo-ink) !important;
}
aside .sub-sig { color: var(--mo-ink-4) !important; }
aside .section-title { color: var(--mo-ink-3) !important; }
aside .section-title .sec-prog { color: var(--mo-sage) !important; }
aside .section-title .sec-prog.zero { color: var(--mo-ink-4) !important; }
aside .q-item { color: var(--mo-ink-2) !important; }
aside .q-item:hover { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
aside .q-item.active {
  background: var(--mo-clay-l) !important;
  border-color: var(--mo-clay) !important;
  color: var(--mo-ink) !important;
}
aside .q-item .dot { background: var(--mo-border) !important; }
aside .q-item.done .dot { background: var(--mo-sage) !important; box-shadow: none !important; }
aside .q-item .num { color: var(--mo-ink-4) !important; }
aside .q-item.active .num { color: var(--mo-clay-d) !important; }

/* --- KaTeX color fix --- */
.katex, .katex .mord, .katex .mbin, .katex .mrel,
.katex .mopen, .katex .mclose, .katex .mpunct,
.katex .mop, .katex .minner { color: var(--mo-ink) !important; }

/* Keyboard shortcut badges */
.kbd {
  background: var(--mo-paper-2) !important;
  border: 1px solid var(--mo-border) !important;
  color: var(--mo-clay-d) !important;
  box-shadow: 0 1px 0 var(--mo-border) !important;
}

/* Footer text */
main > div:last-child code { color: var(--mo-ochre) !important; }

/* ============================================================
   深色模式 — Morandi Dark
   通过 html[data-theme="dark"] 切换，只需覆盖 CSS 变量
   ============================================================ */
html[data-theme="dark"] {
  --mo-paper:   #1a1816;
  --mo-paper-2: #242120;
  --mo-paper-3: #2e2a28;
  --mo-paper-0: #141210;
  --mo-border:  #3a3634;
  --mo-divider: #4a4542;
  --mo-ink:     #e8e2d8;
  --mo-ink-2:   #c8c0b4;
  --mo-ink-3:   #9a9288;
  --mo-ink-4:   #706860;
  --mo-clay:    #b8a88e;
  --mo-clay-d:  #c9b89c;
  --mo-clay-l:  #2a2622;
  --mo-sage:    #7a9a78;
  --mo-blue:    #8a9ab0;
  --mo-ochre:   #d4b06a;
  --mo-rose:    #c89a92;
  --mo-mauve:   #aa97a8;
  --mo-terra:   #c48a78;
  --mo-focus:   #c8a860;
  color-scheme: dark;
}

/* 深色模式下的额外样式修正 */
html[data-theme="dark"] body { background-image: none !important; }
html[data-theme="dark"] img { opacity: 0.92; }
html[data-theme="dark"] .hint-box { background: #2a2418 !important; color: #d4b06a !important; }
html[data-theme="dark"] .hint-box code { background: #3a3020 !important; color: #e8d090 !important; padding: 1px 5px; border-radius: 3px; }
html[data-theme="dark"] .hint-box b { color: #f0d878 !important; }
html[data-theme="dark"] .sol-box  { background: #2a1e1a !important; color: #c89a92 !important; }
html[data-theme="dark"] .sol-box code { background: #3a2a24 !important; color: #e0b0a0 !important; padding: 1px 5px; border-radius: 3px; }
html[data-theme="dark"] .sol-box b { color: #e8c0b0 !important; }
html[data-theme="dark"] .sol-box pre { background: var(--mo-paper-0) !important; }
html[data-theme="dark"] .msg.error { background: #2a1e1a !important; color: #c89a92 !important; }
html[data-theme="dark"] .msg.success, html[data-theme="dark"] .msg.ok { background: #1a2618 !important; color: #7a9a78 !important; }
html[data-theme="dark"] .md-body blockquote { background: #2a2418 !important; color: #d4b06a !important; }
html[data-theme="dark"] .badge.yes { background: var(--mo-ochre) !important; color: #1a1816 !important; }
html[data-theme="dark"] ::selection { background: rgba(184,168,142,0.3); }

/* 深色模式 — comp-hub AI 面板适配 */
html[data-theme="dark"] .ai-panel-hint { background: rgba(184,168,142,0.1) !important; border-color: rgba(184,168,142,0.25) !important; }
html[data-theme="dark"] .ai-btn { background: var(--mo-ochre) !important; color: var(--mo-paper-0) !important; }
html[data-theme="dark"] .ai-label { color: var(--mo-ochre) !important; }
html[data-theme="dark"] .ai-panel-head .ai-dot { background: var(--mo-ochre) !important; }
html[data-theme="dark"] .ai-step::before { background: var(--mo-ochre) !important; }
html[data-theme="dark"] .ai-panel-body code { color: var(--mo-ochre) !important; }
html[data-theme="dark"] .ai-followup-btn { color: var(--mo-ochre) !important; border-color: rgba(184,168,142,0.3) !important; }
html[data-theme="dark"] .ai-followup-btn:hover { background: rgba(184,168,142,0.1) !important; }

/* 深色模式 — 页面内联样式强制覆盖 */
/* body / html 背景 */
html[data-theme="dark"] body,
html[data-theme="dark"] html { background: var(--mo-paper) !important; color: var(--mo-ink) !important; }

/* 所有通用容器 */
html[data-theme="dark"] .topbar,
html[data-theme="dark"] header,
html[data-theme="dark"] .hero,
html[data-theme="dark"] .stats-bar,
html[data-theme="dark"] .card-grid,
html[data-theme="dark"] .tab-panel,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .stat-detail,
html[data-theme="dark"] .wrong-card,
html[data-theme="dark"] .chart-box,
html[data-theme="dark"] .acc-table,
html[data-theme="dark"] .overview-wrap,
html[data-theme="dark"] .kpi-grid { background: var(--mo-paper-2) !important; color: var(--mo-ink) !important; border-color: var(--mo-border) !important; }

/* 所有浅色文字在深色下变亮 */
html[data-theme="dark"] [style*="color:#2C2822"],
html[data-theme="dark"] [style*="color:#4A4338"],
html[data-theme="dark"] [style*="color:#6B6459"],
html[data-theme="dark"] [style*="color:#8A8275"],
html[data-theme="dark"] [style*="color:#64748b"],
html[data-theme="dark"] [style*="color:#475569"],
html[data-theme="dark"] [style*="color:#555"] { color: var(--mo-ink-2) !important; }

/* 浅色背景在深色下变暗 */
html[data-theme="dark"] [style*="background:#F4EFE6"],
html[data-theme="dark"] [style*="background:#FAF6EE"],
html[data-theme="dark"] [style*="background:#ECE5D8"],
html[data-theme="dark"] [style*="background: #F4EFE6"],
html[data-theme="dark"] [style*="background: #FAF6EE"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"] { background: var(--mo-paper) !important; }

/* 边框 */
html[data-theme="dark"] [style*="border-color:#D9D1C2"],
html[data-theme="dark"] [style*="border:1px solid #D9D1C2"],
html[data-theme="dark"] [style*="border: 1px solid #D9D1C2"],
html[data-theme="dark"] [style*="border-bottom:1px solid #D9D1C2"] { border-color: var(--mo-border) !important; }

/* mast-calculus 特有的深色配色修正 */
html[data-theme="dark"] [style*="background:#334155"] { background: var(--mo-paper-3) !important; }
html[data-theme="dark"] [style*="background:#0f172a"],
html[data-theme="dark"] [style*="background: #0f172a"] { background: var(--mo-paper-0) !important; }
html[data-theme="dark"] [style*="color:#94a3b8"] { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] [style*="color:#e2e8f0"],
html[data-theme="dark"] [style*="color:#f1f5f9"] { color: var(--mo-ink) !important; }
html[data-theme="dark"] [style*="color:#cbd5e1"] { color: var(--mo-ink-2) !important; }
html[data-theme="dark"] [style*="color:#60a5fa"] { color: var(--mo-blue) !important; }
html[data-theme="dark"] [style*="color:#34d399"] { color: var(--mo-sage) !important; }
html[data-theme="dark"] [style*="color:#fbbf24"],
html[data-theme="dark"] [style*="color:#fde68a"] { color: var(--mo-ochre) !important; }
html[data-theme="dark"] [style*="color:#f87171"],
html[data-theme="dark"] [style*="color:#fca5a5"] { color: var(--mo-terra) !important; }

/* 成功/完成状态 */
html[data-theme="dark"] [style*="background:#14532d"] { background: rgba(122,154,120,0.2) !important; }
html[data-theme="dark"] [style*="color:#4ade80"] { color: var(--mo-sage) !important; }
html[data-theme="dark"] [style*="border-color:#22c55e"] { border-color: var(--mo-sage) !important; }

/* exam 页面 progress-bar, stat cards */
html[data-theme="dark"] .exam-header { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .progress-bar-wrap { background: var(--mo-paper-3) !important; }
html[data-theme="dark"] .progress-badge { background: var(--mo-paper-3) !important; color: var(--mo-ink) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .q-card-exam { background: var(--mo-paper-0) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .choice { background: var(--mo-paper-0) !important; border-color: var(--mo-border) !important; color: var(--mo-ink-2) !important; }
html[data-theme="dark"] .choice:hover { background: var(--mo-paper-2) !important; }
html[data-theme="dark"] .choice.sel { border-color: var(--mo-clay) !important; background: var(--mo-clay-l) !important; }
html[data-theme="dark"] .answer-input { background: var(--mo-paper-0) !important; color: var(--mo-ink) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .dot-nav .dot { background: var(--mo-paper-3) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .dot-nav .dot.answered { background: var(--mo-sage) !important; }
html[data-theme="dark"] .dot-nav .dot.cur { border-color: var(--mo-clay) !important; }
html[data-theme="dark"] .bottom-nav { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }

/* dashboard 深色下 stat cards */
html[data-theme="dark"] .stat-card .num { color: var(--mo-ink) !important; }
html[data-theme="dark"] .stat-card .label { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] .stat-card .delta { color: var(--mo-ink-4) !important; }

/* modal */
html[data-theme="dark"] .modal-backdrop { background: rgba(0,0,0,0.6) !important; }
html[data-theme="dark"] .modal { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; color: var(--mo-ink) !important; }
html[data-theme="dark"] .modal h3 { color: var(--mo-ink) !important; }

/* login page */
html[data-theme="dark"] .login-box,
html[data-theme="dark"] .auth-card { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .login-box input,
html[data-theme="dark"] .auth-card input { background: var(--mo-paper-0) !important; color: var(--mo-ink) !important; border-color: var(--mo-border) !important; }

/* calendar */
html[data-theme="dark"] .cal-cell { background: var(--mo-paper-0) !important; border-color: var(--mo-border) !important; color: var(--mo-ink) !important; }
html[data-theme="dark"] .cal-cell:hover { background: var(--mo-paper-2) !important; }
html[data-theme="dark"] .cal-cell.today { border-color: var(--mo-clay) !important; }

/* support / index 通用 */
html[data-theme="dark"] .why { background: var(--mo-paper-2) !important; }
html[data-theme="dark"] table th { background: var(--mo-paper-3) !important; color: var(--mo-ink) !important; }
html[data-theme="dark"] table td { background: var(--mo-paper-2) !important; color: var(--mo-ink-2) !important; border-color: var(--mo-border) !important; }

/* report 页 wrong items */
html[data-theme="dark"] .wrong-item { background: rgba(196,138,120,0.1) !important; border-color: rgba(196,138,120,0.3) !important; }
html[data-theme="dark"] .report-summary { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }

/* code editor */
html[data-theme="dark"] .code-editor,
html[data-theme="dark"] textarea.editor { background: var(--mo-paper-0) !important; color: var(--mo-ink) !important; }

/* math preview */
html[data-theme="dark"] .math-preview-box { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .math-sym { background: var(--mo-paper-2) !important; color: var(--mo-ink-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .math-sym:hover { background: var(--mo-paper-3) !important; color: var(--mo-ink) !important; }

/* pricing 页面 — Pro 卡片深色适配 */
html[data-theme="dark"] .plan.pro {
  background: linear-gradient(165deg, #2a2520 0%, #342e28 55%, #3e3830 100%) !important;
  border-color: #4a4440 !important;
}
html[data-theme="dark"] .plan.pro .plan-name { color: var(--mo-ink) !important; }
html[data-theme="dark"] .plan.pro .plan-tag { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] .plan.pro .price-amt { color: var(--mo-ink) !important; }
html[data-theme="dark"] .plan.pro .price-cycle { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] .plan.pro .price-note { color: var(--mo-ink-4) !important; }
html[data-theme="dark"] .plan.pro .feat { color: var(--mo-ink-2) !important; }
html[data-theme="dark"] .plan.pro .feat.off .ico { border-color: var(--mo-ink-4) !important; color: var(--mo-ink-4) !important; }
html[data-theme="dark"] .plan.pro .cta { color: #1a1816 !important; }
html[data-theme="dark"] .plan.pro .plan-icon { color: #1a1816 !important; }
html[data-theme="dark"] .plan-badge { color: #1a1816 !important; }

/* pricing — 对比表、FAQ、CTA 深色适配 */
html[data-theme="dark"] .compare-table { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .compare-table thead th { background: var(--mo-paper-3) !important; color: var(--mo-ink) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .compare-table thead th.col-pro { background: linear-gradient(180deg, rgba(212,176,106,0.1) 0%, transparent 100%) !important; color: var(--mo-ochre) !important; }
html[data-theme="dark"] .compare-table tbody tr { border-color: var(--mo-border) !important; }
html[data-theme="dark"] .compare-table tbody tr:hover { background: var(--mo-paper-3) !important; }
html[data-theme="dark"] .compare-table td { color: var(--mo-ink-2) !important; }
html[data-theme="dark"] .compare-table td.c-pro { background: rgba(212,176,106,0.06) !important; }
html[data-theme="dark"] .compare-table .sec-row td { background: var(--mo-paper-3) !important; color: var(--mo-ink-4) !important; }
html[data-theme="dark"] .row-feature { color: var(--mo-ink) !important; }
html[data-theme="dark"] .row-sub { color: var(--mo-ink-4) !important; }

html[data-theme="dark"] .faq-item { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .faq-item:hover { border-color: var(--mo-clay) !important; }
html[data-theme="dark"] .faq-q { color: var(--mo-ink) !important; }
html[data-theme="dark"] .faq-a { color: var(--mo-ink-3) !important; }

html[data-theme="dark"] .cta-band { background: linear-gradient(165deg, var(--mo-paper-2) 0%, var(--mo-paper-3) 100%) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .cta-band h3 { color: var(--mo-ink) !important; }
html[data-theme="dark"] .cta-band p { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] .cta-band-btns .pri { color: #1a1816 !important; }
html[data-theme="dark"] .cta-band-btns .sec { color: var(--mo-ink-2) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .cta-band-btns .sec:hover { background: var(--mo-paper-0) !important; border-color: var(--mo-clay) !important; }
html[data-theme="dark"] .trust-row { border-top-color: var(--mo-border) !important; }
html[data-theme="dark"] .trust-row .item { color: var(--mo-ink-4) !important; }
html[data-theme="dark"] .trust-row .item::before { background: var(--mo-sage) !important; color: #1a1816 !important; }

html[data-theme="dark"] .pro-status { background: linear-gradient(135deg, rgba(212,176,106,0.1), rgba(184,168,142,0.08)) !important; border-color: var(--mo-ochre) !important; }

html[data-theme="dark"] .billing-toggle { background: var(--mo-paper-3) !important; border-color: var(--mo-border) !important; }
html[data-theme="dark"] .billing-toggle button { color: var(--mo-ink-3) !important; }
html[data-theme="dark"] .billing-toggle button.active { background: var(--mo-paper-0) !important; color: var(--mo-ink) !important; }

/* admin — Pro 列新增样式深色适配 */
html[data-theme="dark"] button.toggle.on { background: var(--mo-ochre) !important; color: #1a1816 !important; }
html[data-theme="dark"] .stat { background: var(--mo-paper-2) !important; border-color: var(--mo-border) !important; }

/* 深色模式切换按钮 */
#theme-toggle {
  background: transparent; border: 1px solid var(--mo-border);
  color: var(--mo-ink-3); border-radius: 999px; cursor: pointer;
  padding: 5px 10px; font-size: 14px; line-height: 1; transition: all 0.15s;
}
#theme-toggle:hover { border-color: var(--mo-clay); color: var(--mo-ink); }

/* ---------- comp-hub.html editor output dark ---------- */
.editor-wrap .editor-output { background: #0c1322 !important; border-top: 1px solid #334155 !important; color: #A3BE8C !important; }
.editor-wrap .editor-head { background: #0f172a !important; border-bottom: 1px solid #334155 !important; }
.editor-wrap { background: #0f172a !important; border-color: #334155 !important; }
