/* ============================================
   Kyotei sites — デザイントークン
   テーマ: satan（①さーたん / 量産型パステル）
   ※ ②mero テーマは :root[data-theme="mero"] で追加予定
   ============================================ */

:root {
  /* カラー */
  --color-title: #c3707a;          /* メインタイトル */
  --color-title-en: #575757;       /* 英字サブタイトル */
  --color-text: #505050;           /* 本文 */
  --color-heading: #c56d8a;        /* リスト見出し */
  --color-heading-sub: #8a6a72;    /* 締め文言 */
  --color-accent-heart: #d99bb0;   /* ♡ */
  --color-gold: #d9b25e;           /* 金あしらい */
  --color-deco-heart: #e6a6bd;

  /* 下層ページ（おすすめサイト / 予想の買い方） */
  --color-site-name: #c56d8a;      /* サイト名（2026-07-29 Figma更新で金茶#9c7b3f→ピンク） */
  --color-badge: #848484;          /* 番号バッジ（2026-07-29 Figma更新でピンクグラデ→グレー） */
  --color-site-kana: #8f8f8f;      /* 読み仮名 */
  --color-icon-line: #f08ca6;      /* 手描きアイコン線 */
  --color-dotted: #f2b8c6;         /* 点線区切り */
  --color-back: #e0819a;           /* もどるボタン文字 */
  --color-link: #4a87bd;           /* 本文中リンク（やわらかいブルー・下線なしで区別する） */
  --color-row-bg: rgba(255, 255, 255, 0.78); /* 行カード背景 */
  --color-row-border: #fbdbe3;     /* 行カード/丸枠の細線 */

  --color-card-bg: #f8f8f8;        /* 白カード */
  --color-card-border: #d7cda9;    /* 金縁 */
  --color-panel: #ffebed;          /* ピンクパネル */
  --color-hint-border: #ffd9d9;    /* ヒント枠 */

  --grad-icon: linear-gradient(to bottom, #f9aebe, #ffa2b6);
  --grad-btn: linear-gradient(to bottom, #ef93a7, #ffa2b6);
  --grad-brand-text: linear-gradient(174deg, #e8adc2 8.5%, #c56d8a 91.5%);

  --shadow-card: 0 -1px 8px rgba(200, 150, 170, 0.2);

  /* フォント */
  --font-serif: "Zen Old Mincho", serif;
  --font-sans: "Noto Sans JP", sans-serif;
  --font-script: "Tangerine", cursive;
  --font-brand: "Zen Antique Soft", serif;

  /* 寸法 */
  --radius-card: 20px;
  --radius-panel: 4px;
  --radius-hint: 13px;
  --radius-btn: 100px;
  --page-max-width: 430px; /* デザイン390px基準・スマホ幅まで許容 */
}