@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=ZCOOL+QingKe+HuangYou&display=swap");

:root {
  --bg1: #f4f5f7 !important;
  --bg2: #f4f5f7 !important;
  --ink: #111111 !important;
  --ink-soft: #6b7280 !important;
  --ink-faint: #9ca3af !important;
  --line: rgba(17, 17, 17, 0.08) !important;
  --line-strong: rgba(17, 17, 17, 0.14) !important;
  --surface: #ffffff !important;
  --gold: #2f65f5 !important;
  --gold-soft: #e8f3ff !important;
  --gold-deep: #1d4ed8 !important;
  --radius: 18px !important;
  --shadow: 0 14px 32px rgba(17, 17, 17, 0.06) !important;
  --shadow-hi: 0 18px 40px rgba(47, 101, 245, 0.12) !important;
  --group: #2f65f5 !important;
  --group-soft: #e8f3ff !important;
  --priv: #374151 !important;
  --priv-soft: #f3f4f6 !important;
}

html {
  background: #f4f5f7 !important;
}

body {
  font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif !important;
  background: #f4f5f7 !important;
  color: #111111 !important;
  animation: none !important;
}

.att-home,
.att-back {
  background: rgba(255, 255, 255, 0.72) !important;
  border: none !important;
  border-radius: 999px !important;
  color: #111111 !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.5) !important;
  backdrop-filter: blur(12px) !important;
}

.att-home:hover,
.att-back:hover {
  background: #111111 !important;
  color: #ffffff !important;
}

.kicker {
  color: #2f65f5 !important;
  letter-spacing: 0.18em !important;
}

.knight-header h1 {
  font-family: "ZCOOL QingKe HuangYou", "PingFang SC", "Microsoft YaHei", sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
}

.knight-header .contact {
  color: #6b7280 !important;
}

.btn-ghost,
.campus-del,
.inst-del,
.del,
.inst-add,
.inst-toggle,
.campus-picker button,
.panel-copy {
  border-radius: 999px !important;
  font-family: Inter, sans-serif !important;
  font-weight: 500 !important;
}

.btn-ghost {
  background: #ffffff !important;
  color: #111111 !important;
  border: 1px solid rgba(17, 17, 17, 0.1) !important;
}

.btn-ghost:hover {
  background: #e8f3ff !important;
  border-color: #93c5fd !important;
  color: #1d4ed8 !important;
}

input[type="date"],
.field input[type="text"],
td input,
td select {
  border-radius: 12px !important;
  border-color: rgba(17, 17, 17, 0.14) !important;
  background: #ffffff !important;
}

input[type="date"]:focus,
.field input[type="text"]:focus,
td input:focus,
td select:focus {
  border-color: #2f65f5 !important;
  box-shadow: 0 0 0 3px rgba(47, 101, 245, 0.14) !important;
}

.count {
  background: #ffffff !important;
  border: 1px solid rgba(17, 17, 17, 0.08) !important;
  color: #6b7280 !important;
}

.count::before {
  background: #2f65f5 !important;
  box-shadow: 0 0 0 3px #e8f3ff !important;
}

.campus {
  border: 1px solid rgba(17, 17, 17, 0.08) !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 32px rgba(17, 17, 17, 0.06) !important;
}

.campus::before {
  background: linear-gradient(#2f65f5, #46b9ff) !important;
}

.campus-head {
  background: #f8fafc !important;
  border-bottom-color: rgba(17, 17, 17, 0.08) !important;
}

.campus-picker {
  border-radius: 16px !important;
  border-color: rgba(17, 17, 17, 0.1) !important;
}

.campus-picker button {
  background: #e8f3ff !important;
  color: #1d4ed8 !important;
  border-color: #bfdbfe !important;
}

.campus-picker button:hover {
  background: #2f65f5 !important;
  color: #ffffff !important;
  border-color: #2f65f5 !important;
}

.empty-tip {
  background: rgba(255, 255, 255, 0.8) !important;
  border-color: rgba(17, 17, 17, 0.12) !important;
}

.sub-head.group {
  background: #e8f3ff !important;
  color: #1d4ed8 !important;
}

.sub-head.priv {
  background: #f3f4f6 !important;
  color: #374151 !important;
}

.sub-head.group .add {
  background: #2f65f5 !important;
}

.sub-head.group .add:hover {
  background: #1d4ed8 !important;
}

.sub-head.priv .add {
  background: #111111 !important;
}

.sub-head.priv .add:hover {
  background: #374151 !important;
}

.inst-group {
  border-color: rgba(17, 17, 17, 0.08) !important;
  border-radius: 14px !important;
}

.inst-head {
  background: #f8fafc !important;
}

.inst-eyebrow {
  color: #2f65f5 !important;
}

.inst-pick {
  background: #f4f5f7 !important;
}

.chip {
  border-radius: 999px !important;
  background: #ffffff !important;
  border-color: rgba(17, 17, 17, 0.12) !important;
  transition:
    transform 0.5s cubic-bezier(0.16, 1.18, 0.22, 1),
    background 0.28s ease,
    border-color 0.28s ease,
    color 0.22s ease !important;
}

.chip:hover {
  border-color: #2f65f5 !important;
  color: #1d4ed8 !important;
}

.chip:active {
  transform: scale(0.94) !important;
  transition: transform 0.08s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.chip.on {
  background: #e8f3ff !important;
  border-color: #93c5fd !important;
  color: #1d4ed8 !important;
  transform: scale(1.04);
}

.inst-add {
  background: #e8f3ff !important;
  color: #1d4ed8 !important;
  border-color: #bfdbfe !important;
}

.inst-add:hover {
  background: #2f65f5 !important;
  color: #ffffff !important;
  border-color: #2f65f5 !important;
}

th {
  background: #f8fafc !important;
  color: #9ca3af !important;
}

.out-head h3 {
  font-family: "ZCOOL QingKe HuangYou", "PingFang SC", sans-serif !important;
  font-weight: 400 !important;
}

.out-head .tag {
  background: #e8f3ff !important;
  color: #1d4ed8 !important;
}

.panel {
  border-color: rgba(17, 17, 17, 0.08) !important;
  border-radius: 18px !important;
  box-shadow: 0 14px 32px rgba(17, 17, 17, 0.06) !important;
}

.panel-bar {
  background: #111111 !important;
  color: #9ca3af !important;
}

.panel-copy {
  background: #2f65f5 !important;
  color: #ffffff !important;
  border: none !important;
}

.panel-copy:hover {
  background: #1d4ed8 !important;
  box-shadow: 0 8px 18px rgba(47, 101, 245, 0.28) !important;
}

.panel textarea {
  background: #111827 !important;
  color: #e5e7eb !important;
}

.out .hint code {
  background: #e8f3ff !important;
  color: #1d4ed8 !important;
}

.toast {
  background: #111111 !important;
}

.campus-head .c-campus:focus {
  border-bottom-color: #2f65f5 !important;
}

button,
.att-home,
.att-back,
.panel-copy {
  transition:
    transform 0.52s cubic-bezier(0.16, 1.18, 0.22, 1),
    box-shadow 0.45s cubic-bezier(0.16, 1.18, 0.22, 1),
    background 0.28s ease,
    color 0.22s ease,
    border-color 0.22s ease !important;
}

button:active,
.att-home:active,
.att-back:active,
.panel-copy:active {
  transform: scale(0.96) translateY(1px) !important;
  transition:
    transform 0.08s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.08s ease !important;
}