:root {
  --ds-font-body: "DM Sans", "Segoe UI", sans-serif;
  --ds-font-display: "Plus Jakarta Sans", "DM Sans", sans-serif;
  --ds-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --ds-bg-app: #101318;
  --ds-bg-app-alt: #181c24;
  --ds-bg-app-glow: rgba(56, 189, 248, 0.12);
  --ds-bg-app-glow-alt: rgba(148, 163, 184, 0.1);
  --ds-bg-subtle: #f3f6fa;
  --ds-bg-sidebar: #fbfcfe;
  --ds-bg-topbar: #fbfcfe;
  --ds-bg-card: #fcfcfd;
  --ds-bg-card-alt: #f8fafc;
  --ds-bg-raised: #ffffff;
  --ds-bg-selected: rgba(14, 165, 233, 0.08);

  --ds-border: #dbe3ec;
  --ds-border-strong: #cad4e0;

  --ds-text: #0f172a;
  --ds-text-body: #334155;
  --ds-text-muted: #64748b;
  --ds-text-soft: #94a3b8;
  --ds-text-canvas: #f8fbff;
  --ds-text-canvas-muted: #c6d0dc;

  --ds-accent: #0284c7;
  --ds-accent-strong: #0369a1;
  --ds-accent-soft: rgba(2, 132, 199, 0.08);
  --ds-bg-accent: var(--ds-accent);
  --ds-info: #0ea5e9;
  --ds-success: #10b981;
  --ds-warning: #f59e0b;
  --ds-danger: #ef4444;
  --ds-focus: rgba(14, 165, 233, 0.22);

  --ds-accent-emerald: #10b981;
  --ds-accent-amber: #f59e0b;
  --ds-accent-pink: #ec4899;
  --ds-accent-cyan: #06b6d4;

  --ds-shadow-card: 0 1px 2px rgba(15, 23, 42, 0.05), 0 18px 38px rgba(15, 23, 42, 0.06);
  --ds-shadow-soft: 0 24px 56px rgba(2, 6, 23, 0.18);
  --ds-shadow-accent: 0 18px 38px rgba(37, 99, 235, 0.18);

  --ds-radius-sm: 0.5rem;
  --ds-radius-md: 0.75rem;
  --ds-radius-lg: 1rem;
  --ds-radius-xl: 1.25rem;
  --ds-radius-pill: 999px;

  --ds-space-1: 0.25rem;
  --ds-space-2: 0.5rem;
  --ds-space-3: 0.75rem;
  --ds-space-4: 1rem;
  --ds-space-5: 1.25rem;
  --ds-space-6: 1.5rem;
  --ds-space-7: 1.75rem;
  --ds-space-8: 2rem;

  --ds-motion-fast: 150ms;
  --ds-motion-base: 200ms;
  --ds-motion-slow: 300ms;
  --ds-motion-ease: cubic-bezier(0.4, 0, 0.2, 1);

  /* Shared layout system */
  --ds-layout-shell-sidebar: clamp(17rem, 18vw, 21rem);
  --ds-layout-shell-gap: clamp(0.75rem, 1vw, 1.25rem);
  --ds-layout-shell-padding: clamp(0.75rem, 1vw, 1.25rem);
  --ds-layout-main-gap: clamp(0.9rem, 1vw, 1.35rem);
  --ds-layout-content-inline: clamp(1rem, 1.8vw, 2.25rem);
  --ds-layout-content-block: clamp(1rem, 1.6vw, 1.75rem);
  --ds-layout-grid-gap: clamp(0.85rem, 1vw, 1.25rem);
  --ds-layout-grid-card-min: clamp(16rem, 22vw, 22rem);
  --ds-layout-grid-compact-min: clamp(12rem, 15vw, 15rem);
  --ds-layout-grid-panel-min: clamp(18rem, 24vw, 26rem);
  --ds-layout-grid-split-side: clamp(20rem, 26vw, 29rem);

  /* Handoff token names */
  --bg-base: var(--ds-bg-app);
  --bg-surface: var(--ds-bg-card);
  --text-primary: var(--ds-text);
  --text-muted: var(--ds-text-muted);
  --border-color: var(--ds-border);

  /* Legacy aliases used across the current runtime */
  --bg-deep: var(--ds-bg-app);
  --bg-mid: var(--ds-bg-subtle);
  --bg-card: var(--ds-bg-card);
  --line: var(--ds-border);
  --line-strong: var(--ds-border-strong);
  --text-main: var(--ds-text);
  --accent: var(--ds-accent);
  --accent-strong: var(--ds-accent-strong);
  --accent-2: var(--ds-info);
  --danger: var(--ds-danger);
  --ok: var(--ds-success);
  --shadow: var(--ds-shadow-card);
  --shadow-lg: var(--ds-shadow-soft);
  --glow: var(--ds-shadow-accent);

  /* Wave 2 compatibility */
  --color-bg-primary: var(--ds-bg-app);
  --color-bg-secondary: var(--ds-bg-subtle);
  --color-bg-tertiary: var(--ds-bg-card-alt);
  --color-surface-1: var(--ds-bg-card);
  --color-surface-2: var(--ds-bg-card-alt);
  --color-border-default: var(--ds-border);
  --color-border-strong: var(--ds-border-strong);
  --color-text-primary: var(--ds-text);
  --color-text-secondary: var(--ds-text-muted);
  --color-accent-primary: var(--ds-accent);
  --color-accent-primary-strong: var(--ds-accent-strong);
  --color-accent-secondary: var(--ds-info);
  --color-success: var(--ds-success);
  --color-warning: var(--ds-warning);
  --color-danger: var(--ds-danger);
  --color-info: var(--ds-info);
  --color-focus-ring: var(--ds-focus);
  --font-family-display: var(--ds-font-display);
  --font-family-body: var(--ds-font-body);
  --radius-sm: var(--ds-radius-sm);
  --radius-md: var(--ds-radius-md);
  --radius-lg: var(--ds-radius-lg);
  --radius-xl: var(--ds-radius-xl);
  --radius-pill: var(--ds-radius-pill);
  --shadow-sm: var(--ds-shadow-card);
  --shadow-md: var(--ds-shadow-soft);
  --elevation-lg: var(--ds-shadow-soft);
  --glow-primary: var(--ds-shadow-accent);

  /* Late premium-theme compatibility */
  --bg-primary: var(--ds-bg-app);
  --bg-secondary: var(--ds-bg-subtle);
  --bg-tertiary: var(--ds-bg-card-alt);
  --bg-card-soft: rgba(255, 255, 255, 0.92);
  --primary-accent: var(--ds-accent);
  --secondary-accent: var(--ds-success);
  --tertiary-accent: var(--ds-info);
  --text-secondary: var(--ds-text-muted);
  --border-soft: var(--ds-border);
  --border-strong: var(--ds-border-strong);
  --glass-bg: var(--ds-bg-card);
  --glass-bg-strong: var(--ds-bg-card-alt);
  --ease-premium: var(--ds-motion-ease);
  --glow-indigo: var(--ds-shadow-accent);
  --glow-cyan: 0 10px 24px rgba(6, 182, 212, 0.16);

  /* Final shell compatibility */
  --uh-space-1: var(--ds-space-2);
  --uh-space-2: var(--ds-space-4);
  --uh-space-3: var(--ds-space-6);
  --uh-space-4: var(--ds-space-8);
  --uh-radius: var(--ds-radius-md);
  --uh-radius-lg: var(--ds-radius-xl);
  --uh-text: var(--ds-text);
  --uh-muted: var(--ds-text-muted);
  --uh-surface: var(--ds-bg-card);
  --uh-border: var(--ds-border);
  --uh-accent: var(--ds-accent);
}

@media (min-width: 1920px) {
  :root {
    --ds-layout-shell-sidebar: clamp(18rem, 16vw, 22rem);
    --ds-layout-content-inline: clamp(1.5rem, 2.2vw, 3rem);
    --ds-layout-content-block: clamp(1.2rem, 2vw, 2.25rem);
    --ds-layout-grid-card-min: clamp(17rem, 18vw, 24rem);
    --ds-layout-grid-panel-min: clamp(19rem, 21vw, 28rem);
    --ds-layout-grid-split-side: clamp(22rem, 24vw, 32rem);
  }
}