/**
 * TTDS v2.0 Design Tokens — Layer 1
 * Premium visual polish — Canvas · Obsidian · Signal Indigo
 * Do not add component rules here.
 */
:root {
  /* Color — refined contrast & warmth */
  --tt-canvas: #fcfcfd;
  --tt-canvas-subtle: #f8f8fa;
  --tt-canvas-muted: #f0f0f4;
  --tt-obsidian: #0c0c0e;
  --tt-obsidian-soft: #1a1a1f;
  --tt-graphite: #3d3d47;
  --tt-slate: #64646f;
  --tt-mist: #9494a0;
  --tt-line: #ececf0;
  --tt-line-strong: #d8d8e0;
  --tt-signal: #4b49ff;
  --tt-signal-hover: #3836eb;
  --tt-signal-soft: rgba(75, 73, 255, 0.07);
  --tt-signal-ring: rgba(75, 73, 255, 0.32);
  --tt-signal-muted: rgba(75, 73, 255, 0.04);
  --tt-pulse: #6d5cff;
  --tt-success: #0d9a52;
  --tt-success-soft: rgba(13, 154, 82, 0.08);
  --tt-warning: #a67c00;
  --tt-warning-soft: rgba(166, 124, 0, 0.08);
  --tt-danger: #c62828;
  --tt-danger-soft: rgba(198, 40, 40, 0.08);
  --tt-info: #245bdb;
  --tt-info-soft: rgba(36, 91, 219, 0.07);
  --tt-glass: rgba(252, 252, 253, 0.88);

  /* Typography families */
  --tt-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --tt-font-ar: "IBM Plex Sans Arabic", "Noto Sans Arabic", sans-serif;
  --tt-font-mono: ui-monospace, SFMono-Regular, "Cascadia Code", monospace;

  /* Type scale */
  --tt-text-2xs: 0.6875rem;
  --tt-text-xs: 0.75rem;
  --tt-text-sm: 0.875rem;
  --tt-text-base: 1rem;
  --tt-text-md: 0.9375rem;
  --tt-text-lg: 1.125rem;
  --tt-text-xl: 1.25rem;
  --tt-text-2xl: 1.5rem;
  --tt-text-3xl: 1.875rem;
  --tt-text-4xl: 2.25rem;
  --tt-text-5xl: 3rem;
  --tt-text-display: clamp(2.625rem, 4.8vw, 4rem);

  /* Type rhythm */
  --tt-leading-tight: 1.15;
  --tt-leading-snug: 1.35;
  --tt-leading-normal: 1.6;
  --tt-leading-relaxed: 1.72;
  --tt-tracking-tighter: -0.04em;
  --tt-tracking-tight: -0.025em;
  --tt-tracking-normal: -0.015em;
  --tt-tracking-wide: 0.04em;
  --tt-tracking-eyebrow: 0.1em;

  /* Spacing — 8px grid + premium section rhythm */
  --tt-space-1: 0.25rem;
  --tt-space-2: 0.5rem;
  --tt-space-3: 0.75rem;
  --tt-space-4: 1rem;
  --tt-space-5: 1.25rem;
  --tt-space-6: 1.5rem;
  --tt-space-8: 2rem;
  --tt-space-10: 2.5rem;
  --tt-space-12: 3rem;
  --tt-space-16: 4rem;
  --tt-space-20: 5rem;
  --tt-space-24: 6rem;
  --tt-space-32: 8rem;
  --tt-section-sm: 5rem;
  --tt-section-md: 7rem;
  --tt-section-lg: 9rem;

  /* Radius — softer premium corners */
  --tt-radius-sm: 8px;
  --tt-radius-md: 12px;
  --tt-radius-lg: 16px;
  --tt-radius-xl: 22px;
  --tt-radius-2xl: 30px;
  --tt-radius-full: 9999px;

  /* Shadow — quieter elevation */
  --tt-shadow-xs: 0 1px 2px rgba(12, 12, 14, 0.03);
  --tt-shadow-sm: 0 2px 12px rgba(12, 12, 14, 0.05);
  --tt-shadow-md: 0 8px 32px rgba(12, 12, 14, 0.07);
  --tt-shadow-lg: 0 20px 48px rgba(12, 12, 14, 0.09);
  --tt-shadow-signal: 0 6px 24px rgba(75, 73, 255, 0.14);

  /* Motion */
  --tt-dur-instant: 100ms;
  --tt-dur-fast: 180ms;
  --tt-dur-base: 300ms;
  --tt-dur-slow: 500ms;
  --tt-dur-slower: 680ms;
  --tt-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --tt-ease-em: cubic-bezier(0.16, 1, 0.3, 1);
  --tt-ease-exit: cubic-bezier(0.4, 0, 1, 1);

  /* Layout */
  --tt-header-h: 76px;
  --tt-header-h-m: 68px;
  --tt-container: 1280px;
  --tt-prose: 680px;
  --tt-touch: 48px;

  /* Z-index */
  --tt-z-sticky-buy: 90;
  --tt-z-header: 100;
  --tt-z-overlay: 200;
  --tt-z-modal: 300;
  --tt-z-toast: 400;

  /* Astra bridge aliases */
  --tt-accent: var(--tt-signal);
  --tt-accent-hover: var(--tt-signal-hover);
  --tt-accent-soft: var(--tt-signal-soft);
  --tt-accent-ring: var(--tt-signal-ring);
}