/* Nexa Box Office Mail design tokens: one type scale, one spacing scale, one accent over a neutral ramp. */
:root {
  --rm-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --rm-mono: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;

  --rm-fs-xs: 11px;
  --rm-fs-sm: 12px;
  --rm-fs-md: 13px;
  --rm-fs-base: 14px;
  --rm-fs-lg: 16px;
  --rm-fs-xl: 20px;
  --rm-fs-2xl: 24px;

  --rm-s1: 4px;
  --rm-s2: 8px;
  --rm-s3: 12px;
  --rm-s4: 16px;
  --rm-s5: 24px;
  --rm-s6: 32px;

  --rm-radius-sm: 6px;
  --rm-radius: 10px;
  --rm-radius-lg: 14px;
  --rm-pill: 999px;

  --rm-bg: #f3f4f6;
  --rm-surface: #ffffff;
  --rm-surface-2: #f6f7f9;
  --rm-surface-3: #eceef1;
  --rm-border: #e4e7eb;
  --rm-border-strong: #cfd5db;
  --rm-text: #16191d;
  --rm-text-2: #3f4752;
  --rm-muted: #66707b;
  --rm-faint: #9aa3ad;

  --rm-accent: #d7192d;
  --rm-accent-hover: #b81426;
  --rm-accent-ink: #ffffff;
  --rm-accent-text: #bf1729;
  --rm-accent-soft: #fce7ea;
  --rm-accent-softer: #fff3f5;

  --rm-danger: #d33a2c;
  --rm-danger-soft: #fdecea;
  --rm-success: #1f8a4c;
  --rm-warn: #9a6700;
  --rm-warn-soft: #fff6dc;
  --rm-flag: #e8a400;

  --rm-code-bg: #f4f5f7;
  --rm-code-border: #e3e6ea;
  --rm-code-text: #1f2328;
  --rm-inline-code-bg: rgba(110, 118, 129, .14);

  --rm-paper: #ffffff;
  --rm-paper-text: #1f2328;

  --rm-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --rm-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04);
  --rm-shadow-lg: 0 18px 48px rgba(15, 23, 42, .20), 0 3px 8px rgba(15, 23, 42, .08);
  --rm-ring: 0 0 0 3px rgba(215, 25, 45, .22);
  --rm-ease: cubic-bezier(.2, .7, .2, 1);

  color-scheme: light;
}

html.dark-mode {
  --rm-bg: #0d0f12;
  --rm-surface: #15181c;
  --rm-surface-2: #1b1f24;
  --rm-surface-3: #23282e;
  --rm-border: #252a31;
  --rm-border-strong: #353c45;
  --rm-text: #e7e9ec;
  --rm-text-2: #c3c8ce;
  --rm-muted: #8d959f;
  --rm-faint: #626a74;

  --rm-accent: #ef334a;
  --rm-accent-hover: #ff5267;
  --rm-accent-ink: #ffffff;
  --rm-accent-text: #ff99a5;
  --rm-accent-soft: rgba(239, 51, 74, .18);
  --rm-accent-softer: rgba(239, 51, 74, .09);

  --rm-danger: #ff7a6e;
  --rm-danger-soft: rgba(255, 110, 96, .14);
  --rm-success: #5fd394;
  --rm-warn: #f2c14e;
  --rm-warn-soft: rgba(242, 193, 78, .12);
  --rm-flag: #f2b630;

  --rm-code-bg: #0f1215;
  --rm-code-border: #2a3038;
  --rm-code-text: #e6e8eb;
  --rm-inline-code-bg: rgba(140, 150, 165, .18);

  --rm-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --rm-shadow: 0 1px 3px rgba(0, 0, 0, .45);
  --rm-shadow-lg: 0 18px 48px rgba(0, 0, 0, .55), 0 3px 10px rgba(0, 0, 0, .35);
  --rm-ring: 0 0 0 3px rgba(92, 140, 255, .35);

  color-scheme: dark;
}

html, body {
  font-family: var(--rm-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection { background: rgba(215, 25, 45, .25); }

*:focus-visible { outline: none; box-shadow: var(--rm-ring) !important; }

* { scrollbar-width: thin; scrollbar-color: var(--rm-border-strong) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--rm-border-strong); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background-color: var(--rm-faint); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}