/* CSS変数定義 - Foundation トークン
 * 注: 本ファイルは tools/common/css/variables.css と Foundation 層を同期する。
 *     Brand 層（"放課後の遊び場" 専用トークン）は brand.css 側に分離。
 *     差分許容: --background-color のみ（gym=紙質ベージュ #FFF8E7 / tools=#FDF5E6）。
 */

/* === FOUNDATION SYNC START ===
 * このマーカー〜FOUNDATION SYNC END の間は tools と gym で同一に保つ Foundation 層。
 * gym 側は scripts/sync-foundation.sh で tools 側からこの範囲をコピーする。
 * gym 独自値（--background-color の紙質ベージュ等）は END 以降に置くこと。
 */
:root {
  /* ============================================
     Brand Colors - Cyan & Black テーマ
  ============================================ */
  --primary-color: #006064;        /* シアン（濃いめ） */
  --secondary-color: #00838F;      /* シアン（少し明るめ・ホバー用） */
  --accent-color: #546E7A;         /* ブルーグレー（リセットボタン等のサブアクション用） */
  --background-color: #FDF5E6;     /* ソフトベージュ（落ち着いたノートの色） */
  --text-color: #000000;           /* 黒（はっきり読みやすい文字） */
  --white: #FFFFFF;

  /* ============================================
     Grayscale
  ============================================ */
  --gray-lightest: #FAFAFA;
  --gray-lighter: #F5F5F5;
  --gray-light: #F0F0F0;
  --gray: #E0E0E0;
  --gray-dark: #999999;
  --gray-darker: #666666;
  --gray-darkest: #000000;

  /* ============================================
     Semantic Colors
  ============================================ */
  --success-color: #4CAF50;
  --warning-color: #F57C00;        /* 濃いオレンジ（シアンと相性の良い補色） */
  --danger-color: #F44336;
  --info-color: #0097A7;           /* 明るいシアン（情報・全画面表示用） */

  /* ============================================
     Surface Tints（背景用の淡い色・アラート等）
  ============================================ */
  --success-tint: #E8F5E9;
  --warning-tint: #FFF3E0;
  --danger-tint: #FFEBEE;
  --info-tint: #E3F2FD;

  /* ============================================
     Border Radius
  ============================================ */
  --border-radius: 8px;
  --border-radius-large: 12px;
  --border-radius-small: 4px;
  --border-radius-pill: 999px;

  /* ============================================
     Shadow
  ============================================ */
  --shadow-small: 0 2px 5px rgba(0, 0, 0, 0.05);
  --shadow-medium: 0 2px 10px rgba(0, 0, 0, 0.05);
  --shadow-large: 0 4px 15px rgba(0, 55, 100, 0.15);
  --shadow-xlarge: 0 10px 40px rgba(0, 0, 0, 0.1);

  /* ============================================
     Spacing
  ============================================ */
  --spacing-xs: 5px;
  --spacing-sm: 10px;
  --spacing-md: 15px;
  --spacing-lg: 20px;
  --spacing-xl: 30px;
  --spacing-xxl: 40px;

  /* ============================================
     Typography - Font Family
  ============================================ */
  --font-family: 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', Tahoma, sans-serif;
  --font-family-mono: 'Courier New', monospace;

  /* ============================================
     Typography - Type Scale
  ============================================ */
  --fs-h1: 1.8rem;
  --fs-h2: 1.4rem;
  --fs-h3: 1.2rem;
  --fs-h4: 1.1rem;
  --fs-lead: 1.05rem;
  --fs-body: 1rem;
  --fs-sub: 0.9rem;
  --fs-caption: 0.85rem;
  --fs-timer: 8rem;

  /* ============================================
     Typography - Font Weight
  ============================================ */
  --fw-black: 800;
  --fw-bold: 700;
  --fw-semibold: 600;
  --fw-regular: 400;

  /* ============================================
     Motion
  ============================================ */
  --transition-smooth: all 0.3s ease;
  --focus-ring: 0 0 0 3px rgba(0, 96, 100, 0.15);
  --hover-lift-button: -2px;
  --hover-lift-card: -4px;
}
/* === FOUNDATION SYNC END === */

/* gym 独自値（Brand 層との接続点） — sync-foundation.sh では上書きされない */
:root {
  --background-color: #FFF8E7;     /* 紙質ベージュ（"放課後の遊び場" 地色 / Brand 層 --gym-color-bg-base と同値） */
}