/* DermRX Design System · tokens v1.2.0 · generado por dermrx-tokens.php desde tokens.json el 2026-10-25; no editar a mano. */
/* Breakpoints (usar en @media; CSS no admite variables ahí): sm 600px · md 900px · lg 1200px */
html:root {
  --dds-font-ui: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --dds-font-body: "Source Sans 3", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --dds-font-display: "Source Serif 4", Georgia, serif;
  --dds-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --dds-text-xs: .75rem;
  --dds-text-sm: .875rem;
  --dds-text-base: 1rem;
  --dds-text-lg: 1.125rem;
  --dds-text-h3: clamp(1.125rem, 1rem + .5vw, 1.375rem);
  --dds-text-h2: clamp(1.5rem, 1.3rem + .8vw, 1.875rem);
  --dds-text-h1: clamp(2rem, 1.5rem + 2vw, 2.75rem);
  --dds-weight-regular: 400;
  --dds-weight-medium: 500;
  --dds-weight-semibold: 600;
  --dds-weight-bold: 700;
  --dds-leading-body: 1.65;
  --dds-leading-ui: 1.4;
  --dds-leading-title: 1.2;
  --dds-s1: .25rem;
  --dds-s2: .5rem;
  --dds-s3: .75rem;
  --dds-s4: 1rem;
  --dds-s5: 1.5rem;
  --dds-s6: 2rem;
  --dds-s7: 3rem;
  --dds-s8: 4rem;
  --dds-radius-sm: .5rem;
  --dds-radius-md: .875rem;
  --dds-radius-lg: 1rem;
  --dds-radius-full: 9999px;
  --dds-shadow-sm: 0 1px 2px rgba(15,23,42,.05);
  --dds-shadow-md: 0 1px 2px rgba(15,23,42,.05), 0 8px 24px -12px rgba(15,23,42,.16);
  --dds-tap: 2.75rem;
  --dds-measure: 72ch;
  --dds-content-width: 1180px;
  --dds-bp-sm: 600px;
  --dds-bp-md: 900px;
  --dds-bp-lg: 1200px;
  --dds-duration: 160ms;
  --dds-ease: cubic-bezier(.2,0,0,1);
  --dds-brand: #0d7a6b;
  --dds-brand-strong: #095f54;
  --dds-brand-soft: #e8f5f2;
  --dds-brand-line: #a7d4ce;
  --dds-on-brand: #ffffff;
  --dds-accent: #245a81;
  --dds-accent-strong: #1d4969;
  --dds-ink: #0f172a;
  --dds-ink-2: #334155;
  --dds-muted: #475569;
  --dds-faint: #64748b;
  --dds-canvas: #f6f8fa;
  --dds-surface: #ffffff;
  --dds-surface-2: #f1f5f9;
  --dds-line: #dce3eb;
  --dds-line-strong: #cbd5e1;
  --dds-control-line: #82939f;
  --dds-focus: #095f54;
  --dds-ok-fg: #166534;
  --dds-ok-bg: #edf9f0;
  --dds-ok-line: #b8e2c5;
  --dds-info-fg: #075985;
  --dds-info-bg: #e8f5fa;
  --dds-info-line: #bae0f0;
  --dds-caution-fg: #9a3412;
  --dds-caution-bg: #fff4e5;
  --dds-caution-line: #f6c995;
  --dds-critical-fg: #991b1b;
  --dds-critical-bg: #fef2f2;
  --dds-critical-line: #fecaca;
  --dds-class-biologico: #6d28d9;
  --dds-class-biologico-bg: #f5f3ff;
  --dds-class-jaki: #1d4ed8;
  --dds-class-jaki-bg: #eff6ff;
  --dds-class-topico: #0f766e;
  --dds-class-topico-bg: #f0fdfa;
  --dds-class-sistemico: #c2410c;
  --dds-class-sistemico-bg: #fff7ed;
  --dds-class-otro: #475569;
  --dds-class-otro-bg: #f8fafc;
}

