/* =========================================================================
   九宫八卦｜Global Theme System（全站统一昼夜背景系统）
   来源：《九宫背景方案》jiugong-hermes-theme-system.zip → styles/jiugong-theme.css
   三套底层视觉：PAPER(昼) / INK(夜) / BRAND(首页)

   ── 与本仓既有约定的对接（Hermes 适配，逐条列明）────────────────────────
   1. 本仓原有的暗色属性值是 data-theme="night"（Tailwind 的 dark: 变体就挂在
      它上面）。用户脚本用的是 data-theme="ink"，同时还会写一个 data-jg-theme。
      因此本文件把 ink / night / data-jg-theme=ink 三者视为同一套 INK 令牌，
      旧的 night 页面与其它并发改动都不会失配。
   2. 用户脚本把页面组写到 html/body 上，故分组选择器用属性选择器（html 与
      body 都带该属性，命中哪个都一样）。
   3. 【按需删除】用户文件里 `body :where(.card/…/input/a/hr)` 这类「元素级
      兜底」规则未落地：本仓的 styled 组件是 Tailwind 工具类（@layer utilities），
      而无层级(unlayered)的全局规则会无条件压过所有工具类 —— 那会让全站每个
      <a> 变成品牌金、每个卡片/输入框被统一接管。本系统的组件级取色统一走
      「令牌 + 语义类」，不放全局元素兜底。
   4. 锁定组（BRAND/KNOWLEDGE/HUANGLI/LEGAL = README 表里 switchable:false）
      在本文件末尾显式回填 PAPER 令牌，保证「知识阅读页不会变成深色大面积
      阅读背景」「黄历核心数据区保持纸境」。
  5. 【Design Tokens V1 对接 · 2026-09-18】全站唯一取色源的规范名见
     src/app/design-tokens-v1.css（由 globals.css 第一行 @import）。本文件仍是
     PAPER/INK 令牌与锁定组回填的**唯一真源**；V1 的 --jg-bg/--jg-surface/
     --jg-surface-soft/--jg-text/--jg-text-muted/--jg-positive 都是挂在本文件
     令牌上的别名，昼夜与锁定组行为一字未改。合并时解掉的命名冲突：
     --jg-text-muted → --jg-text-faint（旧的最弱灰，值不变）、
     --jg-danger → --jg-cinnabar（同为 #A53A35 的重复定义）、
     --jg-warning → 归并到 V1（原值 0 消费点）。
   ========================================================================= */

:root {
  color-scheme: light;

  /* Page */
  --jg-bg-page: #F4F0E7;
  --jg-bg-surface: #FAF8F2;
  --jg-bg-surface-soft: #ECE7DC;
  --jg-bg-elevated: #FFFFFF;

  /* Text */
  --jg-text-primary: #24231F;
  --jg-text-secondary: #6F695D;
  --jg-text-faint: #8A8478;
  --jg-text-inverse: #FAF8F2;
  /* 金底（品牌实心金）上的深墨字：昼夜恒定 —— 见规则 C（语义色只做数据/标签） */
  --jg-text-on-brand: #17120A;

  /* Brand */
  --jg-brand: #B08A3C;
  --jg-brand-hover: #966F2D;
  --jg-brand-soft: rgba(176, 138, 60, .10);
  --jg-brand-line: rgba(176, 138, 60, .28);

  /* Semantic */
  --jg-cinnabar: #A53A35;
  --jg-jade: #587A70;
  --jg-teal: #304A4A;
  --jg-purple: #625875;
  --jg-blue: #486A7A;
  --jg-success: #4F765B;
  /* --jg-warning 归并到 Design Tokens V1（#B08A3C = 品牌金 · 19 条 §15）；
     原值 #9A6D2F 全站 0 个消费点（.jg-semantic-warning 类亦 0 引用） */
  /* --jg-danger 归并到 Design Tokens V1（#A94A3F）；原值 #A53A35 与 --jg-cinnabar 完全
     同值、属重复定义，消费点已全部改指 --jg-cinnabar（取值不变） */

  /* Border / shadow */
  --jg-border: rgba(80, 65, 40, .14);
  --jg-border-strong: rgba(80, 65, 40, .22);
  --jg-shadow: 0 8px 30px rgba(55, 45, 30, .08);
  --jg-shadow-soft: 0 2px 12px rgba(55, 45, 30, .06);

  /* Form */
  --jg-input-bg: #FBF9F4;
  --jg-input-border: rgba(80, 65, 40, .18);
  --jg-focus: rgba(176, 138, 60, .28);

  /* Decorative */
  --jg-glow-opacity: .05;
  --jg-grid-opacity: .035;

  /* Motion */
  --jg-theme-duration: 220ms;
}

