:root {
  --bg: #070b14;
  --panel: rgba(10, 16, 32, 0.78);
  --line: rgba(255, 255, 255, 0.12);
  --text: #f4f7ff;
  --muted: rgba(244, 247, 255, 0.62);
  --accent: #6ee7ff;
  --danger: #ff6b6b;
  --ok: #7dffa2;
  font-family: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", sans-serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  width: 100%;
  height: 100%;
  background: var(--bg);
  color: var(--text);
  overflow: hidden;
}

button {
  font: inherit;
  color: inherit;
}

.appear-1 { --skin: #ff4d4f; }
.appear-2 { --skin: #faad14; }
.appear-3 { --skin: #52c41a; }
.appear-4 { --skin: #1677ff; }
.appear-5 { --skin: #722ed1; }
.appear-6 { --skin: #13c2c2; }
.appear-7 { --skin: #eb2f96; }
.appear-8 { --skin: #fa8c16; }
.appear-9 { --skin: #2f54eb; }
.appear-10 { --skin: #a0d911; }
.appear-11 { --skin: #8c8c8c; }
.appear-12 { --skin: #6b7c93; }
.appear-13 { --skin: #a63d3d; }
