/* FONTS */

@import url("https://fonts.googleapis.com/css2?family=Forum&family=PT+Mono&family=Poppins:wght@300;400;500;600&display=swap");

/* RESET */

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;

  background-color: #4e0009;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

button,
input[type="submit"] {
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  list-style: none;
}

/* VARIABLES */

:root {
  --bg-primary: rgba(78, 0, 9, 1);
  --bg-surface: rgba(78, 0, 9, 0.1);
  --bg-on-surface: rgba(58, 0, 5, 0.5);

  --fg-primary: rgba(255, 180, 168, 1);
  --fg-secondary: rgba(192, 122, 111, 1);
  --fg-on-primary: rgba(78, 0, 9, 1);
  --fg-disabled: rgba(153, 87, 77, 1);
  --fg-placeholder: rgba(153, 87, 77, 1);

  --border-primary: rgba(255, 180, 168, 1);
  --border-surface: rgba(255, 180, 168, 0.1);

  --font-display: "Forum", serif;
  --font-body: "Poppins", sans-serif;
  --font-mono: "PT Mono", monospace;
}