/* ── INK / 夜 ─────────────────────────────────────────────────────────────
   同一套值挂三个来源：用户脚本的 data-theme="ink"、data-jg-theme="ink"，
   以及本仓历史值 data-theme="night"（保持向后兼容，见文件头第 1 条）。 */
html[data-theme="ink"],
body[data-theme="ink"],
html[data-jg-theme="ink"],
body[data-jg-theme="ink"],
html[data-theme="night"],
body[data-theme="night"] {
  color-scheme: dark;

  --jg-bg-page: #080B0C;
  --jg-bg-surface: #111517;
  --jg-bg-surface-soft: #171B1D;
  --jg-bg-elevated: #1B2022;

  --jg-text-primary: #F0E9DA;
  --jg-text-secondary: #AAA292;
  --jg-text-faint: #827C70;
  --jg-text-inverse: #080B0C;
  --jg-text-on-brand: #17120A;

  --jg-brand: #C6A060;
  --jg-brand-hover: #D6B477;
  --jg-brand-soft: rgba(198, 160, 96, .10);
  --jg-brand-line: rgba(198, 160, 96, .26);

  --jg-border: rgba(198, 160, 96, .18);
  --jg-border-strong: rgba(198, 160, 96, .28);
  --jg-shadow: 0 14px 38px rgba(0, 0, 0, .30);
  --jg-shadow-soft: 0 4px 16px rgba(0, 0, 0, .22);

  --jg-input-bg: #0E1213;
  --jg-input-border: rgba(198, 160, 96, .20);
  --jg-focus: rgba(198, 160, 96, .30);

  --jg-glow-opacity: .10;
  --jg-grid-opacity: .045;
}

/* ---------------------------------------------------------
   Global page canvas —— 页面底色只来自令牌
   --------------------------------------------------------- */

html,
body {
  background-color: var(--jg-bg-page);
  color: var(--jg-text-primary);
  transition:
    background-color var(--jg-theme-duration) ease,
    color var(--jg-theme-duration) ease;
}

body {
  margin: 0;
  min-height: 100vh;
}

/* Common app roots. */
body > #root,
body > #__next,
body > main,
body > .app,
body > .site,
[data-app-root] {
  background-color: var(--jg-bg-page);
  color: var(--jg-text-primary);
}

/* ---------------------------------------------------------
   Theme utility classes
   --------------------------------------------------------- */

.jg-page {
  min-height: 100vh;
  background-color: var(--jg-bg-page);
  color: var(--jg-text-primary);
}

.jg-surface {
  background-color: var(--jg-bg-surface);
  color: var(--jg-text-primary);
  border-color: var(--jg-border);
}

.jg-surface-soft {
  background-color: var(--jg-bg-surface-soft);
  color: var(--jg-text-primary);
  border-color: var(--jg-border);
}

.jg-elevated {
  background-color: var(--jg-bg-elevated);
  color: var(--jg-text-primary);
  box-shadow: var(--jg-shadow);
}

.jg-text-primary { color: var(--jg-text-primary); }
.jg-text-secondary { color: var(--jg-text-secondary); }
.jg-text-faint,
.jg-text-muted { color: var(--jg-text-faint); }  /* 旧类名保留，取值不变 */
.jg-brand { color: var(--jg-brand); }

.jg-border {
  border-color: var(--jg-border);
}

.jg-divider {
  height: 1px;
  background-color: var(--jg-border);
}

/* ---------------------------------------------------------
   Theme switch（③）—— 页面上的昼夜按钮
   --------------------------------------------------------- */

.jg-button,
body button[data-jg-theme-toggle] {
  border: 1px solid var(--jg-border);
  background-color: var(--jg-bg-surface);
  color: var(--jg-text-primary);
  transition:
    background-color var(--jg-theme-duration) ease,
    border-color var(--jg-theme-duration) ease,
    color var(--jg-theme-duration) ease;
}

.jg-button:hover,
body button[data-jg-theme-toggle]:hover {
  border-color: var(--jg-brand-line);
  background-color: var(--jg-brand-soft);
  color: var(--jg-brand);
}

/* 顶部导航条是固定品牌深色（不随主题变，见 Nav.tsx 的 inline 深底），
   其中的开关保持"幽灵"样式：不铺 surface 底，否则首页 Hero 上会顶出一个亮块。 */
body nav button[data-jg-theme-toggle] {
  background-color: transparent;
  border-color: rgba(198, 160, 96, .28);
}

body nav button[data-jg-theme-toggle]:hover {
  background-color: rgba(198, 160, 96, .12);
  border-color: rgba(198, 160, 96, .5);
}

