/* 暗色模式统一表面层次与文字对比。 / Unify dark surfaces and text contrast. */
[data-theme="dark"] {
  --bg: #0d1117;
  --bg-elevated: #161b22;
  --card: #171d26;
  --card-soft: #202732;
  --card-border: rgba(220, 230, 245, .10);
  --nav-bg: rgba(13, 17, 23, .94);
  --tab-bg: rgba(22, 28, 37, .96);
  --sheet-bg: #171d26;
  --overlay-bg: rgba(0, 0, 0, .72);
  --label: #f3f6fa;
  --label2: rgba(226, 233, 243, .76);
  --label3: rgba(210, 220, 234, .58);
  --sep: rgba(220, 230, 245, .13);
  --sep-soft: rgba(220, 230, 245, .09);
  --fill: rgba(220, 230, 245, .075);
  --fill2: rgba(220, 230, 245, .12);
  --shadow: 0 2px 8px rgba(0, 0, 0, .28);
  --shadow-lg: 0 12px 34px rgba(0, 0, 0, .42);
  --shadow-sheet: 0 20px 60px rgba(0, 0, 0, .68);
}

/* 个人中心卡片改用深色渐层，避免浅色表面残留。 / Replace light profile cards with dark gradients. */
[data-theme="dark"] .user-account-card,
[data-theme="dark"] .user-profile-panel {
  color: var(--label) !important;
  background: linear-gradient(135deg, #171e29, #202a39) !important;
  border-color: rgba(var(--theme-primary-rgb, 49, 130, 255), .28) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .04) !important;
}

[data-theme="dark"] .user-account-card::before,
[data-theme="dark"] .user-profile-panel::before {
  opacity: .18;
}

[data-theme="dark"] .user-account-caption,
[data-theme="dark"] .user-account-form label,
[data-theme="dark"] .user-profile-panel small {
  color: var(--label2) !important;
}

[data-theme="dark"] .user-account-form input {
  color: var(--label) !important;
  background: var(--card-soft) !important;
  border-color: var(--card-border) !important;
}

/* 自助签名提示与输入占位文字适配暗色背景。 / Adapt signing tips and placeholders to dark surfaces. */
[data-theme="dark"] .user-signin-tip {
  color: var(--label2) !important;
  background: linear-gradient(135deg, #1b2431, #202b3b) !important;
  border-color: rgba(var(--theme-primary-rgb, 49, 130, 255), .28) !important;
}

[data-theme="dark"] .user-signin-tip button {
  color: var(--theme-primary, #4f8cff) !important;
}

[data-theme="dark"] .user-signin-tip.is-upload-locked {
  color: #ffb4ae !important;
  background: rgba(255, 69, 58, .11) !important;
  border-color: rgba(255, 69, 58, .26) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--label3) !important;
  opacity: 1;
}

/* 我的页面公告和入口卡片使用统一深色表面。 / Use consistent dark surfaces for profile notices and links. */
[data-theme="dark"] .my-public-notices.my-announcement-feed {
  background: linear-gradient(145deg, #171d26, #131820) !important;
  border-color: rgba(var(--theme-primary-rgb, 49, 130, 255), .22) !important;
  box-shadow: 0 9px 24px rgba(0, 0, 0, .25) !important;
}

[data-theme="dark"] .my-public-notices.my-announcement-feed .my-public-notice-row {
  color: var(--label) !important;
  background: linear-gradient(145deg, #202732, #191f28) !important;
  border-color: rgba(220, 230, 245, .10) !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
}

[data-theme="dark"] .my-public-notice-row small,
[data-theme="dark"] .my-public-notices .my-notices-title small,
[data-theme="dark"] .my-public-empty,
[data-theme="dark"] .my-donation-subtitle,
[data-theme="dark"] .my-donation-item span {
  color: var(--label2) !important;
}

[data-theme="dark"] #app .my-public-about > .settings-card-header,
[data-theme="dark"] #app .my-public-donation > .settings-card-header,
[data-theme="dark"] #app .my-native-notices > .settings-card-header,
[data-theme="dark"] #app .my-public-notices .my-notices-title b {
  color: var(--label) !important;
}

[data-theme="dark"] .my-public-about .settings-card-body > .set-row {
  color: var(--label) !important;
  background: linear-gradient(135deg, rgba(82, 139, 255, .12), #202732) !important;
  border-color: rgba(var(--theme-primary-rgb, 49, 130, 255), .22) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .06) !important;
}

[data-theme="dark"] .my-public-about .set-row .s-title {
  color: var(--label) !important;
}

[data-theme="dark"] .my-public-about .set-row .s-sub {
  color: var(--label2) !important;
}

/* 深色弹窗改为柔和描边，避免白框抢眼。 / Soften dialog borders in dark mode. */
[data-theme="dark"] #user-auth-modal .user-auth-dialog {
  border-color: rgba(220, 230, 245, .14) !important;
  box-shadow: 0 22px 70px rgba(0, 0, 0, .62) !important;
}

/* 修复个人页深色模式下被旧浅色强制规则覆盖的文字。 / Restore contrast overridden by legacy light styles. */
[data-theme="dark"] #app .user-profile-panel > .settings-overview,
[data-theme="dark"] #app .user-profile-panel > .user-account-card {
  color: var(--label) !important;
  border-color: rgba(220, 230, 245, .12) !important;
  background: linear-gradient(145deg, #182130, #202a39) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .04) !important;
}

[data-theme="dark"] #app .settings-overview-copy strong,
[data-theme="dark"] #app .my-native-notices > .settings-card-header,
[data-theme="dark"] #app .my-native-notices .set-row .s-title,
[data-theme="dark"] #app .my-public-about > .settings-card-header,
[data-theme="dark"] #app .my-public-donation > .settings-card-header,
[data-theme="dark"] #app .my-public-about .s-title {
  color: var(--label) !important;
}

