/* ==========================================================================
   Reset
========================================================================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font: inherit;
  font-family: Arial, Helvetica, sans-serif;
}

html {
  height: 100%;
}

body {
  height: 100%;
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

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

/* ==========================================================================
   Root
========================================================================== */

:root {
  --shadow-color: 0deg 0% 0%;
  --shadow-elevation-low: 0.2px 0.3px 0.3px hsl(var(--shadow-color) / 0.25),
    0.4px 0.4px 0.5px -2.1px hsl(var(--shadow-color) / 0.18),
    1.1px 1.2px 1.4px -4.2px hsl(var(--shadow-color) / 0.11);
  --shadow-elevation-medium: 0.2px 0.3px 0.3px hsl(var(--shadow-color) / 0.21),
    0.4px 0.5px 0.6px -1.1px hsl(var(--shadow-color) / 0.17),
    1.1px 1.2px 1.4px -2.1px hsl(var(--shadow-color) / 0.14),
    2.6px 2.9px 3.4px -3.2px hsl(var(--shadow-color) / 0.11),
    5.6px 6.2px 7.2px -4.2px hsl(var(--shadow-color) / 0.07);
  --shadow-elevation-high: 0.2px 0.3px 0.3px hsl(var(--shadow-color) / 0.21),
    0.7px 0.8px 0.9px -0.5px hsl(var(--shadow-color) / 0.19),
    1.4px 1.6px 1.8px -1.1px hsl(var(--shadow-color) / 0.18),
    2.8px 3.1px 3.6px -1.6px hsl(var(--shadow-color) / 0.16),
    5.2px 5.7px 6.7px -2.1px hsl(var(--shadow-color) / 0.14),
    9px 9.9px 11.5px -2.7px hsl(var(--shadow-color) / 0.12),
    14.6px 16.1px 18.7px -3.2px hsl(var(--shadow-color) / 0.1),
    22.4px 24.7px 28.8px -3.7px hsl(var(--shadow-color) / 0.08),
    32.7px 36px 41.9px -4.2px hsl(var(--shadow-color) / 0.06);
}

/* ==========================================================================
   Body
========================================================================== */

#body {
  background-image: linear-gradient(#252422, #403d39);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.body-container {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 7fr;
  height: 100vh;
  gap: 4rem;
}

.leaderboard-names-container p {
  font-size: 1.2rem;
  color: #fffcf2;
}

.ant-btn-primary {
  background-color: #eb5e28;
  box-shadow: var(--shadow-elevation-medium);
}

.ant-btn-primary:hover {
  border-color: #ccc5b9;
  background-color: #eb5e28;
  transform: scale(1.1);
}

.ant-btn-primary:active {
  border-color: #ccc5b9;
  translate: 0 0.5rem;
  color: #ccc5b9;
}