:root {
  --gj-red: #e60012;
  --gj-red-dark: #b8000f;
  --gj-red-soft: #fff1f2;
  --gj-ink: #1d1d1f;
  --gj-muted: #6e6e73;
}

[v-cloak] {
  display: none !important;
}

body {
  background: #f7f7f8;
  color: var(--gj-ink);
}

.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, #e60012, #b8000f) !important;
}

.hero::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 14px;
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: rgba(255,255,255,.96) url("../../assets/guojian-logo.png") center / 82% auto no-repeat;
  box-shadow: 0 14px 32px rgba(92, 0, 7, .18);
}

.hero h1,
.hero p,
.home-link {
  position: relative;
  z-index: 1;
}

.home-link {
  background: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

.btn.primary,
.btn,
button.primary,
.tab.active {
  background: var(--gj-red) !important;
  border-color: var(--gj-red) !important;
  color: #fff !important;
}

.btn.ghost,
.tab {
  background: #fff !important;
  color: var(--gj-red) !important;
  border-color: rgba(230,0,18,.18) !important;
}

.tag,
.status {
  background: var(--gj-red-soft) !important;
  color: var(--gj-red) !important;
}

.avatar,
.icon {
  background: linear-gradient(145deg, var(--gj-red), var(--gj-red-dark)) !important;
  color: #fff !important;
}

.panel,
.card,
.detail,
.menu {
  border-color: rgba(230, 0, 18, .1) !important;
}

.name,
.title {
  color: var(--gj-ink);
}