@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow%20Condensed:wght@300;400;500;600;700;800;900&display=swap');
:root {
  --x-default-theme: dark;
  --primary: 44 70% 45%;
  --accent: 60 20% 95%;
  --app-font-sans: 'Barlow', sans-serif;
  --app-font-weight-body: 400;
  --app-font-size-body: 15px;
  --app-font-serif: 'Barlow Condensed', Georgia, serif;
  --app-font-weight-heading: 700;
  --app-font-size-heading: 15px;
  --app-text-transform-body: none;
  --app-text-transform-heading: uppercase;
  --background: 0 0% 11%;
  --card: 0 0% 14%;
  --popover: 0 0% 14%;
  --border: 0 0% 20%;
  --muted: 0 0% 16%;
  --input: 0 0% 20%;
}
:root:not(.dark) {
  --background: 0 0% 100%;
  --card: 0 0% 100%;
  --popover: 0 0% 100%;
  --border: 0 0% 100%;
  --muted: 0 0% 100%;
  --input: 0 0% 100%;
}
:root.dark {
  --background: 0 0% 11%;
  --card: 0 0% 14%;
  --popover: 0 0% 14%;
  --border: 0 0% 20%;
  --muted: 0 0% 16%;
  --input: 0 0% 20%;
}