:root {
  /* Domus Pura Design Code v1.1 tokens */

  /* A. Primitive color tokens */
  --dp-blue-950: #0c142f;
  --dp-blue-900: #111d44;
  --dp-blue-800: #152556;
  --dp-blue-700: #1a2d69;
  --dp-blue-600: #3c4c80;
  --dp-blue-100: #e8eaf0;

  --dp-gray-950: #111827;
  --dp-gray-800: #1f2937;
  --dp-gray-700: #374151;
  --dp-gray-600: #4b5563;
  --dp-gray-500: #6b7280;
  --dp-gray-300: #d1d5db;
  --dp-gray-200: #e5e7eb;
  --dp-gray-100: #f3f4f6;
  --dp-gray-50: #f9fafb;
  --dp-white: #ffffff;

  --dp-green-700: #166534;
  --dp-green-100: #dcfce7;
  --dp-yellow-700: #6a4e0c;
  --dp-yellow-300: #f1d394;
  --dp-yellow-100: #fff7e8;
  --dp-red-700: #b91c1c;
  --dp-red-100: #fee2e2;
  --dp-purple-700: #6d28d9;
  --dp-purple-100: #ede9fe;

  /* B. Semantic color tokens */
  --dp-color-bg-page: var(--dp-gray-50);
  --dp-color-bg-surface: var(--dp-white);
  --dp-color-bg-muted: var(--dp-gray-100);

  --dp-color-text-primary: var(--dp-gray-950);
  --dp-color-text-secondary: var(--dp-gray-700);
  --dp-color-text-muted: var(--dp-gray-500);
  --dp-color-text-inverse: var(--dp-white);

  --dp-color-border-soft: var(--dp-gray-200);
  --dp-color-border-medium: var(--dp-gray-300);
  --dp-color-border-focus: var(--dp-blue-700);

  --dp-color-accent: var(--dp-blue-700);
  --dp-color-accent-hover: var(--dp-blue-800);
  --dp-color-accent-muted: var(--dp-blue-100);

  --dp-color-success: var(--dp-green-700);
  --dp-color-success-bg: var(--dp-green-100);
  --dp-color-warning: var(--dp-yellow-700);
  --dp-color-warning-border: var(--dp-yellow-300);
  --dp-color-warning-bg: var(--dp-yellow-100);
  --dp-color-danger: var(--dp-red-700);
  --dp-color-danger-bg: var(--dp-red-100);
  --dp-color-demo: var(--dp-purple-700);
  --dp-color-demo-bg: var(--dp-purple-100);

  /* C. Spacing tokens */
  --dp-space-0: 0;
  --dp-space-1: 0.25rem;
  --dp-space-2: 0.5rem;
  --dp-space-3: 0.75rem;
  --dp-space-4: 1rem;
  --dp-space-5: 1.25rem;
  --dp-space-6: 1.5rem;
  --dp-space-7: 2rem;
  --dp-space-8: 2.5rem;

  /* D. Typography tokens */
  --dp-font-family-base: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --dp-font-size-xs: 0.75rem;
  --dp-font-size-sm: 0.875rem;
  --dp-font-size-md: 1rem;
  --dp-font-size-lg: 1.125rem;
  --dp-font-size-xl: 1.25rem;
  --dp-font-size-2xl: 1.5rem;

  --dp-font-size-body: var(--dp-font-size-md);
  --dp-font-size-control: var(--dp-font-size-md);
  --dp-font-size-control-option: var(--dp-font-size-md);
  --dp-font-size-label: var(--dp-font-size-sm);
  --dp-font-size-caption: var(--dp-font-size-xs);

  --dp-line-height-tight: 1.2;
  --dp-line-height-body: 1.5;
  --dp-line-height-relaxed: 1.7;
  --dp-line-height-control: 1.4;
  --dp-line-height-label: 1.35;

  --dp-font-weight-regular: 400;
  --dp-font-weight-medium: 500;
  --dp-font-weight-semibold: 600;
  --dp-font-weight-bold: 700;

  /* E. Radius tokens */
  --dp-radius-xs: 0.25rem;
  --dp-radius-sm: 0.375rem;
  --dp-radius-md: 0.5rem;
  --dp-radius-lg: 0.75rem;
  --dp-radius-xl: 1rem;
  --dp-radius-pill: 9999px;

  /* F. Shadow/elevation tokens */
  --dp-shadow-sm: 0 1px 2px rgb(17 24 39 / 0.06);
  --dp-shadow-card: 0 1px 2px rgb(17 24 39 / 0.05), 0 4px 12px rgb(17 24 39 / 0.06);
  --dp-shadow-panel: 0 2px 6px rgb(17 24 39 / 0.07), 0 8px 24px rgb(17 24 39 / 0.1);

  /* G. Border/focus/z-index tokens */
  --dp-border-width: 1px;
  --dp-focus-ring: 0 0 0 3px rgb(26 45 105 / 0.35);
  --dp-focus-ring-offset: 2px;

  --dp-z-header: 100;
  --dp-z-sidebar: 200;
  --dp-z-dropdown: 600;
  --dp-z-modal: 900;
  --dp-z-toast: 1000;

  /* H. Component-level alias tokens */
  --dp-card-bg: var(--dp-color-bg-surface);
  --dp-card-border: var(--dp-color-border-soft);
  --dp-card-radius: var(--dp-radius-lg);
  --dp-card-padding: var(--dp-space-6);
  --dp-card-gap: var(--dp-space-4);

  --dp-sidebar-width: 17rem;
  --dp-sidebar-bg: var(--dp-color-bg-surface);
  --dp-sidebar-border: var(--dp-color-border-soft);

  --dp-field-label-color: var(--dp-color-text-secondary);
  --dp-field-value-color: var(--dp-color-text-primary);
  --dp-field-note-color: var(--dp-color-text-muted);
  --dp-field-error-color: var(--dp-color-danger);

  --dp-control-font-family: var(--dp-font-family-base);
  --dp-control-font-size: var(--dp-font-size-control);
  --dp-control-option-font-size: var(--dp-font-size-control-option);
  --dp-control-label-font-size: var(--dp-font-size-label);
  --dp-control-caption-font-size: var(--dp-font-size-caption);
  --dp-control-line-height: var(--dp-line-height-control);
  --dp-control-min-height: 2.75rem;
  --dp-control-touch-min-height: 3rem;
  --dp-control-compact-min-height: 2.25rem;
  --dp-control-padding-block: var(--dp-space-2);
  --dp-control-padding-inline: var(--dp-space-3);
  --dp-control-icon-size: 1.125rem;
  --dp-control-icon-area: 2.75rem;
  --dp-control-disabled-opacity: 0.72;
  --dp-control-placeholder-color: var(--dp-color-text-muted);
  --dp-control-readonly-bg: var(--dp-color-bg-muted);
  --dp-control-error-border: var(--dp-color-danger);

  --dp-button-radius: var(--dp-radius-md);
  --dp-button-padding-y: var(--dp-space-2);
  --dp-button-padding-x: var(--dp-space-4);
  --dp-button-min-height: var(--dp-control-min-height);
  --dp-button-touch-min-height: var(--dp-control-touch-min-height);
}
