* {
  margin: 0;
}

:root {
  --color-background: #1f1f1f;
  --color-background-object: #1a1a1a;
  --color-text-regular: #ffffff;
  --color-border: #555;

  --color-primary: #ffffff;
  --color-primary-dim: #1a1a1a;

  --color-confirm: hsla(110, 100%, 50%, 1);
  --color-confirm-dim: hsla(110, 100%, 50%, 0.25);

  --color-danger: hsla(338, 100%, 50%, 1);
  --color-danger-dim: hsla(338, 100%, 50%, 0.25);

  --color-action: hsla(200, 100%, 50%, 1);
  --color-action-dim: hsla(200, 100%, 50%, 0.25);

  --border-width: 0.5px;
  --border-style: solid;
  --border-regular: var(--border-width) var(--border-style) var(--color-border);
  --border-radius-regular: 5px;

  --shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;

  --transition: all 300ms;
}

body {
  background-color: var(--color-background);
  color: var(--color-text-regular);
}