/* ============================================================================
   少十元 · 暖纸主题 (shaoshiyuan-theme.css)
   参照设计稿：paper 暖底 / 暖墨字 / 玫瑰+金色点缀 / 液态玻璃 / 大圆角
   定位：只覆盖 token 与少量组件质感，不动布局与功能，可整文件删除回退
   加载方式：nginx sub_filter 注入 </head>，最后加载以覆盖 base 变量
   ========================================================================== */

/* ---------- 1. 设计变量 ---------- */
:root {
  /* 纸面 */
  --sy-paper:      #faf5ef;
  --sy-paper-2:    #f3ece2;
  --sy-paper-3:    #ece2d5;
  --sy-ink:        #261e22;
  --sy-ink-2:      #4a3d43;
  --sy-ink-3:      #7d6b62;
  --sy-rose:       #c96f8b;
  --sy-rose-deep:  #a34f6c;
  --sy-rose-soft:  #f0d5dd;
  --sy-gold:       #c0905a;
  --sy-gold-soft:  #eddfc9;
  --sy-jade:       #6f9e90;
  --sy-night:      #1e1719;
  --sy-red:        #dc4a28;
  --sy-line:       #e7dbcd;
  --sy-line-soft:  #f0e7db;

  /* 字体：中文优先系统字体，衬线用于展示标题 */
  --font-ui-sans: -apple-system, BlinkMacSystemFont, "PingFang SC",
                  "HarmonyOS Sans SC", "Microsoft YaHei UI", "Microsoft YaHei",
                  "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  --sy-serif: "Songti SC", "Noto Serif SC", "Source Han Serif SC",
              Georgia, "Times New Roman", serif;

  /* 基础圆角：比默认更圆润 */
  --radius: 0.9rem !important;

  /* ---- shadcn / Tailwind token 覆盖（浅色） ---- */
  --background: var(--sy-paper) !important;
  --foreground: var(--sy-ink) !important;
  --card: #fffdfa !important;
  --card-foreground: var(--sy-ink) !important;
  --popover: #fffdfa !important;
  --popover-foreground: var(--sy-ink) !important;

  /* 主色：暖墨按钮（对应设计稿 btn-ink） */
  --primary: var(--sy-ink) !important;
  --primary-foreground: var(--sy-paper) !important;

  --secondary: var(--sy-paper-2) !important;
  --secondary-foreground: var(--sy-ink-2) !important;

  --muted: var(--sy-paper-2) !important;
  --muted-foreground: var(--sy-ink-3) !important;

  /* 强调：玫瑰 */
  --accent: var(--sy-rose-soft) !important;
  --accent-foreground: var(--sy-rose-deep) !important;

  --destructive: var(--sy-red) !important;
  --destructive-foreground: #fff6ef !important;
  --success: var(--sy-jade) !important;
  --success-foreground: #f4fbf8 !important;
  --warning: var(--sy-gold) !important;
  --warning-foreground: #2b1d10 !important;
  --info: #6f93b3 !important;
  --info-foreground: #f4f9fd !important;
  --neutral: #a99a91 !important;

  --border: var(--sy-line) !important;
  --input: var(--sy-line) !important;
  --ring: var(--sy-rose) !important;

  /* 图表：暖色系 */
  --chart-1: var(--sy-rose) !important;
  --chart-2: var(--sy-gold) !important;
  --chart-3: var(--sy-jade) !important;
  --chart-4: #8a7fb5 !important;
  --chart-5: #d98b5f !important;

  /* 侧栏 */
  --sidebar: #fffdfa !important;
  --sidebar-foreground: var(--sy-ink) !important;
  --sidebar-primary: var(--sy-ink) !important;
  --sidebar-primary-foreground: var(--sy-paper) !important;
  --sidebar-accent: var(--sy-paper-2) !important;
  --sidebar-accent-foreground: var(--sy-ink) !important;
  --sidebar-border: var(--sy-line) !important;

  /* Tailwind v4 颜色别名 */
  --color-background: var(--sy-paper) !important;
  --color-foreground: var(--sy-ink) !important;
  --color-card: #fffdfa !important;
  --color-border: var(--sy-line) !important;
  --color-primary: var(--sy-ink) !important;
  --color-muted: var(--sy-paper-2) !important;
}

