:root {
  --bg:        #f0f2f5;
  --bg2:       #ffffff;
  --bg3:       #e4e8ef;
  --border:    #c8cfd9;
  --border2:   #b0bac9;
  --text:      #1a2232;
  --text2:     #4a5568;
  --text3:     #8a97aa;
  --accent:    #1a6ef5;
  --accent-l:  #e8f0fe;
  --green:     #0da86a;
  --green-l:   #e6f7f1;
  --red:       #e03030;
  --red-l:     #fde8e8;
  --orange:    #e07820;
  --u:         min(1vw, 1.6vh);
  --nav-w:     clamp(60px, 5vw, 150px);
  --top-h:     clamp(44px, 5vh, 120px);
  --sens-h:    clamp(68px, 8vh, 190px);
  --mono:      'JetBrains Mono', monospace;
  --ui:        'Manrope', sans-serif;
  --r:         clamp(4px, calc(0.5 * var(--u)), 14px);
  --r2:        clamp(6px, calc(0.7 * var(--u)), 20px);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; overflow: hidden; background: var(--bg); color: var(--text); font-family: var(--ui); }
button { cursor: pointer; font-family: inherit; }