/* Alias heredados → token dds. Retirar cada alias cuando ningún CSS lo use. */
html:root {
  --c-amber-bg: var(--dds-caution-bg);
  --c-bg: var(--dds-surface);
  --c-blue-bg: var(--dds-surface-2);
  --c-border: var(--dds-line);
  --c-green-bg: var(--dds-ok-bg);
  --c-ink: var(--dds-ink);
  --c-ink-3: var(--dds-ink-2);
  --c-ink-4: var(--dds-faint);
  --c-navy: var(--dds-ink);
  --c-red-bg: var(--dds-critical-bg);
  --c-surface: var(--dds-canvas);
  --c-surface-2: var(--dds-surface-2);
  --c-surface-3: var(--dds-surface-2);
  --c-teal: var(--dds-brand);
  --c-teal-bg: var(--dds-surface-2);
  --c-teal-border: var(--dds-brand-line);
  --c-teal-dark: var(--dds-brand-strong);
  --drx-accent-danger: var(--dds-critical-fg);
  --drx-accent-danger-bg: var(--dds-critical-bg);
  --drx-accent-hover: var(--dds-brand-strong);
  --drx-accent-info: var(--dds-info-fg);
  --drx-accent-info-bg: var(--dds-info-bg);
  --drx-accent-primary: var(--dds-brand);
  --drx-accent-primary-hover: var(--dds-brand-strong);
  --drx-accent-soft: var(--dds-brand-soft);
  --drx-accent-success: var(--dds-ok-fg);
  --drx-accent-success-bg: var(--dds-ok-bg);
  --drx-accent-warning: var(--dds-caution-fg);
  --drx-accent-warning-bg: var(--dds-caution-bg);
  --drx-alt: var(--dds-surface-2);
  --drx-badge-biologico: var(--dds-class-biologico);
  --drx-badge-biologico-bg: var(--dds-class-biologico-bg);
  --drx-badge-jaki: var(--dds-class-jaki);
  --drx-badge-jaki-bg: var(--dds-class-jaki-bg);
  --drx-badge-otro: var(--dds-class-otro);
  --drx-badge-otro-bg: var(--dds-canvas);
  --drx-badge-sistemico: var(--dds-class-sistemico);
  --drx-badge-sistemico-bg: var(--dds-class-sistemico-bg);
  --drx-badge-topico: var(--dds-class-topico);
  --drx-badge-topico-bg: var(--dds-class-topico-bg);
  --drx-bg: var(--dds-canvas);
  --drx-bg-elevated: var(--dds-surface);
  --drx-bg-inset: var(--dds-line);
  --drx-bg-primary: var(--dds-surface);
  --drx-bg-secondary: var(--dds-canvas);
  --drx-bg-tertiary: var(--dds-surface-2);
  --drx-blue-subtle: var(--dds-surface-2);
  --drx-border: var(--dds-line);
  --drx-border-default: var(--dds-line);
  --drx-border-strong: var(--dds-line-strong);
  --drx-border-subtle: var(--dds-surface-2);
  --drx-brand: var(--dds-brand);
  --drx-brand-dark: var(--dds-brand-strong);
  --drx-c-brand: var(--dds-brand);
  --drx-c-brand-soft: var(--dds-brand-soft);
  --drx-c-brand-strong: var(--dds-brand-strong);
  --drx-c-ink: var(--dds-ink);
  --drx-c-ink-soft: var(--dds-ink-2);
  --drx-c-line: var(--dds-line);
  --drx-c-muted: var(--dds-muted);
  --drx-canvas: var(--dds-canvas);
  --drx-content-max: var(--dds-measure);
  --drx-danger-bg: var(--dds-critical-bg);
  --drx-divider: var(--dds-line);
  --drx-ds-bg: var(--dds-canvas);
  --drx-ds-danger: var(--dds-critical-fg);
  --drx-ds-danger-bg: var(--dds-critical-bg);
  --drx-ds-info: var(--dds-info-fg);
  --drx-ds-info-bg: var(--dds-info-bg);
  --drx-ds-muted: var(--dds-muted);
  --drx-ds-ok: var(--dds-ok-fg);
  --drx-ds-ok-bg: var(--dds-ok-bg);
  --drx-ds-primary: var(--dds-brand-strong);
  --drx-ds-retired-bg: var(--dds-canvas);
  --drx-ds-sep: var(--dds-line);
  --drx-ds-warn: var(--dds-caution-fg);
  --drx-ds-warn-bg: var(--dds-caution-bg);
  --drx-font-mono: var(--dds-font-mono);
  --drx-font-reading: var(--dds-font-body);
  --drx-font-ui: var(--dds-font-ui);
  --drx-gray-100: var(--dds-surface-2);
  --drx-gray-200: var(--dds-line);
  --drx-gray-300: var(--dds-line-strong);
  --drx-gray-50: var(--dds-canvas);
  --drx-gray-500: var(--dds-faint);
  --drx-gray-600: var(--dds-muted);
  --drx-gray-700: var(--dds-ink-2);
  --drx-gray-900: var(--dds-ink);
  --drx-header-height: 56px;
  --drx-line: var(--dds-line);
  --drx-line-strong: var(--dds-line-strong);
  --drx-navy: var(--dds-ink);
  --drx-ok: var(--dds-ok-fg);
  --drx-ok-bg: var(--dds-ok-bg);
  --drx-paper: var(--dds-canvas);
  --drx-petrol-l: var(--dds-brand-soft);
  --drx-primary: var(--dds-brand);
  --drx-primary-dark: var(--dds-brand-strong);
  --drx-primary-hover: var(--dds-brand-strong);
  --drx-primary-soft: var(--dds-brand-soft);
  --drx-radius-lg: var(--dds-radius-md);
  --drx-radius-md: var(--dds-radius-sm);
  --drx-radius-sm: var(--dds-radius-sm);
  --drx-radius-xl: var(--dds-radius-lg);
  --drx-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--dds-focus) 25%, transparent);
  --drx-shadow-lg: var(--dds-shadow-md);
  --drx-shadow-md: var(--dds-shadow-md);
  --drx-shadow-sm: var(--dds-shadow-sm);
  --drx-space-1: var(--dds-s1);
  --drx-space-12: var(--dds-s7);
  --drx-space-16: var(--dds-s8);
  --drx-space-2: var(--dds-s2);
  --drx-space-3: var(--dds-s3);
  --drx-space-4: var(--dds-s4);
  --drx-space-6: var(--dds-s5);
  --drx-space-8: var(--dds-s6);
  --drx-surface: var(--dds-surface);
  --drx-surface-2: var(--dds-surface-2);
  --drx-surface-offset: var(--dds-surface-2);
  --drx-surface-soft: var(--dds-canvas);
  --drx-text: var(--dds-ink);
  --drx-text-2: var(--dds-muted);
  --drx-text-inverse: var(--dds-on-brand);
  --drx-text-primary: var(--dds-ink);
  --drx-text-secondary: var(--dds-muted);
  --drx-text-tertiary: var(--dds-faint);
  --drx-transition-base: var(--dds-duration) var(--dds-ease);
  --drx-transition-fast: 120ms ease;
  --drx-transition-slow: 350ms ease;
  --drx-ui-brand: var(--dds-brand);
  --drx-ui-brand-hover: var(--dds-brand-strong);
  --drx-ui-brand-soft: var(--dds-brand-soft);
  --drx-ui-canvas: var(--dds-canvas);
  --drx-ui-content-width: var(--dds-content-width);
  --drx-ui-control-radius: var(--dds-radius-sm);
  --drx-ui-danger: var(--dds-critical-fg);
  --drx-ui-danger-line: var(--dds-critical-line);
  --drx-ui-danger-soft: var(--dds-critical-bg);
  --drx-ui-focus: var(--dds-focus);
  --drx-ui-font: var(--dds-font-ui);
  --drx-ui-info-soft: var(--dds-info-bg);
  --drx-ui-ink: var(--dds-ink);
  --drx-ui-line: var(--dds-line);
  --drx-ui-line-strong: var(--dds-line-strong);
  --drx-ui-muted: var(--dds-muted);
  --drx-ui-paper: var(--dds-surface);
  --drx-ui-radius: var(--dds-radius-md);
  --drx-ui-radius-sm: var(--dds-radius-sm);
  --drx-ui-reading-width: var(--dds-measure);
  --drx-ui-soft: var(--dds-brand-soft);
  --drx-ui-success: var(--dds-ok-fg);
  --drx-ui-success-line: var(--dds-ok-line);
  --drx-ui-success-soft: var(--dds-ok-bg);
  --drx-ui-surface: var(--dds-surface);
  --drx-ui-surface-alt: var(--dds-surface-2);
  --drx-ui-warning: var(--dds-caution-fg);
  --drx-ui-warning-soft: var(--dds-caution-bg);
  --drx-warn-bg: var(--dds-caution-bg);
  --drx2-line: var(--dds-line);
  --drx2-soft: var(--dds-canvas);
  --drx26-brand: var(--dds-brand);
  --drx26-brand-dark: var(--dds-brand-strong);
  --drx26-link: var(--dds-accent);
  --drx26-teal-soft: var(--dds-brand-soft);
  --drxsys-base: var(--dds-s4);
  --drxsys-brand: var(--dds-brand);
  --drxsys-brand-hover: var(--dds-brand-strong);
  --drxsys-brand-soft: var(--dds-brand-soft);
  --drxsys-canvas: var(--dds-canvas);
  --drxsys-control-line: var(--dds-control-line);
  --drxsys-focus: var(--dds-brand-strong);
  --drxsys-ink: var(--dds-ink);
  --drxsys-ink-soft: var(--dds-ink-2);
  --drxsys-line: var(--dds-line);
  --drxsys-measure: var(--dds-measure);
  --drxsys-muted: var(--dds-muted);
  --drxsys-radius: var(--dds-radius-md);
  --drxsys-radius-sm: var(--dds-radius-sm);
  --drxsys-s1: var(--dds-s1);
  --drxsys-s2: var(--dds-s2);
  --drxsys-s3: var(--dds-s3);
  --drxsys-s4: var(--dds-s4);
  --drxsys-s5: var(--dds-s5);
  --drxsys-s6: var(--dds-s6);
  --drxsys-s7: var(--dds-s7);
  --drxsys-s8: var(--dds-s8);
  --drxsys-sm: var(--dds-radius-md);
  --drxsys-surface: var(--dds-surface);
  --drxsys-tap: var(--dds-tap);
  --drxsys-xs: var(--dds-s3);
  --primary: var(--dds-brand);
  --sp-1: var(--dds-s1);
  --sp-12: var(--dds-s7);
  --sp-16: var(--dds-s8);
  --sp-2: var(--dds-s2);
  --sp-3: var(--dds-s3);
  --sp-4: var(--dds-s4);
  --sp-6: var(--dds-s5);
  --sp-8: var(--dds-s6);
}

