/* Unilux Design System 2 — camada operacional para produtos digitais. */
@font-face {
  font-family: "Metropolis";
  src: url("Metropolis-Regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Metropolis";
  src: url("Metropolis-Medium.otf") format("opentype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Metropolis";
  src: url("Metropolis-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --unilux-paper: #F6F6F6;
  --unilux-ink: #1A1919;
  --unilux-sand: #B9AA8A;
  --unilux-soil: #332D23;
  --unilux-wine: #7C2741;
  --unilux-moss: #4B683E;
  --unilux-night: #1A4251;

  --ui-font: "Metropolis", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ui-bg-app: #F1EFEA;
  --ui-bg-surface: #FAFAF8;
  --ui-bg-raised: #FFFFFF;
  --ui-bg-sunken: #ECEAE5;
  --ui-bg-hover: rgba(26, 25, 25, 0.04);
  --ui-bg-active: rgba(26, 25, 25, 0.07);
  --ui-bg-selected: rgba(26, 66, 81, 0.06);
  --ui-border: rgba(26, 25, 25, 0.10);
  --ui-border-strong: rgba(26, 25, 25, 0.20);
  --ui-text-secondary: rgba(26, 25, 25, 0.64);
  --ui-text-tertiary: rgba(26, 25, 25, 0.46);

  --ui-success: #4B683E;
  --ui-success-soft: #EBEFE8;
  --ui-success-border: #C4D2BB;
  --ui-danger: #7C2741;
  --ui-danger-soft: #F3E7EA;
  --ui-danger-border: #E0C1C9;
  --ui-info: #1A4251;
  --ui-info-soft: #E5EDF0;
  --ui-info-border: #B9CFD6;
  --ui-warning: #9A6B22;
  --ui-warning-soft: #F4ECDD;
  --ui-warning-border: #DEC9A0;

  --ui-space-1: 2px;
  --ui-space-2: 4px;
  --ui-space-3: 6px;
  --ui-space-4: 8px;
  --ui-space-5: 12px;
  --ui-space-6: 16px;
  --ui-space-7: 20px;
  --ui-space-8: 24px;
  --ui-space-9: 32px;
  --ui-space-10: 40px;
  --ui-space-11: 48px;
  --ui-space-12: 64px;

  --ui-control-h: 40px;
  --ui-row-h: 48px;
  --ui-touch-min: 44px;
  --ui-radius-xs: 3px;
  --ui-radius-sm: 5px;
  --ui-radius-md: 8px;
  --ui-radius-lg: 12px;
  --ui-elev-1: 0 1px 2px rgba(26, 25, 25, 0.05), 0 1px 1px rgba(26, 25, 25, 0.03);
  --ui-elev-2: 0 2px 6px rgba(26, 25, 25, 0.06), 0 1px 2px rgba(26, 25, 25, 0.04);
  --ui-elev-3: 0 8px 24px rgba(26, 25, 25, 0.10), 0 2px 6px rgba(26, 25, 25, 0.06);
  --ui-elev-4: 0 20px 48px rgba(26, 25, 25, 0.16), 0 6px 16px rgba(26, 25, 25, 0.08);
  --ui-focus-ring: rgba(26, 66, 81, 0.22);
  --ui-dur-instant: 90ms;
  --ui-dur-fast: 140ms;
  --ui-dur-base: 200ms;
  --ui-dur-slow: 300ms;
  --ui-ease: cubic-bezier(0.2, 0, 0, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ui-dur-instant: 0ms;
    --ui-dur-fast: 0ms;
    --ui-dur-base: 0ms;
    --ui-dur-slow: 0ms;
  }
}