:root {
  --color-primary:      #0f6bba;
  --color-primary-dark: #0a5294;
  --color-surface:      #f8fafc;
  --color-surface-alt:  #eff6ff;
  --color-text:         #0f172a;
  --color-subtext:      #64748b;
  --color-border:       #e2e8f0;
  --color-white:        #ffffff;

  --font-base: 'Noto Sans JP', sans-serif;

  --spacing-xs: 0.5rem;
  --spacing-sm: 1rem;
  --spacing-md: 2rem;
  --spacing-lg: 4rem;
  --spacing-xl: 6rem;

  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;

  --shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
}
