/* ==========================================================================
   素纸暖白 · Notion 系覆盖层（kb-clean.css）
   目的：在不改动原样式表与内容的前提下，换成安静、耐看的文档感风格：
   暖米白底、白卡、暖深字、克制蓝作唯一强调；去深色横幅、光晕、衬线大标题、
   阴影上浮与漂浮装饰。加载顺序：放在各页面原有 CSS 之后，用 !important 覆盖。
   如需恢复旧绿色风格，用 _backup/kb-clean-green.css 替换本文件即可。
   ========================================================================== */

/* ---------- 1 · 全站动画静态化：内容默认完整可见 ---------- */
[data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
html.ag-motion [data-reveal]:not(.is-visible) { opacity: 1 !important; transform: none !important; }
.ag-letter { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
html.ag-motion .ag-split .ag-letter { opacity: 1 !important; }
html.ag-motion .ag-split.is-visible .ag-letter { animation: none !important; }
.ag-split .ag-letter::after { display: none !important; }
.ag-typed-output { display: none !important; }
.ag-typed-reserve { visibility: visible !important; position: static !important; }
.ag-typed.is-typing .ag-typed-output::after { display: none !important; }
.ag-particles { display: none !important; }
.ag-motion-control { display: none !important; }
.flow-hero__glow, .ins-hero__glow { display: none !important; animation: none !important; }
html.ag-motion :is(.ag-orbits, .bouncers) { transform: none !important; }
html.ag-motion .ag-hero h1 .ag-letter { opacity: 1 !important; }

/* ---------- 2 · 主题色板（素纸暖白） ----------
   各页面内联 :root 在本覆盖层之后，会重新定义变量，故这里全部用 !important
   强制压住，保证 var(--accent) 等解析到 Notion 蓝而非内联旧绿。 */
:root {
  --page: #F7F6F3 !important;
  --paper: #FFFFFF !important;
  --paper-soft: #F1F0EC !important;
  --ink: #37352F !important;
  --muted: #78716C !important;
  --faint: #A39E98 !important;
  --line: #E9E7E2 !important;
  --accent: #0075DE !important;
  --accent-dark: #0059B3 !important;
  --accent-wash: #E8F0FE !important;
  --deep: #37352F !important;
  --deep-soft: #4F4A44 !important;
  --shadow: 0 1px 2px rgba(15, 15, 15, 0.04) !important;
}
body {
  background: var(--page) !important;
  color: var(--ink) !important;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  -webkit-font-smoothing: antialiased;
}
:focus-visible { outline: 3px solid rgba(0, 117, 222, 0.25) !important; outline-offset: 2px !important; }

/* ---------- 3 · 顶栏 ---------- */
.topbar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom: 1px solid var(--line) !important;
}
.brand-mark {
  background: var(--deep) !important;
  color: #F7F6F3 !important;
  border-radius: 9px !important;
}
.brand-en { color: var(--faint) !important; }
.nav { color: var(--muted) !important; }
.nav a:hover, .nav a[aria-current="page"] { color: var(--ink) !important; }
.nav a[aria-current="page"]::after { background: var(--accent) !important; }
.topbar-right { color: var(--muted) !important; }
.status-dot { background: var(--accent) !important; box-shadow: 0 0 0 4px var(--accent-wash) !important; }

/* ---------- 4 · Hero：去深色横幅与装饰，改白底安静标题区 ---------- */
.hero {
  background: #FFFFFF !important;
  color: var(--ink) !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 56px 0 52px !important;
}
.hero::before, .hero::after { display: none !important; }
.eyebrow { color: var(--muted) !important; text-transform: none !important; letter-spacing: .06em !important; }
.eyebrow::before { background: var(--line) !important; }
.hero h1, h1 {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, sans-serif !important;
  font-size: clamp(30px, 4.2vw, 46px) !important;
  font-weight: 650 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.25 !important;
  color: var(--ink) !important;
}
.hero h1 em, h1 em { color: var(--accent) !important; font-style: normal !important; }
.hero-copy { color: var(--muted) !important; font-size: 15.5px !important; line-height: 1.8 !important; }

/* 搜索框（如有） */
.hero-search {
  background: #FFFFFF !important;
  border-color: #D9D4CC !important;
  box-shadow: var(--shadow) !important;
}
.hero-search:focus-within {
  border-color: var(--accent) !important;
  background: #FFFFFF !important;
  box-shadow: 0 0 0 3px rgba(0, 117, 222, 0.12) !important;
}
.hero-search input { color: var(--ink) !important; }
.hero-search input::placeholder { color: var(--faint) !important; }
.search-icon { color: var(--muted) !important; }
.key-hint { color: var(--muted) !important; border-color: var(--line) !important; }

/* 右侧路径卡 */
.hero-aside {
  background: #FFFFFF !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}
.aside-label { color: var(--muted) !important; }
.path-step { border-top-color: var(--line) !important; }
.step-no { border-color: #D9D4CC !important; color: var(--deep) !important; background: var(--paper-soft) !important; }
.path-step strong { color: var(--ink) !important; }
.path-step span:last-child { color: var(--muted) !important; }
.prototype-note { color: var(--muted) !important; }
.prototype-note b { background: var(--accent-wash) !important; color: var(--accent-dark) !important; }

/* ---------- 5 · 区块标题与正文 ---------- */
.section-kicker, .flow-hero__kicker, .flow-section__kicker, .guide-eyebrow, .data-kicker, .tree-code {
  color: var(--accent) !important;
  text-transform: none !important;
  letter-spacing: .04em !important;
}
h2, .module-heading h2, .governance h2, .dialog-head h2 {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, sans-serif !important;
  font-weight: 650 !important;
  color: var(--ink) !important;
  letter-spacing: -0.01em !important;
}
.section-copy, .flow-hero__lead, .flow-section__lead, .flow-hero__sub, .guide-step__body p, .guide-faq p {
  color: var(--muted) !important;
  line-height: 1.75 !important;
}
.text-link, .flow-jump__link { color: var(--accent) !important; }

/* ---------- 6 · 分类按钮 ---------- */
.category-button {
  background: rgba(255, 255, 255, 0.7) !important;
  border-color: var(--line) !important;
}
.category-button:hover {
  transform: none !important;
  border-color: #D9D4CC !important;
  background: #FFFFFF !important;
}
.category-button[aria-pressed="true"] {
  border-color: var(--accent) !important;
  background: var(--accent-wash) !important;
}
.category-icon { background: var(--paper-soft) !important; color: var(--muted) !important; }
.category-icon > span { color: var(--muted) !important; }

/* ---------- 7 · 按钮 ---------- */
.header-add, .primary-button, .btn--primary, .nav-button--cta {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
}
.header-add:hover, .primary-button:hover, .btn--primary:hover, .nav-button--cta:hover {
  transform: none !important;
  background: var(--accent-dark) !important;
  border-color: var(--accent-dark) !important;
}
.utility-button, .header-add:not(.primary-button) {
  background: #FFFFFF !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
.utility-button:hover { transform: none !important; border-color: #D9D4CC !important; background: var(--paper-soft) !important; }

/* ---------- 8 · 卡片：去阴影、去上浮、细边白卡 ---------- */
.module-card, .knowledge-card, .data-block, .flow-card--link {
  background: var(--paper) !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}
.module-card:hover, .module-card[open],
.knowledge-card:hover, .knowledge-card[open],
.flow-card--link:hover, .flow-card--link:focus-visible {
  transform: none !important;
  box-shadow: none !important;
  border-color: #D9D4CC !important;
}
.module-card.featured-card, .knowledge-card.featured {
  background: var(--paper-soft) !important;
}
.module-card h3, .knowledge-card h3, .data-block h3, .module-empty strong, .empty-state strong {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", system-ui, sans-serif !important;
  font-weight: 650 !important;
  color: var(--ink) !important;
}
.module-card-link:hover h3, .detail-toggle, .flow-card__go { color: var(--accent) !important; }
.module-card p, .card-summary, .data-block p { color: var(--muted) !important; }
.module-card-type, .doc-type, .flow-card__tag { color: var(--accent) !important; }
.module-card-code, .doc-code { color: var(--faint) !important; }
.module-card-meta, .card-meta { color: var(--muted) !important; }
.module-card-meta i, .meta-dot { background: var(--faint) !important; }

/* 卡内链接/按钮 */
.module-card-actions a, .module-card-actions button { color: var(--accent) !important; }
.flow-card__icon--blue { background: var(--accent) !important; }
.flow-card__tag { background: var(--accent-wash) !important; color: var(--accent-dark) !important; }

/* 展开正文块：左边框中性、暖底 */
.module-card-body, .detail-body {
  border-left: 2px solid #D9D4CC !important;
  background: var(--page) !important;
  color: #57534E !important;
  border-radius: 0 8px 8px 0 !important;
}

/* 空态 */
.module-empty, .empty-state {
  border-color: #DDD8D0 !important;
  background: rgba(255, 255, 255, 0.6) !important;
  color: var(--muted) !important;
}

/* ---------- 9 · 标签 / 筛选 / 选项卡 ---------- */
.tool-chip { background: #FFFFFF !important; border-color: var(--line) !important; color: var(--muted) !important; }
.tool-chip:hover, .tool-chip[aria-pressed="true"] {
  border-color: var(--accent) !important;
  background: var(--accent-wash) !important;
  color: var(--accent-dark) !important;
}
.product-tab { background: #FFFFFF !important; border-color: var(--line) !important; color: var(--muted) !important; }
.product-tab[aria-pressed="true"] {
  border-color: var(--deep) !important;
  background: var(--deep) !important;
  color: #FFFFFF !important;
}
.tree-form { border-left-color: #D9D4CC !important; background: var(--paper-soft) !important; }
.user-entry-mark { background: var(--accent-wash) !important; color: var(--accent-dark) !important; }

/* ---------- 10 · 导航按钮（教程子页 / 筷子页使用的类） ---------- */
.nav-button, .haina-brand, .guide-back, .flow-guide a:not(.flow-card__go) { color: var(--ink) !important; }
.nav-button:hover, .guide-back:hover { color: var(--accent) !important; }
.nav-button[aria-current="page"] { background: var(--accent-wash) !important; color: var(--accent-dark) !important; }

/* ---------- 11 · 弹窗 / 表单 ---------- */
.entry-dialog { background: var(--paper) !important; border-color: var(--line) !important; box-shadow: 0 24px 70px rgba(15, 15, 15, 0.18) !important; }
.entry-dialog::backdrop { background: rgba(55, 53, 47, 0.4) !important; }
.entry-dialog label { color: var(--muted) !important; }
.entry-dialog input, .entry-dialog select, .entry-dialog textarea {
  border-color: #D9D4CC !important;
  background: #FFFFFF !important;
  color: var(--ink) !important;
}
.entry-dialog input:focus, .entry-dialog select:focus, .entry-dialog textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(0, 117, 222, 0.12) !important;
}
.dialog-close { background: #FFFFFF !important; border-color: var(--line) !important; color: var(--muted) !important; }

/* ---------- 12 · 治理区 / 页脚 / 提示 ---------- */
.governance { border-color: var(--line) !important; }
.governance p { color: var(--muted) !important; }
.governance-list span { background: var(--paper-soft) !important; border-color: var(--line) !important; color: var(--muted) !important; }
footer { color: var(--faint) !important; }
.footer-brand { color: #57534E !important; }
.toast { background: var(--deep) !important; color: #F7F6F3 !important; border-color: var(--deep) !important; }

/* ---------- 13 · 右下角智能助手浮窗 ---------- */
.af-toggle {
  background: var(--deep) !important;
  color: #F7F6F3 !important;
  box-shadow: 0 8px 22px rgba(15, 15, 15, 0.18) !important;
}
.af-panel { background: #FFFFFF !important; border-color: var(--line) !important; box-shadow: 0 18px 50px rgba(15, 15, 15, 0.18) !important; }
.af-head { background: var(--paper-soft) !important; border-bottom-color: var(--line) !important; color: var(--ink) !important; }
.af-close { color: var(--muted) !important; }

/* ---------- 14 · 可读性 ---------- */
.flow-card__desc, .flow-card__host, .flow-card__fact { font-size: 14px !important; color: var(--muted) !important; }
/* ---------- 15 · 公网上线调整：去左上角品牌方块标；隐藏本地 MAXKB 浮窗（127.0.0.1 公网不可达） ---------- */
.brand-mark { display: none !important; }
#assistant-float { display: none !important; }