[data-theme="dark"] #app .settings-overview-copy small,
[data-theme="dark"] #app .user-account-caption,
[data-theme="dark"] #app .user-account-card .user-usage small,
[data-theme="dark"] #app .user-account-card .user-usage b,
[data-theme="dark"] #app .user-account-card .user-quota-summary > span,
[data-theme="dark"] #app .my-native-notices .set-row .s-sub,
[data-theme="dark"] #app .my-native-notices .set-row .my-notice-excerpt,
[data-theme="dark"] #app .my-public-about .s-sub,
[data-theme="dark"] #app .my-public-donation .my-donation-subtitle,
[data-theme="dark"] #app .my-public-donation .my-donation-item span {
  color: var(--label2) !important;
}

[data-theme="dark"] #app .user-profile-panel .user-profile-action {
  color: #a9c5ff !important;
  border-color: rgba(130, 170, 255, .28) !important;
  background: rgba(64, 93, 145, .22) !important;
}

[data-theme="dark"] #app .my-public-about .settings-card-body > .set-row {
  background: linear-gradient(145deg, rgba(57, 91, 151, .28), #202732) !important;
}

[data-theme="dark"] #app .my-native-notices .set-row:before {
  border-color: #171d26 !important;
}

[data-theme="dark"] #app .my-public-donation .my-donation-item {
  background: linear-gradient(150deg, #202732, rgba(57, 91, 151, .2)) !important;
  border-color: rgba(220, 230, 245, .12) !important;
}

/* FAQ 展开箭头用对称折线绘制并固定居中。 / Draw symmetric, centered FAQ chevrons. */
#app .help-question-mark {
  position: absolute !important;
  top: 50% !important;
  right: 15px !important;
  left: auto !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  padding: 0 !important;
  flex: none !important;
  margin: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transform: translateY(-50%) !important;
}

#app .help-question {
  position: relative !important;
  display: flex !important;
  justify-content: flex-start !important;
  padding-right: 52px !important;
}

#app .help-question > span:first-child {
  min-width: 0 !important;
}

#app .help-question-mark::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  width: 10px !important;
  height: 6px !important;
  margin: auto !important;
  border: 0 !important;
  background: currentColor !important;
  clip-path: polygon(0 0, 50% 66%, 100% 0, 100% 33%, 50% 100%, 0 33%) !important;
  transform: none !important;
}

#app .help-card.open .help-question-mark::before,
#app .help-question[aria-expanded="true"] .help-question-mark::before {
  transform: rotate(180deg) !important;
}

#app .help-question-mark::after {
  content: none !important;
}

/* 保持个人页标题和登录文案清晰。 / Keep profile headings and sign-in text readable. */
html[data-theme="dark"] #app :is(.my-native-notices, .my-public-notices, .my-public-about, .my-public-donation) .settings-card-header,
html[data-theme="dark"] #app :is(.my-native-notices, .my-public-notices, .my-public-about, .my-public-donation) .settings-card-header :is(h2, h3, h4, b, strong, span):not(:has(a, button)):not(a *, button *) {
  color: #f3f6fa !important;
}

html[data-theme="dark"] #app .user-profile-panel .settings-overview {
  background: #202a39 !important;
  color: #f3f6fa !important;
}

html[data-theme="dark"] #app .user-profile-panel .settings-overview-copy,
html[data-theme="dark"] #app .user-profile-panel .settings-overview-copy strong {
  color: #f3f6fa !important;
}

html[data-theme="dark"] #app .user-profile-panel .settings-overview-copy small {
  color: #c2cedf !important;
}

/* 覆盖个人页的固定浅色配色。 / Override fixed light colors on the profile page. */
:root[data-theme="dark"] #app#app .user-profile-panel {
  background: #182130 !important;
}
:root[data-theme="dark"] #app#app .user-profile-panel .settings-overview {
  background: #202a39 !important;
}
:root[data-theme="dark"] #app#app .settings-overview-copy strong,
:root[data-theme="dark"] #app#app .my-notices-heading,
:root[data-theme="dark"] #app#app .my-notices-heading b,
:root[data-theme="dark"] #app#app :is(.my-native-notices, .my-public-about, .my-public-donation) .settings-card-header {
  color: #f3f6fa !important;
}
:root[data-theme="dark"] #app#app .settings-overview-copy small {
  color: #c2cedf !important;
}

/* 公告详情使用深色面板和浅色文字。 / Use a dark surface and light text for notice details. */
:root[data-theme="dark"] body .my-public-modal:not(.my-qr-modal) > section[role="dialog"] {
  background: #202a39 !important;
  color: #f3f6fa !important;
}
:root[data-theme="dark"] body .my-public-modal:not(.my-qr-modal) > section[role="dialog"] > h2 {
  color: #f3f6fa !important;
}
:root[data-theme="dark"] body .my-public-modal:not(.my-qr-modal) > section[role="dialog"] > div {
  color: #cbd6e5 !important;
}
:root[data-theme="dark"] body .my-public-modal:not(.my-qr-modal) > section[role="dialog"] > button[data-close] {
  background: #344256 !important;
  color: #f3f6fa !important;
}