:root {
  --navy-950: #050914;
  --navy-900: #070b18;
  --navy-850: #0a1022;
  --navy-800: #0d1730;
  --navy-700: #13214a;
  --navy-600: #1a2b5c;
  --gold-1: #ffd24a;
  --gold-2: #ffb000;
  --gold-3: #ff8a00;
  --gold-1-rgb: 255, 210, 74;
  --gold-2-rgb: 255, 176, 0;
  --home: #ffb000;
  --away: #59c3ff;
  --text: #f4f7ff;
  --muted: #9fb0cc;
  --line: rgba(255, 255, 255, 0.12);
  --danger: #ff5a5f;
  --ok: #3ddc97;
  --radius: 10px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", "Source Han Sans SC",
    sans-serif;
  color: var(--text);
  background: var(--navy-950);
  -webkit-font-smoothing: antialiased;
}

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

button {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

a {
  color: var(--gold-1);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

.gold-text {
  background: linear-gradient(180deg, var(--gold-1), var(--gold-2) 55%, var(--gold-3));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}