/* =========================================================
   tokens.css ── デザイン変数（設定ファイル）
   
   ★ よく触る設定はここだけ：
   
   フォントを変える
     → --font-heading の1行目のフォント名を変更
     → functions.php の $font_family も同じ名前に変更
   
   文字の太さを変える
     → --font-weight-heading（h1〜h4全般）
     → --font-weight-title（ページタイトル・記事タイトル）
   
   メインカラーを変える
     → --shelf-wood（ゴールド系アクセント）
   
   コンテンツ最大幅を変える
     → --maxw
========================================================= */

/* =========================================================
   らいぶらり Ver2 / library.css
   2026-03 改訂版
========================================================= */

/* =========================================================
   Google Fonts ── 見出し用のやわらかいゴシック
   M PLUS Rounded 1c : 丸みのある日本語ゴシック（見出し・UI）
   ※ @import は必ず CSS の最上部に
========================================================= */

/* =========================================================
   00 Design Tokens  ── バターイエロー図書館・淡色版
========================================================= */
:root {
  /* ── ベースカラー：ほぼ白に近い極薄クリームイエロー ── */
  --paper:         #fefdf6;
  --paper-2:       #fffefb;
  --paper-3:       #faf6e8;
  --ink:           #302c20;
  --ink-soft:      #504830;
  --muted:         #8c7e5a;
  --muted-faint:   #bfb08a;
  --line:          #f0e8c0;
  --line-strong:   #e4d898;

  /* ── アクセント：淡い蜂蜜色 ── */
  --shelf-wood:    #d4a840;
  --shelf-wood-2:  #b88c28;
  --gold:          #d4aa48;
  --gold-soft:     rgba(212,170,72,.12);

  /* ── 影：ごく薄いウォームシャドウ ── */
  --shadow-xs:     0 2px 12px rgba(120, 90, 20, .05);
  --shadow-sm:     0 6px 22px rgba(120, 90, 20, .07);
  --shadow:        0 14px 38px rgba(120, 90, 20, .09);
  --shadow-lg:     0 22px 54px rgba(120, 90, 20, .12);

  /* ── 角丸：ふっくら ── */
  --radius-xs:     14px;
  --radius-sm:     18px;
  --radius:        24px;
  --radius-lg:     34px;

  --maxw:          1040px;
  --maxw-article:  1120px;
  --pad:           clamp(16px, 4vw, 42px);

  --fz-body:       17px;
  --fz-body-sp:    16px;
  --fz-talk:       15px;
  --fz-meta:       13px;
  --lh-body:       2.1;
  --lh-tight:      1.65;

  /* ── キャラクターカラー（スカイ基調で各キャラを差別化） ── */
  --shimama-main:  #f0a050;   /* シママ：あたたかいオレンジ */
  --shimama-light: #fff7ed;
  --shimama-glow:  rgba(240,160,80,.22);

  --stork-main:    #e07880;   /* ストーク：コーラルレッド */
  --stork-light:   #fff2f3;
  --stork-glow:    rgba(224,120,128,.22);

  --fabee-main:    #f0b840;   /* ファビー：サニーイエロー */
  --fabee-light:   #fffbee;
  --fabee-glow:    rgba(240,184,64,.22);

  --deeple-main:   #5aaed4;   /* ディープル：スカイブルー */
  --deeple-light:  #eaf6fc;
  --deeple-glow:   rgba(90,174,212,.22);

  /* ── Typography ──────────────────────────────────────
     本文   ：元のオリジナル設定（Hiragino Sans / Noto Sans JP）
     見出し ：M PLUS Rounded 1c（丸ゴシックで親しみやすく）
     UI     ：元のオリジナル設定
  ──────────────────────────────────────────────────── */
  --font-body:
    "Hiragino Sans",
    "Hiragino Kaku Gothic ProN",
    "Noto Sans JP",
    "Yu Gothic",
    sans-serif;

  --font-heading:
    "M PLUS Rounded 1c",
    "Hiragino Maru Gothic ProN",
    "Rounded Mplus 1c",
    "Noto Sans JP",
    sans-serif;

  --font-ui:
    "Hiragino Sans",
    "Noto Sans JP",
    "Yu Gothic",
    sans-serif;

  /* ── フォント太さ：ここを変えると見出し全体に反映 ── */
  --font-weight-heading: 700;
  --font-weight-title:   700;  /* ページタイトル（らい・ぶらり, 組織と仕事など） */
}