/* ---------------------------------------------------------
   【19 条方案 · 点 08/14 + 走查 P0-1（2026-09-20）】
   知识阅读组 / 法律组 / 品牌首页 / 黄历页：不显示昼夜切换按钮
   背景：现有实现是「软锁」—— LOCKED_GROUPS（BRAND/KNOWLEDGE/HUANGLI/
   LEGAL）会把主题强制成默认值，并在 document 捕获期拦掉对
   [data-jg-theme-toggle] 的点击；但**按钮元素仍可见** → 用户看到一个
   点了没反应的按钮（真机走查实测：/ 与 /huangli/ 各 2 枚）。
   点 08 明写「知识阅读页不显示夜间切换按钮」，故此处补上真隐藏。
   范围：KNOWLEDGE / LEGAL（文库、书馆、古籍详情、术语百科、知识图谱、
   FAQ、帮助、隐私、服务条款、关于）＋ BRAND（首页）与 HUANGLI（黄历）。
   BRAND / HUANGLI 于 2026-09-20 走查后并入本规则（业主裁定：锁定即隐藏，
   不留「可见但点了没反应」的按钮）；锁定语义、主题系统、首帧脚本、
   localStorage 键一律不变，只隐藏按钮。
   --------------------------------------------------------- */
html[data-jg-page-group="BRAND"] button[data-jg-theme-toggle],
html[data-jg-page-group="HUANGLI"] button[data-jg-theme-toggle],
html[data-jg-page-group="KNOWLEDGE"] button[data-jg-theme-toggle],
html[data-jg-page-group="LEGAL"] button[data-jg-theme-toggle] {
  display: none !important;
}

/* ---------------------------------------------------------
   Semantic colors: data only, never page canvas
   --------------------------------------------------------- */

.jg-semantic-cinnabar { color: var(--jg-cinnabar); }
.jg-semantic-jade { color: var(--jg-jade); }
.jg-semantic-teal { color: var(--jg-teal); }
.jg-semantic-purple { color: var(--jg-purple); }
.jg-semantic-blue { color: var(--jg-blue); }
.jg-semantic-success { color: var(--jg-success); }
.jg-semantic-warning { color: var(--jg-warning); }
.jg-semantic-danger { color: var(--jg-cinnabar); }

.jg-badge-cinnabar {
  color: var(--jg-cinnabar);
  background: color-mix(in srgb, var(--jg-cinnabar) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--jg-cinnabar) 24%, transparent);
}

.jg-badge-jade {
  color: var(--jg-jade);
  background: color-mix(in srgb, var(--jg-jade) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--jg-jade) 24%, transparent);
}

/* ---------------------------------------------------------
   Knowledge reading area
   --------------------------------------------------------- */

.jg-reading {
  background-color: var(--jg-bg-surface);
  color: var(--jg-text-primary);
}

[data-jg-page-group="KNOWLEDGE"] .jg-reading :where(
  article,
  .article,
  .book-content,
  .markdown-body,
  .prose
) {
  background-color: transparent;
  color: var(--jg-text-primary);
}

/* ---------------------------------------------------------
   Page groups —— 普通页面底色一律取自 PAPER / INK
   --------------------------------------------------------- */

[data-jg-page-group="ENGINE"],
[data-jg-page-group="QUICK"],
[data-jg-page-group="AI"],
[data-jg-page-group="ACCOUNT"] {
  background-color: var(--jg-bg-page);
  color: var(--jg-text-primary);
}

/* ---------------------------------------------------------
   AI atmosphere（唯一允许的局部氛围：推演空间，不是聊天页）
   --------------------------------------------------------- */

html[data-jg-page-group="AI"]::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: var(--jg-glow-opacity);
  background:
    radial-gradient(
      circle at 72% 18%,
      rgba(198, 160, 96, .38),
      transparent 34%
    );
}

/* ---------------------------------------------------------
   Home: BRAND —— 不覆盖 Hero，只固定「首页画布 = 全站唯一的 PAPER 底」
   --------------------------------------------------------- */

/* 首页 .jh-home 自带一套设计包纸色（--h-paper:#F5F2EA，1:1 复刻、零改动），
   但页面画布（body）必须与全站 PAPER 令牌**完全同值** #F4F0E7 ——
   实测曾因首页单独把 --jg-bg-page 设成 #F5F2EA，造成同一屏出现
   244,240,231 与 245,242,234 两个纸白，故此处不再覆盖任何令牌。 */
html[data-jg-page-group="BRAND"] {
  background-color: #080B0C;
}

/* ---------------------------------------------------------
   Huangli: paper core
   --------------------------------------------------------- */

.jg-huangli-core {
  background-color: #FAF8F2;
  color: #24231F;
  border-color: rgba(80, 65, 40, .14);
}

