:root {
    /* Brand and semantic colors */
    --narc-color-primary: #2563eb;
    --narc-color-primary-hover: #1d4ed8;
    --narc-color-secondary: #f1b18f;
    --narc-color-secondary-hover: #e99a72;
    --narc-color-success: #15803d;
    --narc-color-info: #0369a1;
    --narc-color-warning: #a16207;
    --narc-color-danger: #dc2626;
    --narc-color-on-primary: #ffffff;
    --narc-color-on-secondary: #422006;
    --narc-color-on-status: #ffffff;
    --narc-color-transparent: transparent;

    /* Neutral surfaces and text */
    --narc-color-surface: #ffffff;
    --narc-color-surface-muted: #f8fafc;
    --narc-color-text: #172033;
    --narc-color-text-muted: #64748b;
    --narc-color-border: #cbd5e1;
    --narc-color-focus: rgba(37, 99, 235, 0.28);
    --narc-color-disabled: #e2e8f0;

    /* Typography */
    --narc-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --narc-font-family-monospace: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    --narc-font-size-xs: 0.75rem;
    --narc-font-size-sm: 0.875rem;
    --narc-font-size-md: 1rem;
    --narc-font-size-lg: 1.125rem;
    --narc-heading-size-lg: 1.5rem;
    --narc-heading-size-xl: 3rem;
    --narc-font-weight-regular: 400;
    --narc-font-weight-medium: 500;
    --narc-font-weight-semibold: 600;
    --narc-line-height-control: 1.25;
    --narc-line-height-text: 1.5;
    --narc-line-height-heading: 1.1;
    --narc-letter-spacing-wide: 0.08em;

    /* Spacing and sizing */
    --narc-space-xs: 0.25rem;
    --narc-space-sm: 0.5rem;
    --narc-space-md: 1rem;
    --narc-space-lg: 1.5rem;
    --narc-space-xl: 2rem;
    --narc-full-width: 100%;
    --narc-zero: 0;
    --narc-flex-grow: 1;
    --narc-grid-full-span: 1 / -1;
    --narc-grid-flex-track: 1fr;
    --narc-content-max-width: 72rem;
    --narc-text-max-width: 48rem;
    --narc-viewport-height: 100vh;
    --narc-container-max-width: 76rem;
    --narc-container-border-radius: var(--narc-radius-md);
    --narc-container-padding: clamp(1rem, 4vw, 2rem);
    --narc-grid-item-min-sm: 12rem;
    --narc-grid-item-min-md: 18rem;
    --narc-grid-item-min-lg: 28rem;
    --narc-catalog-card-min-width: 22rem;
    --narc-catalog-scroll-offset: 5rem;
    --narc-catalog-nav-z-index: 10;
    --narc-catalog-sidebar-width: 14rem;
    --narc-catalog-sidebar-offset: 2rem;
    --narc-section-padding: clamp(1rem, 3vw, 1.5rem);
    --narc-control-height-sm: 2rem;
    --narc-control-height-md: 2.5rem;
    --narc-control-height-lg: 3rem;
    --narc-control-padding-y-sm: 0.25rem;
    --narc-control-padding-x-sm: 0.625rem;
    --narc-control-padding-y-md: 0.5rem;
    --narc-control-padding-x-md: 1rem;
    --narc-control-padding-y-lg: 0.75rem;
    --narc-control-padding-x-lg: 1.25rem;
    --narc-input-padding: 0.5rem 0.75rem;
    --narc-checkbox-size: 1.125rem;
    --narc-textarea-min-height: 7rem;
    --narc-sr-size: 1px;
    --narc-table-cell-padding: 0.75rem 1rem;
    --narc-table-caption-padding: 0.75rem 1rem;
    --narc-card-padding: 1rem;
    --narc-alert-padding: 0.75rem 1rem;
    --narc-badge-padding-y-sm: 0.125rem;
    --narc-badge-padding-x-sm: 0.375rem;
    --narc-badge-padding-y-md: 0.25rem;
    --narc-badge-padding-x-md: 0.5rem;
    --narc-badge-padding-y-lg: 0.375rem;
    --narc-badge-padding-x-lg: 0.625rem;
    --narc-code-padding-y: 0.125rem;
    --narc-code-padding-x: 0.375rem;
    --narc-code-block-padding: 1rem;
    --narc-quote-padding-y: 0.5rem;
    --narc-quote-padding-x: 1rem;
    --narc-list-padding-inline-start: 1.5rem;
    --narc-link-underline-width: 0.08em;
    --narc-link-underline-offset: 0.15em;
    --narc-quote-border-width: 0.25rem;

    /* Borders, radii, shadows and motion */
    --narc-border-width: 1px;
    --narc-radius-sm: 0.25rem;
    --narc-radius-md: 0.5rem;
    --narc-radius-lg: 0.75rem;
    --narc-radius-pill: 9999px;
    --narc-radius-round: 50%;
    --narc-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.12);
    --narc-focus-ring: 0 0 0 3px var(--narc-color-focus);
    --narc-transition-duration: 150ms;
    --narc-transition-easing: ease;
    --narc-disabled-opacity: 0.6;
    --narc-spinner-size: 1rem;
    --narc-spinner-border-width: 0.125rem;
    --narc-spinner-track: rgba(255, 255, 255, 0.45);
    --narc-spinner-duration: 700ms;
    --narc-spinner-rotation: 360deg;

    /* Component semantic tokens */
    --narc-button-primary-background: var(--narc-color-primary);
    --narc-button-primary-background-hover: var(--narc-color-primary-hover);
    --narc-button-primary-border: var(--narc-color-primary);
    --narc-button-primary-text: var(--narc-color-on-primary);
    --narc-button-secondary-background: var(--narc-color-secondary);
    --narc-button-secondary-background-hover: var(--narc-color-secondary-hover);
    --narc-button-secondary-border: var(--narc-color-secondary);
    --narc-button-secondary-text: var(--narc-color-on-secondary);
    --narc-input-background: var(--narc-color-surface);
    --narc-input-disabled-background: var(--narc-color-disabled);
    --narc-input-border: var(--narc-color-border);
    --narc-table-header-background: var(--narc-color-surface-muted);
    --narc-table-row-hover-background: #f8fbff;
    --narc-alert-info-background: #e0f2fe;
    --narc-alert-info-border: #7dd3fc;
    --narc-alert-info-text: #075985;
    --narc-alert-success-background: #dcfce7;
    --narc-alert-success-border: #86efac;
    --narc-alert-success-text: #166534;
    --narc-alert-warning-background: #fef3c7;
    --narc-alert-warning-border: #fcd34d;
    --narc-alert-warning-text: #854d0e;
    --narc-alert-danger-background: #fee2e2;
    --narc-alert-danger-border: #fca5a5;
    --narc-alert-danger-text: #991b1b;

    --narc-half: 50%;
    --narc-chart-legend-color: var(--narc-chart-color-primary);

    /* Data visualization */
    --narc-chart-background: var(--narc-color-surface);
    --narc-chart-border: var(--narc-color-border);
    --narc-chart-text: var(--narc-color-text-muted);
    --narc-chart-grid: #e2e8f0;
    --narc-chart-tooltip-background: #172033;
    --narc-chart-color-primary: var(--narc-color-primary);
    --narc-chart-color-secondary: var(--narc-color-secondary);
    --narc-chart-color-success: var(--narc-color-success);
    --narc-chart-color-info: var(--narc-color-info);
    --narc-chart-color-warning: var(--narc-color-warning);
    --narc-chart-color-danger: var(--narc-color-danger);
    --narc-chart-color-accent: #7c3aed;
    --narc-chart-color-neutral: #64748b;
    --narc-chart-padding: var(--narc-space-md);
    --narc-chart-height-sm: 16rem;
    --narc-chart-height-md: 22rem;
    --narc-chart-height-lg: 30rem;
    --narc-switch-background: var(--narc-color-border);
    --narc-switch-thumb: var(--narc-color-surface);
    --narc-switch-padding: 0.125rem;
    --narc-switch-width-sm: 2rem;
    --narc-switch-width-md: 2.5rem;
    --narc-switch-width-lg: 3rem;
    --narc-switch-thumb-sm: 0.75rem;
    --narc-switch-thumb-md: 1rem;
    --narc-switch-thumb-lg: 1.25rem;
    --narc-switch-travel-sm: 1rem;
    --narc-switch-travel-md: 1.25rem;
    --narc-switch-travel-lg: 1.5rem;
    --narc-progress-track: #e8edf5;
    --narc-progress-track-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.12);
    --narc-progress-info: #0284c7;
    --narc-progress-info-highlight: #38bdf8;
    --narc-progress-info-soft: #e0f2fe;
    --narc-progress-success: #16a34a;
    --narc-progress-success-highlight: #4ade80;
    --narc-progress-success-soft: #dcfce7;
    --narc-progress-warning: #d97706;
    --narc-progress-warning-highlight: #fbbf24;
    --narc-progress-warning-soft: #fef3c7;
    --narc-progress-danger: #dc2626;
    --narc-progress-danger-highlight: #fb7185;
    --narc-progress-danger-soft: #fee2e2;
    --narc-progress-color: var(--narc-progress-info);
    --narc-progress-highlight: var(--narc-progress-info-highlight);
    --narc-progress-soft-color: var(--narc-progress-info-soft);
    --narc-progress-sheen: linear-gradient(180deg, rgba(255, 255, 255, 0.32), transparent 55%);
    --narc-progress-value: 0%;
    --narc-progress-height-sm: 0.375rem;
    --narc-progress-height-md: 0.625rem;
    --narc-progress-height-lg: 0.875rem;
    --narc-progress-gap: 0.375rem;
    --narc-progress-percentage-padding-y: 0.125rem;
    --narc-progress-percentage-padding-x: 0.5rem;
    --narc-progress-indeterminate-width: 40%;
    --narc-progress-start: -100%;
    --narc-progress-end: 250%;
    --narc-progress-duration: 1.25s;
    --narc-progress-transition-duration: 300ms;
    --narc-progress-reduced-motion-opacity: 0.65;
    --narc-skeleton-background: var(--narc-color-disabled);
    --narc-skeleton-shimmer: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);
    --narc-skeleton-height-sm: 0.75rem;
    --narc-skeleton-height-md: 1rem;
    --narc-skeleton-height-lg: 2rem;
    --narc-skeleton-circle-size: 3rem;
    --narc-skeleton-start: -100%;
    --narc-skeleton-end: 100%;
    --narc-skeleton-duration: 1.5s;
    --narc-aspect-ratio-square: 1;
    --narc-divider-color: var(--narc-color-border);
    --narc-accordion-padding: var(--narc-space-md);
    --narc-accordion-rotation: 45deg;
    --narc-hero-text-muted: #cbd5e1;
    --narc-hero-stat-background: rgba(255, 255, 255, 0.08);
    --narc-hero-stat-border: rgba(255, 255, 255, 0.16);
}
