/* Twilight tokens. Source of truth: design/reference.html */
:root {
  --bg-center: #433d62;
  --bg-edge: #201d34;
  --bg: radial-gradient(95% 70% at 50% 36%, var(--bg-center) 0%, var(--bg-edge) 100%);
  --bg-lock: radial-gradient(110% 80% at 30% 20%, #3a3556 0%, #14121f 100%);

  --fg: #e6e1f4;
  --fg-title: #efeaf9;
  --fg-sub: #b6aed2;
  --fg-small: #9a92b8;

  --ring-width: 1.5px;
  --ring-rgb: 206, 196, 236;
  --ring-glow-rgb: 190, 175, 236;
  --orb: radial-gradient(circle, #e2dbf5 0%, #b6a9e0 40%, rgba(146, 130, 204, .6) 80%, rgba(138, 122, 196, 0) 100%);
  --orb-min-scale: .55;

  --btn-bg: #cfc6ee;
  --btn-fg: #2a2545;
  --btn-q-border: rgba(207, 198, 238, .45);
  --btn-q-fg: #d9d2f1;
  --card-bg: rgba(255, 255, 255, .07);
  --card-border: rgba(207, 198, 238, .18);
  --chip-bg: rgba(255, 255, 255, .09);
  --chip-border: rgba(207, 198, 238, .22);

  --f-head: 'Newsreader', Georgia, serif;
  --f-body: 'DM Sans', system-ui, sans-serif;

  --touch: 44px;
}