/* ============================================================
   Project NOVA 文庫 — tokens.css
   観測所（NOVA）案：深い藍〜漆黒のインク × 黄銅(ゴールド)の箔
   ------------------------------------------------------------
   二軸テーマ合成（ライト/ダーク × 作品別アクセント）。
   コンポーネントは生hexを読まず、必ず意味トークン経由で読む。
   詠み出し順：原色 → ライト意味 → ダーク意味 → 作品別。
   ------------------------------------------------------------
   アクセント解決の要：
   `--accent` は data-book を持つ要素の「スコープで」再解決する。
   これにより (a) LP（html に data-book）と (b) 書店トップの各カード
   （要素ごとに別 data-book）の両方で正しい色が解決される。
   ============================================================ */

/* ===== Layer 0 — 原色ランプ（直接は使わない） ===== */
:root {
  --paper:        #f1efe8;  /* archival ivory（クリーム常套を避けやや締めた） */
  --paper-2:      #f8f6f0;
  --paper-sink:   #e7e3d8;
  --ink:          #1b2330;  /* 深い藍墨（純黒でない＝観測所の製図インク） */

  --night:        #0f141c;  /* 深い観測夜 */
  --night-2:      #161d28;
  --night-3:      #1f2835;
  --parch:        #e7e3d6;  /* 羊皮紙テキスト */

  /* ハウス・アクセント＝黄銅/ゴールド */
  --brass-l:      #8a6516;  /* ライト：深い真鍮 */
  --gold-d:       #d8b063;  /* ダーク：灯る金 */

  /* 作品別アクセント（ライト/ダークのペア） */
  --kusou-l:    #38506e;  --kusou-d:    #93accf;  /* 空想の病：臨床のスレートブルー */
  --shisha-l:   #9e2f2f;  --shisha-d:   #e0666e;  /* 死者専用：滲む紅 */
  --hakoniwa-l: #8f4524;  --hakoniwa-d: #d68a5f;  /* 箱庭：鉄錆の赤 */
  --shiori-l:   #8a5e10;  --shiori-d:   #e1ad5e;  /* 千の栞：温かな琥珀 */

  --contrast-on-light: #fbf9f2;  /* 暗いアクセント面に乗る明色テキスト */
  --contrast-on-dark:  #0f141c;  /* 明るいアクセント面に乗る暗色テキスト */
}

/* ===== Layer 1 — ライト（既定）の意味トークン ===== */
:root {
  color-scheme: light dark;

  --bg:          var(--paper);
  --surface:     var(--paper-2);
  --surface-2:   var(--paper-sink);
  --text:        var(--ink);
  --text-muted:  #5a6472;
  --border:      rgba(27, 35, 48, .14);
  --hairline:    rgba(27, 35, 48, .22);
  --shadow:      0 1px 2px rgba(20, 26, 38, .08), 0 12px 34px rgba(20, 26, 38, .07);
  --shadow-lift: 0 2px 6px rgba(20, 26, 38, .10), 0 22px 60px rgba(20, 26, 38, .12);

  /* ハウス・アクセント解決（data-book の無い :root 用） */
  --accent-l:        var(--brass-l);
  --accent-d:        var(--gold-d);
  --accent:          var(--accent-l);
  --accent-contrast: var(--contrast-on-light);
  --accent-faint:    color-mix(in srgb, var(--accent-l) 10%, transparent);
  --accent-line:     color-mix(in srgb, var(--accent-l) 42%, transparent);

  /* 寸法・書体 */
  --maxw:      74rem;
  --reading:   42rem;
  --radius:    13px;
  --radius-sm: 8px;
  --gut:       clamp(1.25rem, 4vw, 3rem);

  --font-serif: "Shippori Mincho", "Noto Serif JP", "Hiragino Mincho ProN", serif;
  --font-sans:  "Zen Kaku Gothic New", system-ui, "Hiragino Sans", "Noto Sans JP", sans-serif;
  --font-latin: "Newsreader", "Shippori Mincho", Georgia, serif;

  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* ===== Layer 2 — ダークの意味トークン（surface とハウス・アクセント variant） ===== */
[data-theme="dark"] {
  --bg:          var(--night);
  --surface:     var(--night-2);
  --surface-2:   var(--night-3);
  --text:        var(--parch);
  --text-muted:  #99a3b3;
  --border:      rgba(231, 227, 214, .14);
  --hairline:    rgba(231, 227, 214, .22);
  --shadow:      0 1px 2px rgba(0, 0, 0, .5), 0 14px 40px rgba(0, 0, 0, .42);
  --shadow-lift: 0 2px 8px rgba(0, 0, 0, .55), 0 26px 70px rgba(0, 0, 0, .5);

  --accent:          var(--accent-d);
  --accent-contrast: var(--contrast-on-dark);
  --accent-faint:    color-mix(in srgb, var(--accent-d) 10%, transparent);
  --accent-line:     color-mix(in srgb, var(--accent-d) 42%, transparent);
}

/* ===== Layer 3a — 作品別のアクセント・ペアを設定 ===== */
[data-book="kusou"]    { --accent-l: var(--kusou-l);    --accent-d: var(--kusou-d); }
[data-book="shisha"]   { --accent-l: var(--shisha-l);   --accent-d: var(--shisha-d); }
[data-book="hakoniwa"] { --accent-l: var(--hakoniwa-l); --accent-d: var(--hakoniwa-d); }
[data-book="shiori"]   { --accent-l: var(--shiori-l);   --accent-d: var(--shiori-d); }

/* ===== Layer 3b — data-book スコープでアクセントを再解決 =====
   これがカード単位・ページ単位の両方を正しく解決する肝。 */
[data-book] {
  --accent:          var(--accent-l);
  --accent-contrast: var(--contrast-on-light);
  --accent-faint:    color-mix(in srgb, var(--accent-l) 10%, transparent);
  --accent-line:     color-mix(in srgb, var(--accent-l) 42%, transparent);
}
/* ダーク時：html 自身が data-book を持つ LP（compound）と、
   ダーク html 配下のカード（descendant）の両方を覆う */
[data-theme="dark"][data-book],
[data-theme="dark"] [data-book] {
  --accent:          var(--accent-d);
  --accent-contrast: var(--contrast-on-dark);
  --accent-faint:    color-mix(in srgb, var(--accent-d) 10%, transparent);
  --accent-line:     color-mix(in srgb, var(--accent-d) 42%, transparent);
}