@media (prefers-color-scheme: dark) {
  html:root:not([data-theme="light"]) {
    --dds-brand: #0d7a6b;
    --dds-brand-strong: #095f54;
    --dds-brand-soft: #e8f5f2;
    --dds-brand-line: #a7d4ce;
    --dds-on-brand: #ffffff;
    --dds-accent: #245a81;
    --dds-accent-strong: #1d4969;
    --dds-ink: #0f172a;
    --dds-ink-2: #334155;
    --dds-muted: #475569;
    --dds-faint: #64748b;
    --dds-canvas: #f6f8fa;
    --dds-surface: #ffffff;
    --dds-surface-2: #f1f5f9;
    --dds-line: #dce3eb;
    --dds-line-strong: #cbd5e1;
    --dds-control-line: #82939f;
    --dds-focus: #095f54;
    --dds-ok-fg: #166534;
    --dds-ok-bg: #edf9f0;
    --dds-ok-line: #b8e2c5;
    --dds-info-fg: #075985;
    --dds-info-bg: #e8f5fa;
    --dds-info-line: #bae0f0;
    --dds-caution-fg: #9a3412;
    --dds-caution-bg: #fff4e5;
    --dds-caution-line: #f6c995;
    --dds-critical-fg: #991b1b;
    --dds-critical-bg: #fef2f2;
    --dds-critical-line: #fecaca;
    --dds-class-biologico: #6d28d9;
    --dds-class-biologico-bg: #f5f3ff;
    --dds-class-jaki: #1d4ed8;
    --dds-class-jaki-bg: #eff6ff;
    --dds-class-topico: #0f766e;
    --dds-class-topico-bg: #f0fdfa;
    --dds-class-sistemico: #c2410c;
    --dds-class-sistemico-bg: #fff7ed;
    --dds-class-otro: #475569;
    --dds-class-otro-bg: #f8fafc;
    --c-amber-bg: var(--dds-caution-bg);
    --c-bg: var(--dds-surface);
    --c-blue-bg: var(--dds-surface-2);
    --c-border: var(--dds-line);
    --c-green-bg: var(--dds-ok-bg);
    --c-ink: var(--dds-ink);
    --c-ink-3: var(--dds-ink-2);
    --c-ink-4: var(--dds-faint);
    --c-navy: var(--dds-ink);
    --c-red-bg: var(--dds-critical-bg);
    --c-surface: var(--dds-canvas);
    --c-surface-2: var(--dds-surface-2);
    --c-surface-3: var(--dds-surface-2);
    --c-teal: var(--dds-brand);
    --c-teal-bg: var(--dds-surface-2);
    --c-teal-border: var(--dds-brand-line);
    --c-teal-dark: var(--dds-brand-strong);
    --drx-accent-danger: var(--dds-critical-fg);
    --drx-accent-danger-bg: var(--dds-critical-bg);
    --drx-accent-hover: var(--dds-brand-strong);
    --drx-accent-info: var(--dds-info-fg);
    --drx-accent-info-bg: var(--dds-info-bg);
    --drx-accent-primary: var(--dds-brand);
    --drx-accent-primary-hover: var(--dds-brand-strong);
    --drx-accent-soft: var(--dds-brand-soft);
    --drx-accent-success: var(--dds-ok-fg);
    --drx-accent-success-bg: var(--dds-ok-bg);
    --drx-accent-warning: var(--dds-caution-fg);
    --drx-accent-warning-bg: var(--dds-caution-bg);
    --drx-alt: var(--dds-surface-2);
    --drx-badge-biologico: var(--dds-class-biologico);
    --drx-badge-biologico-bg: var(--dds-class-biologico-bg);
    --drx-badge-jaki: var(--dds-class-jaki);
    --drx-badge-jaki-bg: var(--dds-class-jaki-bg);
    --drx-badge-otro: var(--dds-class-otro);
    --drx-badge-otro-bg: var(--dds-canvas);
    --drx-badge-sistemico: var(--dds-class-sistemico);
    --drx-badge-sistemico-bg: var(--dds-class-sistemico-bg);
    --drx-badge-topico: var(--dds-class-topico);
    --drx-badge-topico-bg: var(--dds-class-topico-bg);
    --drx-bg: var(--dds-canvas);
    --drx-bg-elevated: var(--dds-surface);
    --drx-bg-inset: var(--dds-line);
    --drx-bg-primary: var(--dds-surface);
    --drx-bg-secondary: var(--dds-canvas);
    --drx-bg-tertiary: var(--dds-surface-2);
    --drx-blue-subtle: var(--dds-surface-2);
    --drx-border: var(--dds-line);
    --drx-border-default: var(--dds-line);
    --drx-border-strong: var(--dds-line-strong);
    --drx-border-subtle: var(--dds-surface-2);
    --drx-brand: var(--dds-brand);
    --drx-brand-dark: var(--dds-brand-strong);
    --drx-c-brand: var(--dds-brand);
    --drx-c-brand-soft: var(--dds-brand-soft);
    --drx-c-brand-strong: var(--dds-brand-strong);
    --drx-c-ink: var(--dds-ink);
    --drx-c-ink-soft: var(--dds-ink-2);
    --drx-c-line: var(--dds-line);
    --drx-c-muted: var(--dds-muted);
    --drx-canvas: var(--dds-canvas);
    --drx-content-max: var(--dds-measure);
    --drx-danger-bg: var(--dds-critical-bg);
    --drx-divider: var(--dds-line);
    --drx-ds-bg: var(--dds-canvas);
    --drx-ds-danger: var(--dds-critical-fg);
    --drx-ds-danger-bg: var(--dds-critical-bg);
    --drx-ds-info: var(--dds-info-fg);
    --drx-ds-info-bg: var(--dds-info-bg);
    --drx-ds-muted: var(--dds-muted);
    --drx-ds-ok: var(--dds-ok-fg);
    --drx-ds-ok-bg: var(--dds-ok-bg);
    --drx-ds-primary: var(--dds-brand-strong);
    --drx-ds-retired-bg: var(--dds-canvas);
    --drx-ds-sep: var(--dds-line);
    --drx-ds-warn: var(--dds-caution-fg);
    --drx-ds-warn-bg: var(--dds-caution-bg);
    --drx-font-mono: var(--dds-font-mono);
    --drx-font-reading: var(--dds-font-body);
    --drx-font-ui: var(--dds-font-ui);
    --drx-gray-100: var(--dds-surface-2);
    --drx-gray-200: var(--dds-line);
    --drx-gray-300: var(--dds-line-strong);
    --drx-gray-50: var(--dds-canvas);
    --drx-gray-500: var(--dds-faint);
    --drx-gray-600: var(--dds-muted);
    --drx-gray-700: var(--dds-ink-2);
    --drx-gray-900: var(--dds-ink);
    --drx-header-height: 56px;
    --drx-line: var(--dds-line);
    --drx-line-strong: var(--dds-line-strong);
    --drx-navy: var(--dds-ink);
    --drx-ok: var(--dds-ok-fg);
    --drx-ok-bg: var(--dds-ok-bg);
    --drx-paper: var(--dds-canvas);
    --drx-petrol-l: var(--dds-brand-soft);
    --drx-primary: var(--dds-brand);
    --drx-primary-dark: var(--dds-brand-strong);
    --drx-primary-hover: var(--dds-brand-strong);
    --drx-primary-soft: var(--dds-brand-soft);
    --drx-radius-lg: var(--dds-radius-md);
    --drx-radius-md: var(--dds-radius-sm);
    --drx-radius-sm: var(--dds-radius-sm);
    --drx-radius-xl: var(--dds-radius-lg);
    --drx-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--dds-focus) 25%, transparent);
    --drx-shadow-lg: var(--dds-shadow-md);
    --drx-shadow-md: var(--dds-shadow-md);
    --drx-shadow-sm: var(--dds-shadow-sm);
    --drx-space-1: var(--dds-s1);
    --drx-space-12: var(--dds-s7);
    --drx-space-16: var(--dds-s8);
    --drx-space-2: var(--dds-s2);
    --drx-space-3: var(--dds-s3);
    --drx-space-4: var(--dds-s4);
    --drx-space-6: var(--dds-s5);
    --drx-space-8: var(--dds-s6);
    --drx-surface: var(--dds-surface);
    --drx-surface-2: var(--dds-surface-2);
    --drx-surface-offset: var(--dds-surface-2);
    --drx-surface-soft: var(--dds-canvas);
    --drx-text: var(--dds-ink);
    --drx-text-2: var(--dds-muted);
    --drx-text-inverse: var(--dds-on-brand);
    --drx-text-primary: var(--dds-ink);
    --drx-text-secondary: var(--dds-muted);
    --drx-text-tertiary: var(--dds-faint);
    --drx-transition-base: var(--dds-duration) var(--dds-ease);
    --drx-transition-fast: 120ms ease;
    --drx-transition-slow: 350ms ease;
    --drx-ui-brand: var(--dds-brand);
    --drx-ui-brand-hover: var(--dds-brand-strong);
    --drx-ui-brand-soft: var(--dds-brand-soft);
    --drx-ui-canvas: var(--dds-canvas);
    --drx-ui-content-width: var(--dds-content-width);
    --drx-ui-control-radius: var(--dds-radius-sm);
    --drx-ui-danger: var(--dds-critical-fg);
    --drx-ui-danger-line: var(--dds-critical-line);
    --drx-ui-danger-soft: var(--dds-critical-bg);
    --drx-ui-focus: var(--dds-focus);
    --drx-ui-font: var(--dds-font-ui);
    --drx-ui-info-soft: var(--dds-info-bg);
    --drx-ui-ink: var(--dds-ink);
    --drx-ui-line: var(--dds-line);
    --drx-ui-line-strong: var(--dds-line-strong);
    --drx-ui-muted: var(--dds-muted);
    --drx-ui-paper: var(--dds-surface);
    --drx-ui-radius: var(--dds-radius-md);
    --drx-ui-radius-sm: var(--dds-radius-sm);
    --drx-ui-reading-width: var(--dds-measure);
    --drx-ui-soft: var(--dds-brand-soft);
    --drx-ui-success: var(--dds-ok-fg);
    --drx-ui-success-line: var(--dds-ok-line);
    --drx-ui-success-soft: var(--dds-ok-bg);
    --drx-ui-surface: var(--dds-surface);
    --drx-ui-surface-alt: var(--dds-surface-2);
    --drx-ui-warning: var(--dds-caution-fg);
    --drx-ui-warning-soft: var(--dds-caution-bg);
    --drx-warn-bg: var(--dds-caution-bg);
    --drx2-line: var(--dds-line);
    --drx2-soft: var(--dds-canvas);
    --drx26-brand: var(--dds-brand);
    --drx26-brand-dark: var(--dds-brand-strong);
    --drx26-link: var(--dds-accent);
    --drx26-teal-soft: var(--dds-brand-soft);
    --drxsys-base: var(--dds-s4);
    --drxsys-brand: var(--dds-brand);
    --drxsys-brand-hover: var(--dds-brand-strong);
    --drxsys-brand-soft: var(--dds-brand-soft);
    --drxsys-canvas: var(--dds-canvas);
    --drxsys-control-line: var(--dds-control-line);
    --drxsys-focus: var(--dds-brand-strong);
    --drxsys-ink: var(--dds-ink);
    --drxsys-ink-soft: var(--dds-ink-2);
    --drxsys-line: var(--dds-line);
    --drxsys-measure: var(--dds-measure);
    --drxsys-muted: var(--dds-muted);
    --drxsys-radius: var(--dds-radius-md);
    --drxsys-radius-sm: var(--dds-radius-sm);
    --drxsys-s1: var(--dds-s1);
    --drxsys-s2: var(--dds-s2);
    --drxsys-s3: var(--dds-s3);
    --drxsys-s4: var(--dds-s4);
    --drxsys-s5: var(--dds-s5);
    --drxsys-s6: var(--dds-s6);
    --drxsys-s7: var(--dds-s7);
    --drxsys-s8: var(--dds-s8);
    --drxsys-sm: var(--dds-radius-md);
    --drxsys-surface: var(--dds-surface);
    --drxsys-tap: var(--dds-tap);
    --drxsys-xs: var(--dds-s3);
    --primary: var(--dds-brand);
    --sp-1: var(--dds-s1);
    --sp-12: var(--dds-s7);
    --sp-16: var(--dds-s8);
    --sp-2: var(--dds-s2);
    --sp-3: var(--dds-s3);
    --sp-4: var(--dds-s4);
    --sp-6: var(--dds-s5);
    --sp-8: var(--dds-s6);
}
}

