/* Apple Design System Tokens
 * Source: DESIGN-apple.md
 * All variables prefixed --apple-* to isolate from existing tokens.
 */
:root {
  /* === COLORS === */
  --apple-primary: #0066cc;
  --apple-primary-focus: #0071e3;
  --apple-primary-on-dark: #2997ff;
  --apple-ink: #1d1d1f;
  --apple-body: #1d1d1f;
  --apple-body-on-dark: #ffffff;
  --apple-body-muted: #cccccc;
  --apple-ink-muted-80: #333333;
  --apple-ink-muted-48: #7a7a7a;
  --apple-divider-soft: #f0f0f0;
  --apple-hairline: #e0e0e0;
  --apple-canvas: #ffffff;
  --apple-canvas-parchment: #f5f5f7;
  --apple-surface-pearl: #fafafc;
  --apple-surface-tile-1: #272729;
  --apple-surface-tile-2: #2a2a2c;
  --apple-surface-tile-3: #252527;
  --apple-surface-black: #000000;
  --apple-surface-chip-translucent: rgba(210, 210, 215, 0.64);

  /* === SPACING (8px base) === */
  --apple-spc-xxs: 4px;
  --apple-spc-xs: 8px;
  --apple-spc-sm: 12px;
  --apple-spc-md: 17px;
  --apple-spc-lg: 24px;
  --apple-spc-xl: 32px;
  --apple-spc-xxl: 48px;
  --apple-spc-section: 80px;

  /* === RADIUS === */
  --apple-r-none: 0;
  --apple-r-xs: 5px;
  --apple-r-sm: 8px;
  --apple-r-md: 11px;
  --apple-r-lg: 18px;
  --apple-r-pill: 9999px;

  /* === FONT === */
  /* SF Pro (system font on Apple devices) → Inter (non-Apple fallback) → Pretendard (Korean) */
  --apple-font-display: "SF Pro Display", Inter, "Pretendard Variable", Pretendard,
                        system-ui, -apple-system, sans-serif;
  --apple-font-text: "SF Pro Text", Inter, "Pretendard Variable", Pretendard,
                     system-ui, -apple-system, sans-serif;

  /* === SHADOW === */
  --apple-shadow-product: rgba(0, 0, 0, 0.22) 3px 5px 30px 0;
}