/* «Шалфей» — adapted from myMoney. Onest is self-hosted; see fonts/OFL.txt. */
@font-face {
  font-family: 'Onest Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('/fonts/onest-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Onest Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('/fonts/onest-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF, U+FEFF, U+FFFD;
}
/* Values follow the «Шалфей» (sage) skin of myMoney: frontend/src/ui/tokens.css, [data-skin="sage"]. */
:root {
  --font-sans: 'Onest Variable', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bg: #e9e7e2;
  --paper: #fff;
  --surface-2: #f2f1ed;
  --surface-3: #e6e4de;
  --ink: #1c1e1b;
  --secondary: #50554f;
  --muted: #62675f;
  --line: #d9d5cc;
  --green: #3f6b52;
  --green-strong: #2f5640;
  --green-soft: #e3ebe4;
  --on-green: #fff;
  --nav-active: #1c1e1b;
  --on-nav-active: #fff;
  --hero: #3d5946;
  --hero-bg: linear-gradient(135deg, #47644f, #354d3e);
  --hero-shadow: 0 22px 44px -22px rgb(53 77 62 / 60%);
  --on-hero: #fff;
  --hero-secondary: #e0e9df;
  --positive: #1d7a45;
  --positive-soft: #e0f3e7;
  --orange: #8a5a00;
  --orange-soft: #fbf0d9;
  --red: #b3261e;
  --red-soft: #fbe5e3;
  --info: #1f5f99;
  --info-soft: #e1edf8;
  --radius: 22px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 22px;
  --radius-control: 12px;
  --tap: 44px;
  --shadow: 0 1px 2px rgb(24 26 22 / 4%), 0 14px 34px -18px rgb(24 26 22 / 16%);
  --shadow-pop: 0 12px 32px rgb(24 26 22 / 16%);
  --shadow-sheet: 0 24px 60px rgb(24 26 22 / 26%);
  --shadow-dock: 0 -8px 24px -14px rgb(24 26 22 / 28%);
  --shadow-raise: 0 2px 8px rgb(24 26 22 / 10%);
  --overlay: rgb(24 26 22 / 40%);
  --focus: #3f6b52;
  /* M-05 charts: validated pair (dataviz validator, light on #fff) */
  --chart-1: #2e7d4f;
  --chart-2: #6250d6;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  /* M-01c: motion of myMoney (ui/tokens.css) */
  --dur-fast: 160ms;
  --dur-base: 240ms;
  --dur-slow: 600ms;
  --dur-exit: 180ms;
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* a small overshoot: a press */
  color-scheme: light;
  font-synthesis: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #121412;
    --paper: #1c1f1c;
    --surface-2: #252925;
    --surface-3: #2f342f;
    --ink: #ecebe6;
    --secondary: #bfc2bb;
    --muted: #9a9f97;
    --line: #3b413b;
    --green: #8fbf9f;
    --green-strong: #a9d1b6;
    --green-soft: #24352a;
    --on-green: #102016;
    --nav-active: #ecebe6;
    --on-nav-active: #141614;
    --hero: #304e3b;
    --hero-bg: linear-gradient(135deg, #3f5e49, #283b2f);
    --hero-shadow: 0 22px 44px -22px rgb(0 0 0 / 80%);
    --hero-secondary: #e0e9df;
    --positive: #6fd39a;
    --positive-soft: #173324;
    --orange: #f2c14e;
    --orange-soft: #3a2f14;
    --red: #ff8a80;
    --red-soft: #3a1c1a;
    --info: #8cbcf0;
    --info-soft: #1a2a3b;
    --focus: #a9d1b6;
    --chart-1: #3f9a66;
    --chart-2: #9085e9;
    --shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 14px 34px -18px rgb(0 0 0 / 70%);
    --shadow-pop: 0 12px 32px rgb(0 0 0 / 55%);
    --shadow-sheet: 0 24px 60px rgb(0 0 0 / 65%);
    --shadow-dock: 0 -8px 24px -12px rgb(0 0 0 / 70%);
    --shadow-raise: 0 2px 8px rgb(0 0 0 / 45%);
    --overlay: rgb(0 0 0 / 60%);
    color-scheme: dark;
  }
}
:root[data-theme='dark'] {
  --bg: #121412;
  --paper: #1c1f1c;
  --surface-2: #252925;
  --surface-3: #2f342f;
  --ink: #ecebe6;
  --secondary: #bfc2bb;
  --muted: #9a9f97;
  --line: #3b413b;
  --green: #8fbf9f;
  --green-strong: #a9d1b6;
  --green-soft: #24352a;
  --on-green: #102016;
  --nav-active: #ecebe6;
  --on-nav-active: #141614;
  --hero: #304e3b;
  --hero-bg: linear-gradient(135deg, #3f5e49, #283b2f);
  --hero-shadow: 0 22px 44px -22px rgb(0 0 0 / 80%);
  --hero-secondary: #e0e9df;
  --positive: #6fd39a;
  --positive-soft: #173324;
  --orange: #f2c14e;
  --orange-soft: #3a2f14;
  --red: #ff8a80;
  --red-soft: #3a1c1a;
  --info: #8cbcf0;
  --info-soft: #1a2a3b;
  --focus: #a9d1b6;
  --chart-1: #3f9a66;
  --chart-2: #9085e9;
  --shadow: 0 1px 2px rgb(0 0 0 / 40%), 0 14px 34px -18px rgb(0 0 0 / 70%);
  --shadow-pop: 0 12px 32px rgb(0 0 0 / 55%);
  --shadow-sheet: 0 24px 60px rgb(0 0 0 / 65%);
  --shadow-dock: 0 -8px 24px -12px rgb(0 0 0 / 70%);
  --shadow-raise: 0 2px 8px rgb(0 0 0 / 45%);
  --overlay: rgb(0 0 0 / 60%);
  color-scheme: dark;
}