:root {
  color-scheme: light dark;
  --ky-bg-0: #f8fbff;
  --ky-bg-1: #edf7ff;
  --ky-ink: #142033;
  --ky-muted: #64748b;
  --ky-panel: rgba(255, 255, 255, 0.74);
  --ky-panel-strong: rgba(255, 255, 255, 0.88);
  --ky-border: rgba(91, 132, 185, 0.22);
  --ky-border-strong: rgba(73, 123, 191, 0.34);
  --ky-cyan: #13c8d5;
  --ky-blue: #4377ff;
  --ky-rose: #ff5d9e;
  --ky-gold: #ffc759;
  --ky-green: #35d399;
  --ky-shadow: 0 22px 70px rgba(35, 67, 120, 0.18);
}

:root.dark,
.dark {
  --ky-bg-0: #08111f;
  --ky-bg-1: #101a2c;
  --ky-ink: #edf7ff;
  --ky-muted: #a6b6ca;
  --ky-panel: rgba(12, 21, 37, 0.68);
  --ky-panel-strong: rgba(15, 25, 45, 0.84);
  --ky-border: rgba(141, 186, 255, 0.18);
  --ky-border-strong: rgba(124, 204, 255, 0.34);
  --ky-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
}

html.keyuan-image-theme {
  min-height: 100%;
  background:
    radial-gradient(circle at 11% 13%, rgba(67, 119, 255, 0.26), transparent 29rem),
    radial-gradient(circle at 87% 9%, rgba(255, 93, 158, 0.22), transparent 28rem),
    radial-gradient(circle at 78% 78%, rgba(19, 200, 213, 0.2), transparent 28rem),
    linear-gradient(135deg, var(--ky-bg-0) 0%, var(--ky-bg-1) 47%, #fff7ea 100%);
}

html.keyuan-image-theme.dark,
html.keyuan-image-theme:has(.dark) {
  background:
    radial-gradient(circle at 13% 12%, rgba(67, 119, 255, 0.34), transparent 30rem),
    radial-gradient(circle at 86% 10%, rgba(255, 93, 158, 0.26), transparent 30rem),
    radial-gradient(circle at 75% 78%, rgba(19, 200, 213, 0.2), transparent 30rem),
    linear-gradient(135deg, #07101f 0%, #0e1a2f 47%, #151126 100%);
}

body {
  background: transparent !important;
  color: var(--ky-ink);
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}

body::before {
  opacity: 0.42;
  background-image:
    linear-gradient(rgba(67, 119, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(19, 200, 213, 0.08) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, black 0%, transparent 76%);
}

body::after {
  background:
    conic-gradient(from 210deg at 18% 24%, rgba(255, 199, 89, 0.18), transparent 26%, rgba(19, 200, 213, 0.14), transparent 45%),
    conic-gradient(from 20deg at 82% 68%, rgba(255, 93, 158, 0.16), transparent 22%, rgba(67, 119, 255, 0.15), transparent 46%);
  filter: blur(18px);
  opacity: 0.72;
}

#root {
  min-height: 100vh;
  isolation: isolate;
}

h1,
h2,
h3 {
  letter-spacing: 0;
}

h1,
[class*="text-3xl"],
[class*="text-4xl"] {
  color: var(--ky-ink);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45);
}

.dark h1,
.dark [class*="text-3xl"],
.dark [class*="text-4xl"] {
  text-shadow: 0 0 28px rgba(91, 204, 255, 0.18);
}

[class*="bg-white"],
[class*="dark:bg-gray-"],
[class*="dark:bg-slate-"],
[class*="bg-gray-50"],
[class*="bg-gray-100"],
[class*="bg-slate-50"],
[class*="bg-slate-100"] {
  background-color: var(--ky-panel) !important;
  border-color: var(--ky-border) !important;
  box-shadow: var(--ky-shadow);
}

[class*="border"] {
  border-color: var(--ky-border) !important;
}

[class*="shadow"] {
  box-shadow: var(--ky-shadow) !important;
}

button,
a[role="button"],
[type="button"],
[type="submit"] {
  border-color: rgba(67, 119, 255, 0.26) !important;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease,
    color 180ms ease;
}

button:hover,
a[role="button"]:hover,
[type="button"]:hover,
[type="submit"]:hover {
  transform: translateY(-1px);
  border-color: var(--ky-border-strong) !important;
  box-shadow: 0 14px 36px rgba(67, 119, 255, 0.18);
}

button:active,
a[role="button"]:active,
[type="button"]:active,
[type="submit"]:active {
  transform: translateY(0);
}

button[class*="bg-blue"],
button[class*="bg-indigo"],
button[class*="bg-purple"],
button[class*="bg-primary"],
[type="submit"],
a[class*="bg-blue"],
a[class*="bg-indigo"],
a[class*="bg-purple"] {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  background:
    linear-gradient(135deg, rgba(67, 119, 255, 1), rgba(19, 200, 213, 0.95) 52%, rgba(255, 93, 158, 0.95)) !important;
  box-shadow: 0 16px 42px rgba(54, 111, 238, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

input,
textarea,
select {
  color: var(--ky-ink) !important;
  background-color: var(--ky-panel-strong) !important;
  border-color: var(--ky-border) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 10px 30px rgba(35, 67, 120, 0.08);
  outline: none !important;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background-color 180ms ease;
}

input:focus,
textarea:focus,
select:focus {
  border-color: rgba(19, 200, 213, 0.62) !important;
  box-shadow:
    0 0 0 4px rgba(19, 200, 213, 0.13),
    0 16px 44px rgba(67, 119, 255, 0.12);
}

textarea::placeholder,
input::placeholder {
  color: color-mix(in srgb, var(--ky-muted) 72%, transparent);
}

img,
canvas,
video {
  border-radius: inherit;
}

[class*="rounded-xl"],
[class*="rounded-2xl"],
[class*="rounded-3xl"] {
  border-radius: 18px !important;
}

[class*="rounded-lg"] {
  border-radius: 14px !important;
}

[class*="text-gray-500"],
[class*="text-gray-600"],
[class*="text-slate-500"],
[class*="text-slate-600"] {
  color: var(--ky-muted) !important;
}

[class*="ring"] {
  --tw-ring-color: rgba(19, 200, 213, 0.24) !important;
}

[class*="divide"] > :not([hidden]) ~ :not([hidden]) {
  border-color: rgba(111, 151, 207, 0.18) !important;
}

html.keyuan-image-theme [class*="fixed"][class*="inset-0"] {
  position: fixed !important;
  inset: 0 !important;
}

html.keyuan-image-theme [class*="z-[70]"][class*="items-center"][class*="justify-center"],
html.keyuan-image-theme [class*="z-[80]"][class*="flex-col"] {
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
}

html.keyuan-image-theme body:has([class*="fixed"][class*="inset-0"]) #root,
html.keyuan-image-theme body:has([class*="fixed"][class*="inset-0"]) #root > * {
  transform: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  contain: none !important;
  perspective: none !important;
}

html.keyuan-image-theme [role="dialog"],
html.keyuan-image-theme [aria-modal="true"] {
  max-height: min(86vh, 760px);
}

html.keyuan-image-theme body {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

@media (prefers-reduced-motion: no-preference) {
  body::after {
    animation: ky-aurora 16s ease-in-out infinite alternate;
  }
}

@keyframes ky-aurora {
  from {
    transform: translate3d(-1.5%, -1%, 0) scale(1);
  }
  to {
    transform: translate3d(1.5%, 1%, 0) scale(1.04);
  }
}

@media (max-width: 640px) {
  body::before {
    background-size: 34px 34px;
  }

  [class*="rounded-xl"],
  [class*="rounded-2xl"],
  [class*="rounded-3xl"] {
    border-radius: 16px !important;
  }
}