/* Universo Vendas — design tokens. Paleta do Universo (magenta, champanhe, ameixa) com a escala e o ritmo da Apple. */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/inter-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", "Segoe UI", system-ui, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, monospace;

  /* marca */
  --brand: #b91468;
  --brand-2: #e5398a;
  --brand-3: #7d0e46;
  --brand-wash: #fce9f1;
  --brand-glow: rgba(185, 20, 104, .35);
  --violet: #6f3c8c;
  --gold: #d6be91;

  /* superfícies (claro) */
  --bg: #fbf7f9;
  --bg-2: #f5eef2;
  --surface: #ffffff;
  --surface-2: #fcf5f8;
  --glass: rgba(255, 255, 255, .72);
  --ink: #1d1a1c;
  --ink-2: #5f5058;
  --ink-3: #94838c;
  --line: rgba(35, 20, 30, .1);
  --line-strong: rgba(35, 20, 30, .18);
  --overlay: rgba(20, 8, 16, .45);

  /* estados */
  --ok: #1e8a5a;
  --ok-wash: #e3f5ec;
  --warn: #b7791f;
  --warn-wash: #fdf1d8;
  --bad: #d23b3b;
  --bad-wash: #fde7e7;
  --info: #2d6fd6;
  --info-wash: #e4eefc;

  /* formas e profundidade */
  --r-xs: 8px; --r-sm: 12px; --r-md: 18px; --r-lg: 24px; --r-xl: 32px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(40, 10, 28, .06), 0 1px 1px rgba(40, 10, 28, .04);
  --shadow-2: 0 2px 6px rgba(40, 10, 28, .05), 0 12px 32px -12px rgba(40, 10, 28, .16);
  --shadow-3: 0 4px 12px rgba(40, 10, 28, .06), 0 32px 64px -24px rgba(185, 20, 104, .28);
  --ring: 0 0 0 4px rgba(185, 20, 104, .18);

  /* movimento */
  --ease: cubic-bezier(.28, .11, .32, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: .18s; --t: .35s; --t-slow: .7s;

  --nav-h: 56px;
  --side-w: 248px;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #0b0709;
  --bg-2: #120c0f;
  --surface: #171013;
  --surface-2: #1e1519;
  --glass: rgba(23, 16, 19, .72);
  --ink: #f6f0f3;
  --ink-2: #c4b4bc;
  --ink-3: #8a7882;
  --line: rgba(255, 235, 245, .1);
  --line-strong: rgba(255, 235, 245, .18);
  --overlay: rgba(0, 0, 0, .6);
  --brand: #f0509b;
  --brand-2: #ff7ab8;
  --brand-3: #b91468;
  --brand-wash: #2b1220;
  --brand-glow: rgba(240, 80, 155, .35);
  --ok: #3fc78a; --ok-wash: #11291f;
  --warn: #f0b84a; --warn-wash: #2c2210;
  --bad: #ff6b6b; --bad-wash: #301515;
  --info: #6ea2ff; --info-wash: #14213a;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .5);
  --shadow-2: 0 2px 6px rgba(0, 0, 0, .4), 0 12px 32px -12px rgba(0, 0, 0, .6);
  --shadow-3: 0 4px 12px rgba(0, 0, 0, .4), 0 32px 64px -24px rgba(240, 80, 155, .3);
  --ring: 0 0 0 4px rgba(240, 80, 155, .28);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0b0709; --bg-2: #120c0f; --surface: #171013; --surface-2: #1e1519; --glass: rgba(23, 16, 19, .72);
    --ink: #f6f0f3; --ink-2: #c4b4bc; --ink-3: #8a7882; --line: rgba(255, 235, 245, .1); --line-strong: rgba(255, 235, 245, .18);
    --overlay: rgba(0, 0, 0, .6); --brand: #f0509b; --brand-2: #ff7ab8; --brand-3: #b91468; --brand-wash: #2b1220; --brand-glow: rgba(240, 80, 155, .35);
    --ok: #3fc78a; --ok-wash: #11291f; --warn: #f0b84a; --warn-wash: #2c2210; --bad: #ff6b6b; --bad-wash: #301515; --info: #6ea2ff; --info-wash: #14213a;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .5);
    --shadow-2: 0 2px 6px rgba(0, 0, 0, .4), 0 12px 32px -12px rgba(0, 0, 0, .6);
    --shadow-3: 0 4px 12px rgba(0, 0, 0, .4), 0 32px 64px -24px rgba(240, 80, 155, .3);
    --ring: 0 0 0 4px rgba(240, 80, 155, .28);
    color-scheme: dark;
  }
}