/* Tokens do Lupin Vida. Mesma família visual do site da Lupin Tec: papel claro, azul como tinta. */
@font-face {
  font-family: 'Space Grotesk'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url(../fonts/space-grotesk-latin.woff2) format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 100 800; font-display: swap;
  src: url(../fonts/jetbrains-mono-latin.woff2) format('woff2');
}

:root {
  color-scheme: light;
  --bg: #F7F9FC;
  --surface: #FFFFFF;
  --surface-2: #EFF2F7;
  --line: #E2E7EF;
  --line-strong: #CBD3E0;
  --field-line: #7A8799;
  --ink: #121821;
  --ink-2: #333B47;
  --muted: #5C6775;
  --accent: #245C9B;
  --accent-deep: #17457A;
  --accent-soft: #EAF1FA;
  --accent-line: #A9C4E8;
  --btn: #245C9B;
  --btn-ink: #FFFFFF;
  --ok: #1B7A4B;     --ok-soft: #E6F4EC;   --ok-line: #BFE0CE;
  --warn: #8A5200;   --warn-soft: #FFF3DC; --warn-line: #F0D49A;
  --bad: #B3261E;    --bad-soft: #FCECEA;  --bad-line: #F4CFCB;
  --info: #245C9B;   --info-soft: #EAF1FA; --info-line: #A9C4E8;
  --shadow-1: 0 1px 2px rgba(10, 31, 59, .05), 0 0 0 1px rgba(10, 31, 59, .05);
  --shadow-2: 0 10px 30px -12px rgba(10, 31, 59, .28), 0 0 0 1px rgba(10, 31, 59, .06);
  --scrim: rgba(10, 24, 41, .46);
  --s0: #245C9B; --s1: #1F8A7A; --s2: #B26F00; --s3: #7A5AC7; --s4: #C4475A; --s5: #5C6775; --s6: #3D74B5; --s7: #2E9E5B;

  --font: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-pill: 999px;
  --t-xs: .8125rem; --t-sm: .9375rem; --t-base: 1rem; --t-lg: 1.125rem; --t-xl: 1.375rem; --t-2xl: 1.75rem; --t-3xl: 2.25rem;
  --dur: 160ms; --ease: cubic-bezier(.2, .7, .2, 1);
  --nav-h: 64px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0C121B; --surface: #151D29; --surface-2: #1C2634; --line: #263245; --line-strong: #34445B; --field-line: #6D7F99;
    --ink: #EAF0F8; --ink-2: #C5D0DE; --muted: #93A2B7;
    --accent: #7FA9DB; --accent-deep: #A9C4E8; --accent-soft: #14253B; --accent-line: #2C4C75;
    --btn: #3D74B5; --btn-ink: #FFFFFF;
    --ok: #5CCB95; --ok-soft: #12291F; --ok-line: #1E4A38;
    --warn: #F0B454; --warn-soft: #2B2112; --warn-line: #5A4217;
    --bad: #FF8A80; --bad-soft: #301816; --bad-line: #62302B;
    --info: #7FA9DB; --info-soft: #14253B; --info-line: #2C4C75;
    --shadow-1: 0 0 0 1px rgba(255, 255, 255, .06);
    --shadow-2: 0 14px 34px -14px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .08);
    --scrim: rgba(0, 0, 0, .62);
    --s0: #6E9BD1; --s1: #4DC3AE; --s2: #E5A23A; --s3: #A58BE8; --s4: #F0788A; --s5: #93A2B7; --s6: #9CC0EA; --s7: #5CCB95;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0C121B; --surface: #151D29; --surface-2: #1C2634; --line: #263245; --line-strong: #34445B; --field-line: #6D7F99;
  --ink: #EAF0F8; --ink-2: #C5D0DE; --muted: #93A2B7;
  --accent: #7FA9DB; --accent-deep: #A9C4E8; --accent-soft: #14253B; --accent-line: #2C4C75;
  --btn: #3D74B5; --btn-ink: #FFFFFF;
  --ok: #5CCB95; --ok-soft: #12291F; --ok-line: #1E4A38;
  --warn: #F0B454; --warn-soft: #2B2112; --warn-line: #5A4217;
  --bad: #FF8A80; --bad-soft: #301816; --bad-line: #62302B;
  --info: #7FA9DB; --info-soft: #14253B; --info-line: #2C4C75;
  --shadow-1: 0 0 0 1px rgba(255, 255, 255, .06);
  --shadow-2: 0 14px 34px -14px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .08);
  --scrim: rgba(0, 0, 0, .62);
  --s0: #6E9BD1; --s1: #4DC3AE; --s2: #E5A23A; --s3: #A58BE8; --s4: #F0788A; --s5: #93A2B7; --s6: #9CC0EA; --s7: #5CCB95;
}