/* デザイントークン — 色・サイズ・シャドウの単一ソース */
:root {
  /* Brand colors */
  --c-primary:        #4F46E5;
  --c-primary-light:  #EEF2FF;
  --c-primary-hover:  #4338CA;

  /* Semantic: 現実/理想/提案 */
  --c-reality:        #DC2626;
  --c-reality-light:  #FEE2E2;
  --c-ideal:          #16A34A;
  --c-ideal-light:    #DCFCE7;
  --c-proposal:       #2563EB;
  --c-proposal-light: #DBEAFE;

  /* Status */
  --c-success:  #16A34A;
  --c-warning:  #D97706;
  --c-error:    #DC2626;

  /* Surfaces */
  --c-bg:        #F8FAFC;
  --c-surface:   #FFFFFF;
  --c-surface-2: #F1F5F9;
  --c-border:    #E2E8F0;

  /* Text */
  --c-text:      #1E293B;
  --c-text-sub:  #475569;
  --c-text-mute: #94A3B8;

  /* Step indicator */
  --c-step-done:   #16A34A;
  --c-step-active: #4F46E5;
  --c-step-todo:   #CBD5E1;

  /* Spacing scale */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  /* Border radius */
  --r-sm: 4px; --r-md: 8px; --r-lg: 12px; --r-xl: 20px; --r-full: 9999px;

  /* Shadows */
  --sh-xs: 0 1px 2px rgba(0,0,0,.06);
  --sh-sm: 0 1px 4px rgba(0,0,0,.10);
  --sh-md: 0 4px 16px rgba(0,0,0,.12);
  --sh-lg: 0 8px 32px rgba(0,0,0,.18);

  /* Typography */
  --font: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
  --font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;

  /* Layout */
  --header-h:  56px;
  --stepbar-h: 60px;
  --nav-h:     56px;
  --main-h:    calc(100vh - var(--header-h) - var(--stepbar-h) - var(--nav-h));

  /* Transitions */
  --ease: 0.18s ease;
}