/* ---------- 2. 深色：夜墨底 ---------- */
.dark {
  --background: var(--sy-night) !important;
  --foreground: #f6efe8 !important;
  --card: #272022 !important;
  --card-foreground: #f6efe8 !important;
  --popover: #2b2326 !important;
  --popover-foreground: #f6efe8 !important;

  --primary: #e9c3d0 !important;
  --primary-foreground: #2a1f23 !important;

  --secondary: #332a2d !important;
  --secondary-foreground: #e7dcd4 !important;
  --muted: #2b2326 !important;
  --muted-foreground: #b6a79e !important;

  --accent: #3d2e33 !important;
  --accent-foreground: #f0d5dd !important;

  --destructive: #ff7a5c !important;
  --success: #8fc0b0 !important;
  --warning: #dcaa72 !important;
  --info: #8ab0cf !important;

  --border: #3a2f33 !important;
  --input: #3a2f33 !important;
  --ring: #d98ba4 !important;

  --chart-1: #e9a8bd !important;
  --chart-2: #d9ad79 !important;
  --chart-3: #8fc0b0 !important;
  --chart-4: #a79ed0 !important;
  --chart-5: #d99a72 !important;

  --sidebar: #241d1f !important;
  --sidebar-foreground: #f6efe8 !important;
  --sidebar-border: #3a2f33 !important;
  --sidebar-accent: #332a2d !important;
  --sidebar-accent-foreground: #f6efe8 !important;
  --sidebar-primary: #e9c3d0 !important;
  --sidebar-primary-foreground: #2a1f23 !important;

  --color-background: var(--sy-night) !important;
  --color-foreground: #f6efe8 !important;
  --color-card: #272022 !important;
  --color-border: #3a2f33 !important;
}

/* ---------- 3. 全局观感 ---------- */
html { -webkit-text-size-adjust: 100%; }

body {
  background-color: var(--sy-paper) !important;
  background-image:
    radial-gradient(900px 500px at 12% -8%, rgba(201, 111, 139, .07), transparent 62%),
    radial-gradient(760px 460px at 92% 4%, rgba(192, 144, 90, .07), transparent 60%),
    radial-gradient(680px 520px at 50% 108%, rgba(111, 158, 144, .05), transparent 64%) !important;
  background-attachment: fixed !important;
  color: var(--sy-ink);
  letter-spacing: .01em;
}

html.dark body {
  background-color: var(--sy-night) !important;
  background-image:
    radial-gradient(900px 520px at 10% -6%, rgba(201, 111, 139, .10), transparent 62%),
    radial-gradient(760px 480px at 94% 6%, rgba(192, 144, 90, .08), transparent 60%) !important;
}

