/* =========================================================
   tokens.css — デザイントークン（:root 変数）
   FastDoctor 参考の新デザイン（ClinicSpot リブランド）。
   参考カラー: ティール #2bb3a4 / 深緑テキスト #16302c。
   ========================================================= */
:root{
  /* Brand（ティール系） */
  --cs-primary:#2bb3a4;        /* CTA・ブランドマーク */
  --cs-primary-deep:#0f9b8e;   /* アイコン線・強調 */
  --cs-primary-ink:#149e8f;    /* 数値・リンク強調 */
  --cs-primary-dark:#0a6f66;   /* hover */

  /* テキスト */
  --cs-ink:#16302c;            /* 見出し・強い本文 */
  --cs-body:#3c4f4a;           /* 本文 */
  --cs-body-2:#4a5e5a;         /* やや薄い本文 */
  --cs-sub:#5a6e6a;            /* 補足本文 */
  --cs-mute:#7d8d89;           /* ラベル・注釈 */
  --cs-mute-2:#9aa5a1;         /* 最も薄い注釈 */
  --cs-arrow:#9dc3bc;          /* リスト矢印 */

  /* 背景 */
  --cs-bg:#ffffff;
  --cs-mint:#eaf6f4;           /* アイコン背景 */
  --cs-mint-1:#f7fbfa;         /* カード背景 */
  --cs-mint-2:#f3faf9;         /* セクション背景（淡） */
  --cs-mint-3:#eef8f6;         /* セクション背景（やや強） */
  --cs-mint-4:#e4f4f1;         /* 比較表ハイライト */
  --cs-fv:#dfeeec;             /* FV 背景 */

  /* ボーダー */
  --cs-line:#e2ece9;
  --cs-line-2:#eef4f3;
  --cs-line-3:#d3e7e3;

  /* ステータス */
  --cs-danger:#d96060; --cs-danger-bg:#fff5f5; --cs-danger-line:#f3d3d3;
  --cs-warn:#d98118;   --cs-warn-bg:#fff2e0;
  --cs-hl:#bdeee5;     /* マーカー（ハイライト） */
  --cs-hl-yellow:#ffe27a;
  --cs-hl-yellow-2:#fff6b8;

  /* 角丸 */
  --cs-r-sm:9px; --cs-r-md:14px; --cs-r-lg:18px; --cs-r-xl:22px; --cs-r-pill:999px;

  /* シャドウ */
  --cs-shadow-cta:0 14px 26px -12px rgba(43,179,164,.6);
  --cs-shadow-card:0 18px 40px -22px rgba(15,48,44,.45);

  /* レイアウト（SPフレーム） */
  --cs-frame-max:440px;
  --cs-rail:240px;
  --cs-stage-bg:#e8edec;       /* PC背景（デザイン body 背景） */

  /* フォント */
  --cs-font:"Zen Kaku Gothic New",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium","Meiryo",system-ui,sans-serif;
  --cs-font-num:"Outfit","Zen Kaku Gothic New",sans-serif;
}