@charset "UTF-8";
/* 0. カラーパレット・フォント — 夜明け前の海
   ※ SWELL カスタマイザー「基本カラー」と同期推奨
   メインカラー = --depth-700 (#1C3A52)
   テキストカラー = --sys-text-primary (#1C2E3D)
   リンクカラー = --horizon-cta (#1B5E8C)
   背景色 = --mist-50 (#F8FAFB)
   アクセント（あれば）= --sacred-gold (#A8956A)
   リンクホバー（あれば）= --horizon-hover (#134A70)
*/
:root {
  /* DEPTH — 深海・信頼の柱（メインカラーと同期） */
  --depth-900: #0B1E2D;
  --depth-800: #163045;  /* depth-700 hover / ボタン押下時の濃色 */
  --depth-700: #1C3A52;
  --depth-500: #2E6388;
  --depth-300: #5B92B3;
  --depth-100: #C3DBE9;

  /* MIST — 霞・安らぎの層（背景色と同期） */
  --mist-900: #8CA5B4;
  --mist-600: #B8CDD8;
  --mist-300: #DDE9EF;
  --mist-100: #F0F5F8;
  --mist-50:  #F8FAFB;

  /* SHORE — 浜辺・温もりの差し色 */
  --shore-warm: #F2EDE8;
  --shore-sand: #D4C4B0;
  --shore-stone: #8B7D6B;

  /* HORIZON — 水平線・アクション（リンクカラー・ホバーと同期） */
  --horizon-cta:   #1B5E8C;
  --horizon-hover: #134A70;
  --horizon-light: #E8F2F9;

  /* SACRED — 厳かさ・葬送の金（アクセントカラー推奨） */
  --sacred-gold:  #A8956A;
  --sacred-light: #D4C49A;

  /* SYSTEM — テキスト・ボーダー・ステータス（テキストカラーと同期） */
  --sys-text-primary:   #1C2E3D;
  --sys-text-secondary: #4A6070;
  --sys-text-tertiary:  #7A98AA;
  --sys-border-light:   #D8E6EE;
  --sys-border-mid:     #A8C4D4;
  --sys-success:        #2D6B55;
  --sys-caution:        #7A5C2E;
  --sys-error:          #7A2E2E;

  /* 派生：地・影（パレット由来のみ） */
  --overlay-dark:       rgba(11, 30, 45, 0.85);   /* depth-900 */
  --shadow-soft:        rgba(11, 30, 45, 0.06);
  --shadow-mid:         rgba(11, 30, 45, 0.1);
  --shadow-cta:         rgba(27, 94, 140, 0.15);  /* horizon-cta */

  /* フォント（Google Fonts で読み込み） */
  --font-serif:  'Shippori Mincho B1', serif;
  --font-sans:   'Zen Kaku Gothic New', sans-serif;
}

/* サイト全体のベース（テキスト・背景はカスタマイザーと同一値） */
body {
  color: var(--sys-text-primary);
  background-color: var(--mist-50);
  font-family: var(--font-sans);
}