:root {
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-ui: "PB Retro", "Courier New", monospace;

--color-text: #2b241f;
--color-text-soft: #4f473f;

--text-body-sm: 15px;
--text-body-md: 17px;
--text-body-lg: 20px;

  --text-ui-sm: 18px;
  --text-ui-md: 20px;
  --text-ui-lg: 24px;

  --lh-tight: 1.05;
  --lh-base: 1.4;
  --lh-loose: 1.55;

  --shadow-1: 1px 1px 0 rgba(0, 0, 0, 0.16);
  --shadow-2: 2px 2px 0 rgba(0, 0, 0, 0.18);
  --shadow-3: 3px 3px 0 rgba(0, 0, 0, 0.20);

  --bevel-ui-light: #ffffff;
  --bevel-ui-dark: #5c6472;
  --bevel-panel-light: #faf7f1;
  --bevel-panel-dark: #877c6e;

  --color-bg: #d6d1c8;
  --color-panel: #e6e1d7;
  --color-panel-2: #f2eee6;

  --color-ui: #e4e8ee;
  --color-ui-2: #f4f7fb;

  --color-text: #1d1a16;
  --color-text-soft: #5d564d;
  --color-ui-text: #101317;
  --color-ui-text-soft: #4a5462;

  --color-line-light: #faf7f1;
  --color-line-dark: #877c6e;

  --color-ui-line-light: var(--bevel-ui-light);
  --color-ui-line-dark: var(--bevel-ui-dark);

  --color-accent: #3a63e8;
  --color-accent-dark: #2748b8;
  --color-accent-warm: #b98b4b;

  --control-height-sm: 36px;
  --control-height-md: 44px;
  --control-height-lg: 48px;

  --z-map: 1;
  --z-map-tint: 2;
  --z-map-grain: 3;
  --z-map-fog: 4;
  --z-map-ui: 5;
  --z-mobile-ui: 30;
  --z-bottom-sheet: 35;
}