/**
 * Dooriax brand foundation — phase 1.
 * Tokens are namespaced so the SaaS can migrate independently of HomeFront.
 */
:root {
  --dx-ink: #10221d;
  --dx-ink-raised: #18342b;
  --dx-field: #167a5a;
  --dx-field-hover: #116447;
  --dx-field-soft: #dceee7;
  --dx-lime: #c8f45d;
  --dx-lime-hover: #b8e74d;
  --dx-blue: #3478f6;
  --dx-blue-hover: #245fd0;
  --dx-blue-text: #245fd0;
  --dx-paper: #f6f7f2;
  --dx-surface: #ffffff;
  --dx-surface-raised: #fbfcf8;
  --dx-on-ink: #ffffff;
  --dx-on-ink-muted: #a7b8b1;
  --dx-on-ink-subtle: #9fb0aa;
  --dx-slate: #61706a;
  --dx-slate-strong: #43524c;
  --dx-mist: #dde3de;
  --dx-mist-strong: #c3cdc6;
  --dx-warning: #a9680c;
  --dx-warning-text: #875006;
  --dx-warning-soft: #fff0cf;
  --dx-critical: #b62e32;
  --dx-critical-soft: #fde5e5;
  --dx-success: #167a5a;
  --dx-focus: #3478f6;

  --dx-font-sans:
    "Geist", "Geist Fallback", Inter, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
  --dx-font-mono:
    "Geist Mono", "Geist Mono Fallback", "SFMono-Regular", Consolas, monospace;

  --dx-text-xs: 0.75rem;
  --dx-text-sm: 0.875rem;
  --dx-text-md: 1rem;
  --dx-text-lg: 1.25rem;
  --dx-text-xl: clamp(1.75rem, 2.5vw, 2.5rem);
  --dx-text-display: clamp(2.5rem, 5vw, 5rem);

  --dx-space-1: 0.25rem;
  --dx-space-2: 0.5rem;
  --dx-space-3: 0.75rem;
  --dx-space-4: 1rem;
  --dx-space-5: 1.5rem;
  --dx-space-6: 2rem;
  --dx-space-7: 3rem;
  --dx-space-8: 4.5rem;

  --dx-radius-control: 0.625rem;
  --dx-radius-surface: 0.875rem;
  --dx-radius-round: 999px;

  --dx-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dx-duration-fast: 140ms;
  --dx-duration-base: 220ms;

  --dx-shadow-raised: 0 12px 32px rgb(16 34 29 / 0.09);
  --dx-shadow-command: 0 38px 100px rgb(0 0 0 / 0.42);
  --dx-shadow-overlay: 0 12px 30px rgb(0 0 0 / 0.22);
}

.dx-theme {
  color-scheme: light;
  color: var(--dx-ink);
  background: var(--dx-paper);
  font-family: var(--dx-font-sans);
  font-feature-settings: "cv11", "ss01", "ss03";
  accent-color: var(--dx-field);
}

.dx-theme ::selection {
  color: var(--dx-ink);
  background: var(--dx-lime);
}

.dx-theme :focus-visible {
  outline: 3px solid var(--dx-focus);
  outline-offset: 3px;
}

.dx-tabular {
  font-variant-numeric: tabular-nums slashed-zero;
}

.dx-data {
  font-family: var(--dx-font-mono);
  font-variant-numeric: tabular-nums slashed-zero;
}

@media (prefers-reduced-motion: reduce) {
  .dx-theme *,
  .dx-theme *::before,
  .dx-theme *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}