/* 选中与滚动条 */
::selection { background: rgba(201, 111, 139, .22); color: var(--sy-rose-deep); }
html.dark ::selection { background: rgba(217, 139, 164, .28); color: #f6efe8; }

* { scrollbar-width: thin; scrollbar-color: #d9cabb transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #d9cabb; border-radius: 99px; border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: #c6b3a1; background-clip: content-box; }
html.dark ::-webkit-scrollbar-thumb { background: #4a3b3f; background-clip: content-box; }

/* 焦点环：玫瑰色，替代刺眼的默认蓝 */
:focus-visible { outline-color: var(--sy-rose) !important; }

/* ---------- 4. 顶栏：液态玻璃 ---------- */
header[class*="sticky"],
header[class*="fixed"],
[class*="app-header"],
nav[class*="sticky"] {
  background-color: rgba(250, 245, 239, .78) !important;
  -webkit-backdrop-filter: blur(18px) saturate(170%) brightness(1.04) !important;
  backdrop-filter: blur(18px) saturate(170%) brightness(1.04) !important;
  border-bottom: 1px solid rgba(231, 219, 205, .9) !important;
}

html.dark header[class*="sticky"],
html.dark header[class*="fixed"],
html.dark [class*="app-header"],
html.dark nav[class*="sticky"] {
  background-color: rgba(30, 23, 25, .72) !important;
  border-bottom: 1px solid rgba(58, 47, 51, .9) !important;
}

/* ---------- 5. 卡片与面板：纸感边框 + 柔和投影 ---------- */
[class*="bg-card"],
[class*="rounded-xl"]:not(button):not(a),
[class*="rounded-2xl"]:not(button):not(a) {
  box-shadow: 0 1px 2px rgba(60, 32, 20, .035), 0 12px 32px -22px rgba(60, 32, 20, .18);
}

html.dark [class*="bg-card"],
html.dark [class*="rounded-xl"]:not(button):not(a),
html.dark [class*="rounded-2xl"]:not(button):not(a) {
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 14px 34px -24px rgba(0, 0, 0, .6);
}

/* 分隔线更淡 */
[class*="border-b"], [class*="border-t"] { border-color: var(--sy-line-soft) !important; }
html.dark [class*="border-b"], html.dark [class*="border-t"] { border-color: #332a2d !important; }

/* ---------- 6. 按钮质感 ---------- */
button, [role="button"], a[class*="bg-primary"] {
  transition: transform .24s cubic-bezier(.34, 1.4, .64, 1),
              box-shadow .24s ease, background-color .2s ease, filter .2s ease;
}
button:not(:disabled):active, [role="button"]:not([aria-disabled="true"]):active {
  transform: scale(.978);
}

/* 主按钮：暖墨 + 内高光（对应设计稿 btn-ink） */
button[class*="bg-primary"],
a[class*="bg-primary"],
[class*="bg-primary"][role="button"] {
  background-image: linear-gradient(168deg, #35292e, #1f181b) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 10px 22px -14px rgba(38, 30, 34, .7) !important;
}
button[class*="bg-primary"]:hover,
a[class*="bg-primary"]:hover { filter: brightness(1.08); }

html.dark button[class*="bg-primary"],
html.dark a[class*="bg-primary"] {
  background-image: linear-gradient(168deg, #f2d6e0, #dcb4c4) !important;
  color: #2a1f23 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5),
              0 10px 24px -16px rgba(0, 0, 0, .8) !important;
}

/* 次级按钮：纸面 */
button[class*="bg-secondary"], a[class*="bg-secondary"] {
  background-image: linear-gradient(180deg, #fdf8f2, #f4ece1) !important;
}
html.dark button[class*="bg-secondary"], html.dark a[class*="bg-secondary"] {
  background-image: linear-gradient(180deg, #352b2e, #2b2326) !important;
}

/* ---------- 7. 表单控件 ---------- */
input, textarea, select, [class*="bg-input"] {
  border-radius: .7rem !important;
  background-color: #fffdfa !important;
}
html.dark input, html.dark textarea, html.dark select {
  background-color: #241d1f !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--sy-rose) !important;
  box-shadow: 0 0 0 3px rgba(201, 111, 139, .16) !important;
}
input::placeholder, textarea::placeholder { color: #a8978c !important; }

/* ---------- 8. 表格 ---------- */
table tbody tr:hover { background-color: rgba(201, 111, 139, .045) !important; }
html.dark table tbody tr:hover { background-color: rgba(217, 139, 164, .07) !important; }
thead th, [class*="bg-muted"][class*="text-"] {
  letter-spacing: .02em;
}

/* 表头文字与数字更清晰 */
table thead th { color: var(--sy-ink-2) !important; font-weight: 600 !important; }
table td { font-variant-numeric: tabular-nums; }

/* ---------- 9. 徽标 / 标签 ---------- */
[class*="rounded-full"][class*="bg-"]:not(button):not(a) {
  letter-spacing: .01em;
}

/* ---------- 10. 弹层：更厚的玻璃 ---------- */
[role="dialog"], [class*="DialogContent"], [data-radix-popper-content-wrapper] > * {
  background-color: rgba(255, 253, 250, .92) !important;
  -webkit-backdrop-filter: blur(22px) saturate(160%) !important;
  backdrop-filter: blur(22px) saturate(160%) !important;
  border-radius: 1.15rem !important;
  box-shadow: 0 30px 70px -32px rgba(60, 32, 20, .45) !important;
}
html.dark [role="dialog"], html.dark [class*="DialogContent"] {
  background-color: rgba(39, 32, 34, .94) !important;
  box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .8) !important;
}

/* ---------- 11. 代码与等宽 ---------- */
code, pre, kbd, samp, [class*="font-mono"] {
  font-family: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace !important;
}
pre {
  background-color: #f5ece0 !important;
  border: 1px solid var(--sy-line) !important;
  border-radius: .85rem !important;
}
html.dark pre { background-color: #241d1f !important; border-color: #3a2f33 !important; }

/* ---------- 12. 链接 ---------- */
a:not([class]):hover { color: var(--sy-rose-deep); }

/* ---------- 13. 登录/注册页：衬线大标题（营销感） ---------- */
[class*="auth"] h1, .login-page h1, .register-page h1 {
  font-family: var(--sy-serif) !important;
  letter-spacing: -.01em;
}

/* ---------- 14. 无障碍：减少动效 ---------- */
@media (prefers-reduced-motion: reduce) {
  button, [role="button"] { transition: none !important; }
  button:active, [role="button"]:active { transform: none !important; }
}


/* ============================================================================
   少十元 · 暖纸主题 v2 —— 落地页去蓝化 + 编辑感排版
   只覆盖颜色/字体/质感，不动布局；可整段删除回退
   ========================================================================== */

/* ---------- A. 干掉蓝色系（徽标、图标、强调文字） ---------- */
[class*="text-blue-"],
[class*="text-sky-"],
[class*="text-violet-"],
[class*="text-indigo-"],
[class*="text-purple-"] {
  color: var(--sy-rose-deep) !important;
}

[class*="bg-blue-"],
[class*="bg-sky-"],
[class*="bg-violet-"],
[class*="bg-indigo-"] {
  background-color: rgba(201, 111, 139, .10) !important;
}

[class*="border-blue-"],
[class*="border-sky-"],
[class*="border-violet-"],
[class*="border-indigo-"] {
  border-color: rgba(201, 111, 139, .28) !important;
}

/* 徽标里的实心小圆点 / 脉冲点需要保持实色 */
span[class*="bg-blue-400"]:not([class*="bg-blue-400/"]) {
  background-color: var(--sy-rose) !important;
}

/* ---------- B. 渐变文字 → 玫瑰→金 ---------- */
[class*="from-blue-400"][class*="bg-clip-text"],
[class*="bg-gradient-to-r"][class*="bg-clip-text"] {
  background-image: linear-gradient(104deg,
      var(--sy-rose) 0%,
      #d08a6a 48%,
      var(--sy-gold) 100%) !important;
}

/* ---------- C. 内联蓝色光晕 → 暖纸光晕 ---------- */
[aria-hidden="true"][style*="radial-gradient"] {
  background:
    radial-gradient(60% 50% at 18% 18%, rgba(201, 111, 139, .30) 0%, transparent 72%),
    radial-gradient(52% 42% at 82% 14%, rgba(192, 144, 90, .26) 0%, transparent 70%),
    radial-gradient(46% 40% at 55% 88%, rgba(111, 158, 144, .18) 0%, transparent 72%) !important;
  opacity: .62 !important;
}

html.dark [aria-hidden="true"][style*="radial-gradient"] {
  background:
    radial-gradient(60% 50% at 18% 18%, rgba(201, 111, 139, .22) 0%, transparent 72%),
    radial-gradient(52% 42% at 82% 14%, rgba(192, 144, 90, .18) 0%, transparent 70%) !important;
  opacity: .5 !important;
}

/* ---------- D. 编辑感排版：衬线大标题 ---------- */
h1, h2 {
  font-family: var(--sy-serif) !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
}

h1 { line-height: 1.16 !important; text-wrap: balance; }

/* 落地页大标题：中文衬线比无衬线宽，收一档避免撑破行 */
h1[class*="leading-"] {
  font-size: clamp(1.95rem, 3.8vw, 2.9rem) !important;
  text-wrap: balance;
}

/* 渐变词不要单独成行 */
h1 span[class*="bg-clip-text"] {
  display: inline !important;
  padding-bottom: .06em;
}

/* 段落更松弛 */
p[class*="leading-relaxed"], p[class*="leading-7"] {
  line-height: 1.85 !important;
}

/* 小标签：字距拉开，像设计稿的 uppercase 眉标 */
[class*="text-[11px]"], [class*="text-[10px]"] {
  letter-spacing: .08em;
}

/* ---------- E. 统计数字：衬线 + 暖色 ---------- */
[class*="tabular-nums"] {
  font-family: var(--sy-serif) !important;
  font-style: italic;
  letter-spacing: -.02em;
  color: var(--sy-ink) !important;
}

html.dark [class*="tabular-nums"] { color: #f6efe8 !important; }

/* ---------- F. 落地页 CTA 按钮 → 胶囊 ---------- */
a[data-slot="button"][href="/sign-up"],
a[data-slot="button"][href="/sign-in"],
a[class*="rounded-"][href*="/sign-"] {
  border-radius: 999px !important;
  padding-left: 1.6rem !important;
  padding-right: 1.6rem !important;
}

/* ---------- G. 卡片：纸感 + 玻璃 ---------- */
[class*="rounded-2xl"][class*="border"] {
  border-color: var(--sy-line) !important;
  background-color: rgba(255, 253, 250, .82) !important;
  -webkit-backdrop-filter: blur(14px) saturate(150%) !important;
  backdrop-filter: blur(14px) saturate(150%) !important;
}

html.dark [class*="rounded-2xl"][class*="border"] {
  background-color: rgba(39, 32, 34, .82) !important;
  border-color: #3a2f33 !important;
}

/* 代码示例面板：纸面底 */
pre, code {
  color: var(--sy-ink-2);
}
[class*="font-mono"] {
  font-feature-settings: "liga" 1, "calt" 1;
}

/* ---------- H. 分节分隔：更淡的纸纹线 ---------- */
[class*="border-y"], [class*="border-t"] {
  border-color: var(--sy-line-soft) !important;
}

/* 统计条底色：微微下沉的纸面 */
[class*="bg-muted/10"] {
  background-color: rgba(243, 236, 226, .65) !important;
}
html.dark [class*="bg-muted/10"] { background-color: rgba(43, 35, 38, .6) !important; }

/* ---------- I. 页脚 ---------- */
footer { border-color: var(--sy-line-soft) !important; }
footer [class*="text-muted-foreground"] { color: var(--sy-ink-3) !important; }

/* ---------- J. 深色模式：文字对比度补强 ---------- */
html.dark h1, html.dark h2 { color: #f6efe8 !important; }
html.dark [class*="text-muted-foreground"] { color: #b6a79e !important; }

/* ---------- K. 登录/注册：玻璃卡片 ---------- */
div[class*="sm:w-[480px]"] {
  background-color: rgba(255, 253, 250, .78) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) brightness(1.03) !important;
  backdrop-filter: blur(18px) saturate(160%) brightness(1.03) !important;
  border: 1px solid var(--sy-line) !important;
  border-radius: 1.5rem !important;
  box-shadow:
    0 24px 60px -30px rgba(60, 32, 20, .30),
    inset 0 1px 0 rgba(255, 255, 255, .7) !important;
}

html.dark div[class*="sm:w-[480px]"] {
  background-color: rgba(39, 32, 34, .82) !important;
  border-color: #3a2f33 !important;
  box-shadow:
    0 24px 60px -30px rgba(0, 0, 0, .8),
    inset 0 1px 0 rgba(255, 255, 255, .06) !important;
}

/* 卡片内的标题居中时更秀气 */
div[class*="sm:w-[480px]"] h2 {
  font-family: var(--sy-serif) !important;
  letter-spacing: -.01em !important;
}

/* 登录页左上角站名用衬线 */
a[href="/"] h1[class*="text-xl"] {
  font-family: var(--sy-serif) !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
}