html:root[data-theme="dark"], html:root .dark-theme, html:root [data-theme="dark"] {
  --dds-brand: #0d7a6b;
  --dds-brand-strong: #095f54;
  --dds-brand-soft: #e8f5f2;
  --dds-brand-line: #a7d4ce;
  --dds-on-brand: #ffffff;
  --dds-accent: #245a81;
  --dds-accent-strong: #1d4969;
  --dds-ink: #0f172a;
  --dds-ink-2: #334155;
  --dds-muted: #475569;
  --dds-faint: #64748b;
  --dds-canvas: #f6f8fa;
  --dds-surface: #ffffff;
  --dds-surface-2: #f1f5f9;
  --dds-line: #dce3eb;
  --dds-line-strong: #cbd5e1;
  --dds-control-line: #82939f;
  --dds-focus: #095f54;
  --dds-ok-fg: #166534;
  --dds-ok-bg: #edf9f0;
  --dds-ok-line: #b8e2c5;
  --dds-info-fg: #075985;
  --dds-info-bg: #e8f5fa;
  --dds-info-line: #bae0f0;
  --dds-caution-fg: #9a3412;
  --dds-caution-bg: #fff4e5;
  --dds-caution-line: #f6c995;
  --dds-critical-fg: #991b1b;
  --dds-critical-bg: #fef2f2;
  --dds-critical-line: #fecaca;
  --dds-class-biologico: #6d28d9;
  --dds-class-biologico-bg: #f5f3ff;
  --dds-class-jaki: #1d4ed8;
  --dds-class-jaki-bg: #eff6ff;
  --dds-class-topico: #0f766e;
  --dds-class-topico-bg: #f0fdfa;
  --dds-class-sistemico: #c2410c;
  --dds-class-sistemico-bg: #fff7ed;
  --dds-class-otro: #475569;
  --dds-class-otro-bg: #f8fafc;
  --c-amber-bg: var(--dds-caution-bg);
  --c-bg: var(--dds-surface);
  --c-blue-bg: var(--dds-surface-2);
  --c-border: var(--dds-line);
  --c-green-bg: var(--dds-ok-bg);
  --c-ink: var(--dds-ink);
  --c-ink-3: var(--dds-ink-2);
  --c-ink-4: var(--dds-faint);
  --c-navy: var(--dds-ink);
  --c-red-bg: var(--dds-critical-bg);
  --c-surface: var(--dds-canvas);
  --c-surface-2: var(--dds-surface-2);
  --c-surface-3: var(--dds-surface-2);
  --c-teal: var(--dds-brand);
  --c-teal-bg: var(--dds-surface-2);
  --c-teal-border: var(--dds-brand-line);
  --c-teal-dark: var(--dds-brand-strong);
  --drx-accent-danger: var(--dds-critical-fg);
  --drx-accent-danger-bg: var(--dds-critical-bg);
  --drx-accent-hover: var(--dds-brand-strong);
  --drx-accent-info: var(--dds-info-fg);
  --drx-accent-info-bg: var(--dds-info-bg);
  --drx-accent-primary: var(--dds-brand);
  --drx-accent-primary-hover: var(--dds-brand-strong);
  --drx-accent-soft: var(--dds-brand-soft);
  --drx-accent-success: var(--dds-ok-fg);
  --drx-accent-success-bg: var(--dds-ok-bg);
  --drx-accent-warning: var(--dds-caution-fg);
  --drx-accent-warning-bg: var(--dds-caution-bg);
  --drx-alt: var(--dds-surface-2);
  --drx-badge-biologico: var(--dds-class-biologico);
  --drx-badge-biologico-bg: var(--dds-class-biologico-bg);
  --drx-badge-jaki: var(--dds-class-jaki);
  --drx-badge-jaki-bg: var(--dds-class-jaki-bg);
  --drx-badge-otro: var(--dds-class-otro);
  --drx-badge-otro-bg: var(--dds-canvas);
  --drx-badge-sistemico: var(--dds-class-sistemico);
  --drx-badge-sistemico-bg: var(--dds-class-sistemico-bg);
  --drx-badge-topico: var(--dds-class-topico);
  --drx-badge-topico-bg: var(--dds-class-topico-bg);
  --drx-bg: var(--dds-canvas);
  --drx-bg-elevated: var(--dds-surface);
  --drx-bg-inset: var(--dds-line);
  --drx-bg-primary: var(--dds-surface);
  --drx-bg-secondary: var(--dds-canvas);
  --drx-bg-tertiary: var(--dds-surface-2);
  --drx-blue-subtle: var(--dds-surface-2);
  --drx-border: var(--dds-line);
  --drx-border-default: var(--dds-line);
  --drx-border-strong: var(--dds-line-strong);
  --drx-border-subtle: var(--dds-surface-2);
  --drx-brand: var(--dds-brand);
  --drx-brand-dark: var(--dds-brand-strong);
  --drx-c-brand: var(--dds-brand);
  --drx-c-brand-soft: var(--dds-brand-soft);
  --drx-c-brand-strong: var(--dds-brand-strong);
  --drx-c-ink: var(--dds-ink);
  --drx-c-ink-soft: var(--dds-ink-2);
  --drx-c-line: var(--dds-line);
  --drx-c-muted: var(--dds-muted);
  --drx-canvas: var(--dds-canvas);
  --drx-content-max: var(--dds-measure);
  --drx-danger-bg: var(--dds-critical-bg);
  --drx-divider: var(--dds-line);
  --drx-ds-bg: var(--dds-canvas);
  --drx-ds-danger: var(--dds-critical-fg);
  --drx-ds-danger-bg: var(--dds-critical-bg);
  --drx-ds-info: var(--dds-info-fg);
  --drx-ds-info-bg: var(--dds-info-bg);
  --drx-ds-muted: var(--dds-muted);
  --drx-ds-ok: var(--dds-ok-fg);
  --drx-ds-ok-bg: var(--dds-ok-bg);
  --drx-ds-primary: var(--dds-brand-strong);
  --drx-ds-retired-bg: var(--dds-canvas);
  --drx-ds-sep: var(--dds-line);
  --drx-ds-warn: var(--dds-caution-fg);
  --drx-ds-warn-bg: var(--dds-caution-bg);
  --drx-font-mono: var(--dds-font-mono);
  --drx-font-reading: var(--dds-font-body);
  --drx-font-ui: var(--dds-font-ui);
  --drx-gray-100: var(--dds-surface-2);
  --drx-gray-200: var(--dds-line);
  --drx-gray-300: var(--dds-line-strong);
  --drx-gray-50: var(--dds-canvas);
  --drx-gray-500: var(--dds-faint);
  --drx-gray-600: var(--dds-muted);
  --drx-gray-700: var(--dds-ink-2);
  --drx-gray-900: var(--dds-ink);
  --drx-header-height: 56px;
  --drx-line: var(--dds-line);
  --drx-line-strong: var(--dds-line-strong);
  --drx-navy: var(--dds-ink);
  --drx-ok: var(--dds-ok-fg);
  --drx-ok-bg: var(--dds-ok-bg);
  --drx-paper: var(--dds-canvas);
  --drx-petrol-l: var(--dds-brand-soft);
  --drx-primary: var(--dds-brand);
  --drx-primary-dark: var(--dds-brand-strong);
  --drx-primary-hover: var(--dds-brand-strong);
  --drx-primary-soft: var(--dds-brand-soft);
  --drx-radius-lg: var(--dds-radius-md);
  --drx-radius-md: var(--dds-radius-sm);
  --drx-radius-sm: var(--dds-radius-sm);
  --drx-radius-xl: var(--dds-radius-lg);
  --drx-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--dds-focus) 25%, transparent);
  --drx-shadow-lg: var(--dds-shadow-md);
  --drx-shadow-md: var(--dds-shadow-md);
  --drx-shadow-sm: var(--dds-shadow-sm);
  --drx-space-1: var(--dds-s1);
  --drx-space-12: var(--dds-s7);
  --drx-space-16: var(--dds-s8);
  --drx-space-2: var(--dds-s2);
  --drx-space-3: var(--dds-s3);
  --drx-space-4: var(--dds-s4);
  --drx-space-6: var(--dds-s5);
  --drx-space-8: var(--dds-s6);
  --drx-surface: var(--dds-surface);
  --drx-surface-2: var(--dds-surface-2);
  --drx-surface-offset: var(--dds-surface-2);
  --drx-surface-soft: var(--dds-canvas);
  --drx-text: var(--dds-ink);
  --drx-text-2: var(--dds-muted);
  --drx-text-inverse: var(--dds-on-brand);
  --drx-text-primary: var(--dds-ink);
  --drx-text-secondary: var(--dds-muted);
  --drx-text-tertiary: var(--dds-faint);
  --drx-transition-base: var(--dds-duration) var(--dds-ease);
  --drx-transition-fast: 120ms ease;
  --drx-transition-slow: 350ms ease;
  --drx-ui-brand: var(--dds-brand);
  --drx-ui-brand-hover: var(--dds-brand-strong);
  --drx-ui-brand-soft: var(--dds-brand-soft);
  --drx-ui-canvas: var(--dds-canvas);
  --drx-ui-content-width: var(--dds-content-width);
  --drx-ui-control-radius: var(--dds-radius-sm);
  --drx-ui-danger: var(--dds-critical-fg);
  --drx-ui-danger-line: var(--dds-critical-line);
  --drx-ui-danger-soft: var(--dds-critical-bg);
  --drx-ui-focus: var(--dds-focus);
  --drx-ui-font: var(--dds-font-ui);
  --drx-ui-info-soft: var(--dds-info-bg);
  --drx-ui-ink: var(--dds-ink);
  --drx-ui-line: var(--dds-line);
  --drx-ui-line-strong: var(--dds-line-strong);
  --drx-ui-muted: var(--dds-muted);
  --drx-ui-paper: var(--dds-surface);
  --drx-ui-radius: var(--dds-radius-md);
  --drx-ui-radius-sm: var(--dds-radius-sm);
  --drx-ui-reading-width: var(--dds-measure);
  --drx-ui-soft: var(--dds-brand-soft);
  --drx-ui-success: var(--dds-ok-fg);
  --drx-ui-success-line: var(--dds-ok-line);
  --drx-ui-success-soft: var(--dds-ok-bg);
  --drx-ui-surface: var(--dds-surface);
  --drx-ui-surface-alt: var(--dds-surface-2);
  --drx-ui-warning: var(--dds-caution-fg);
  --drx-ui-warning-soft: var(--dds-caution-bg);
  --drx-warn-bg: var(--dds-caution-bg);
  --drx2-line: var(--dds-line);
  --drx2-soft: var(--dds-canvas);
  --drx26-brand: var(--dds-brand);
  --drx26-brand-dark: var(--dds-brand-strong);
  --drx26-link: var(--dds-accent);
  --drx26-teal-soft: var(--dds-brand-soft);
  --drxsys-base: var(--dds-s4);
  --drxsys-brand: var(--dds-brand);
  --drxsys-brand-hover: var(--dds-brand-strong);
  --drxsys-brand-soft: var(--dds-brand-soft);
  --drxsys-canvas: var(--dds-canvas);
  --drxsys-control-line: var(--dds-control-line);
  --drxsys-focus: var(--dds-brand-strong);
  --drxsys-ink: var(--dds-ink);
  --drxsys-ink-soft: var(--dds-ink-2);
  --drxsys-line: var(--dds-line);
  --drxsys-measure: var(--dds-measure);
  --drxsys-muted: var(--dds-muted);
  --drxsys-radius: var(--dds-radius-md);
  --drxsys-radius-sm: var(--dds-radius-sm);
  --drxsys-s1: var(--dds-s1);
  --drxsys-s2: var(--dds-s2);
  --drxsys-s3: var(--dds-s3);
  --drxsys-s4: var(--dds-s4);
  --drxsys-s5: var(--dds-s5);
  --drxsys-s6: var(--dds-s6);
  --drxsys-s7: var(--dds-s7);
  --drxsys-s8: var(--dds-s8);
  --drxsys-sm: var(--dds-radius-md);
  --drxsys-surface: var(--dds-surface);
  --drxsys-tap: var(--dds-tap);
  --drxsys-xs: var(--dds-s3);
  --primary: var(--dds-brand);
  --sp-1: var(--dds-s1);
  --sp-12: var(--dds-s7);
  --sp-16: var(--dds-s8);
  --sp-2: var(--dds-s2);
  --sp-3: var(--dds-s3);
  --sp-4: var(--dds-s4);
  --sp-6: var(--dds-s5);
  --sp-8: var(--dds-s6);
}

@media (prefers-reduced-motion: reduce) {
  html:root { --dds-duration: 0ms; --drx-transition-fast: 0ms; --drx-transition-base: 0ms; --drx-transition-slow: 0ms; }
}