/* =========================================================================
   锁定组回填：BRAND / KNOWLEDGE / HUANGLI / LEGAL 不支持昼夜切换
   （README 页面分组表 switchable=false）
   —— 必须放在 INK 块之后，靠源码顺序压过 [data-theme="ink"]
   ========================================================================= */

html[data-jg-page-group="KNOWLEDGE"],
html[data-jg-page-group="HUANGLI"],
html[data-jg-page-group="LEGAL"] {
  color-scheme: light;

  --jg-bg-page: #F4F0E7;
  --jg-bg-surface: #FAF8F2;
  --jg-bg-surface-soft: #ECE7DC;
  --jg-bg-elevated: #FFFFFF;

  --jg-text-primary: #24231F;
  --jg-text-secondary: #6F695D;
  --jg-text-faint: #8A8478;
  --jg-text-inverse: #FAF8F2;

  --jg-brand: #B08A3C;
  --jg-brand-hover: #966F2D;
  --jg-brand-soft: rgba(176, 138, 60, .10);
  --jg-brand-line: rgba(176, 138, 60, .28);

  --jg-border: rgba(80, 65, 40, .14);
  --jg-border-strong: rgba(80, 65, 40, .22);
  --jg-shadow: 0 8px 30px rgba(55, 45, 30, .08);
  --jg-shadow-soft: 0 2px 12px rgba(55, 45, 30, .06);

  --jg-input-bg: #FBF9F4;
  --jg-input-border: rgba(80, 65, 40, .18);
  --jg-focus: rgba(176, 138, 60, .28);
}

/* 阅读区固定纸境（即使外部 token 被改成 INK 也不变深） */
html[data-jg-page-group="KNOWLEDGE"] {
  --jg-reading-bg: #FAF8F2;
}

/* ---------------------------------------------------------
   Accessibility / motion
   --------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html,
  body {
    transition: none;
  }

  /* 【2026-09-20 · P0：系统「减少动态效果」豁免收窄（业主裁定：PC 首页仪盘永远照转）】
     原写法 `* { … }` 会把共用令牌 .jh-wheel-wrap 下的仪盘四层
     （.orbit 70s / .bagua 42s / .scale 58s / .taiji 22s）与 .center/.glow/.orb
     一并压成 0.01ms（= 视觉停转），并且会顶掉 TaijiWheel.tsx 调速滑杆写入的**行内**时长。
     故收窄为「仪盘子树之外的一切」——其余页面的动效降级照旧。
     ⚠ 不要改成「给仪盘各层加 !important 时长」：那会顶掉行内调速样式。 */
  *:not(.jh-wheel-wrap):not(.jh-wheel-wrap *) {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* ---------------------------------------------------------
   Fallback for browsers without color-mix
   --------------------------------------------------------- */

@supports not (color: color-mix(in srgb, black 10%, white)) {
  .jg-badge-cinnabar {
    background: rgba(165, 58, 53, .08);
    border-color: rgba(165, 58, 53, .22);
  }

  .jg-badge-jade {
    background: rgba(88, 122, 112, .08);
    border-color: rgba(88, 122, 112, .22);
  }
}

/* ---------------------------------------------------------
   中文正文段落规格（业主 2026-09-29 指定）
   每段首行缩进两格 · 段与段之间保留一行的间距
   ⚠️ 只在显式加了 .jg-cn-prose 的容器内生效 —— 既有 .prose 页面（目前按 <br/> 渲染、
      无 <p> 元素）完全不受影响，仍以「先保住已验收版式」为准。
   --------------------------------------------------------- */

.jg-cn-prose p {
  text-indent: 2em;               /* 首行缩进两格 */
  margin: 0 0 1em 0;              /* 段间一行 */
  line-height: 1.9;               /* 行距，配合上面留出"一行"的视觉间隔 */
  text-align: justify;
}
.jg-cn-prose p:last-child { margin-bottom: 0; }

/* 标题、引用、列表、表格、代码等不参与缩进 */
.jg-cn-prose :where(h1, h2, h3, h4, h5, h6, blockquote, ul, ol, li, pre, table, figure, figcaption) {
  text-indent: 0;
}
.jg-cn-prose :where(h2, h3) { margin: 1.6em 0 0.6em; }
.jg-cn-prose :where(ul, ol) { margin: 0 0 1em; padding-left: 1.6em; }
.jg-cn-prose blockquote { margin: 0 0 1em; }
.jg-cn-prose li > p { text-indent: 0; margin: 0; }
.jg-cn-prose hr { margin: 1.5em 0; border: none; border-top: 1px solid var(--jg-border, #e6ddc9); }
.jg-cn-prose .jg-page-note { display: none; }   /* 页码来源注释不上屏（HTML 注释本来也不显示） */