:root {
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html,
body,
#app {
  margin: 0;
  min-height: 100%;
}

body {
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  color: #111827;
  background:
    radial-gradient(circle at top left, rgba(59, 130, 246, 0.08), transparent 28%),
    linear-gradient(180deg, #f8fbff 0%, #f4f7fb 50%, #eef2f7 100%);
}

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

.line-clamp-1 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.animate-in.slide-in-from-right {
  animation: slide-in-from-right 0.28s ease-out both;
}

.animate-in.slide-in-from-top-4 {
  animation: slide-in-from-top 0.22s ease-out both;
}

.animate-in.zoom-in-95 {
  animation: zoom-in-95 0.18s ease-out both;
}

@keyframes slide-in-from-right {
  from {
    opacity: 0;
    transform: translateX(28px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slide-in-from-top {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes zoom-in-95 {
  from {
    opacity: 0;
    transform: scale(0.95);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}