:root {
  --flow-bg: #fcfcfa;
  --flow-surface: rgba(255, 255, 255, 0.76);
  --flow-soft: #f7f6f2;
  --flow-text: #1f2320;
  --flow-muted: rgba(31, 35, 32, 0.64);
  --flow-line: rgba(83, 105, 87, 0.13);
  --flow-green: #2f513a;
  --flow-green-dark: #243f2e;
  --flow-sage: #536957;
  --flow-serif: "Noto Serif SC", "Songti SC", "STSong", serif;
  --flow-sans: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html,
body {
  background: var(--flow-bg) !important;
  color: var(--flow-text) !important;
  font-family: var(--flow-sans) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(239, 245, 239, 0.68), rgba(252, 252, 250, 0) 380px),
    radial-gradient(circle at 88% 8%, rgba(251, 242, 234, 0.78), transparent 28%);
}

h1,
h2,
h3,
h4,
.font-serif,
.serif {
  font-family: var(--flow-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

nav.sticky,
body > nav {
  min-height: 72px;
  border-bottom: 1px solid rgba(83, 105, 87, 0.08) !important;
  background: rgba(252, 252, 250, 0.94) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

nav img,
body > nav img {
  width: 42px !important;
  height: 42px !important;
}

nav .font-serif.text-2xl,
nav .serif,
body > nav .font-serif.text-2xl {
  color: var(--flow-green) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
}

a,
button {
  text-underline-offset: 4px;
}

button,
input,
select,
textarea,
a[class*="rounded"],
.rounded-full,
.rounded-2xl,
.rounded-\[1\.25rem\],
.rounded-\[1\.5rem\],
.rounded-\[1\.75rem\],
.rounded-\[2rem\],
.rounded-\[18px\],
.rounded-\[24px\],
.rounded-\[30px\],
.rounded-\[34px\] {
  border-radius: 4px !important;
}

.shadow-sm,
.shadow-lg,
.shadow-2xl,
.shadow-inner {
  box-shadow: none !important;
}

button[class*="bg-gradient"],
a[class*="bg-gradient"],
.primary,
.qimen-ai-submit,
.qimen-ai-chat-send,
#submit-btn {
  border: 1px solid transparent !important;
  background: var(--flow-green) !important;
  color: #fff !important;
  box-shadow: none !important;
}

button[class*="bg-gradient"]:hover,
a[class*="bg-gradient"]:hover,
.primary:hover,
.qimen-ai-submit:hover,
.qimen-ai-chat-send:hover,
#submit-btn:hover {
  background: var(--flow-green-dark) !important;
}

input,
select,
textarea {
  border-color: var(--flow-line) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(83, 105, 87, 0.38) !important;
  outline: none !important;
  box-shadow: none !important;
}

.shell,
.panel,
.qimen-chat-hero,
.qimen-chat-panel,
.qimen-auth-modal,
.qimen-chart-preview,
main section,
#card-selectors > div,
#chat-section > div,
.about-card,
.rounded-\[1\.75rem\].border,
.rounded-\[2rem\].border {
  border-color: var(--flow-line) !important;
  background: var(--flow-surface) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px);
}

.intro,
.qimen-chat-hero {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(247, 246, 242, 0.62)),
    radial-gradient(circle at 92% 8%, rgba(217, 186, 120, 0.13), transparent 30%) !important;
  color: var(--flow-text) !important;
}

.intro p,
.qimen-chat-hero p,
p,
li {
  color: var(--flow-muted) !important;
}

.intro .eyebrow,
.qimen-ai-kicker,
.qimen-chat-panel__eyebrow,
.text-brand-700,
.text-forest-600 {
  color: var(--flow-sage) !important;
}

.intro h1,
.qimen-chat-hero h1,
.qimen-chat-panel__head h2,
.text-brand-900,
.text-forest-600 {
  color: var(--flow-green) !important;
}

.tabs {
  border-color: var(--flow-line) !important;
  background: rgba(247, 246, 242, 0.72) !important;
}

.tab.active {
  background: #fff !important;
  color: var(--flow-green) !important;
  box-shadow: none !important;
}

.note,
.legal-consents,
.qimen-ai-legal-note,
.qimen-ai-result-note,
.qimen-ai-access-box {
  border-color: rgba(83, 105, 87, 0.14) !important;
  background: rgba(239, 245, 239, 0.58) !important;
  color: var(--flow-muted) !important;
}

.msg-bubble,
.qimen-ai-bubble {
  border-color: var(--flow-line) !important;
  box-shadow: none !important;
}

.qimen-ai-bubble.is-user {
  background: var(--flow-green) !important;
  color: #fff !important;
}

.qimen-ai-bubble.is-user * {
  color: #fff !important;
}

#shunliu-account-status {
  top: 17px !important;
  right: max(28px, env(safe-area-inset-right)) !important;
}

body > nav > div:first-child {
  padding-right: clamp(150px, 13vw, 210px) !important;
}

@media (max-width: 760px) {
  #shunliu-account-status {
    right: max(96px, env(safe-area-inset-right)) !important;
  }

  body > nav > div:first-child {
    padding-right: 118px !important;
  }

  main,
  .qimen-chat-page {
    width: min(100%, calc(100vw - 28px)) !important;
    padding-top: 24px !important;
  }

  .shell {
    display: block !important;
  }

  .intro,
  .panel,
  .qimen-chat-hero,
  .qimen-chat-panel {
    padding: 24px !important;
  }
}