/* 知命 · 移动端优先：深色星空 / 水墨质感，金色点缀，正文可读性优先 */

:root {
  --ink-deep: #0b0e1a;
  --ink-panel: #12172a;
  --ink-card: #171d33;
  --ink-line: #2a3352;
  --gold: #d4af37;
  --gold-soft: #e8cf7a;
  --text-main: #ece7da;
  --text-dim: #a9a493;
  --danger: #e08a8a;
  --touch: 48px;
  --fs-aux: 14px;
  --fs-reading: 0.875rem;
  --fs-badge: 0.75rem;
  --font-serif: "Noto Serif SC", "Songti SC", SimSun, serif;
}

* {
  box-sizing: border-box;
}

:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

.skip-link {
  position: absolute;
  left: max(8px, env(safe-area-inset-left, 0px));
  top: max(8px, env(safe-area-inset-top, 0px));
  z-index: 80;
  display: inline-flex;
  align-items: center;
  min-height: var(--touch);
  min-width: var(--touch);
  padding: 8px 12px;
  background: var(--gold);
  color: var(--ink-deep);
  font-size: var(--fs-aux);
  text-decoration: none;
  border-radius: 12px;
  transform: translateY(-200%);
}
.skip-link:focus,
.skip-link:focus-visible {
  transform: none;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;
  color: var(--text-main);
  line-height: 1.75;
  background:
    radial-gradient(1px 1px at 12% 18%, rgba(255, 255, 255, 0.55) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 68% 8%, rgba(255, 255, 255, 0.4) 50%, transparent 51%),
    radial-gradient(1px 1px at 85% 32%, rgba(232, 207, 122, 0.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 35% 60%, rgba(255, 255, 255, 0.3) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 55% 85%, rgba(255, 255, 255, 0.35) 50%, transparent 51%),
    radial-gradient(circle at 50% -10%, #1d2547 0%, var(--ink-deep) 55%);
  background-attachment: fixed;
}

main {
  padding: 0 16px 48px;
}

/* ---------- 落地区 ---------- */

.landing {
  position: relative;
  padding: 72px 20px 56px;
  text-align: center;
  overflow: hidden;
}

/* 落地区星点层：给 .star-field 元素补上闪烁动效（评审④，不再是死元素） */
.star-field {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(1px 1px at 8% 22%, rgba(255, 255, 255, 0.6) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 30% 72%, rgba(232, 207, 122, 0.55) 50%, transparent 51%),
    radial-gradient(1px 1px at 52% 12%, rgba(255, 255, 255, 0.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 72% 58%, rgba(255, 255, 255, 0.45) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 90% 30%, rgba(255, 255, 255, 0.5) 50%, transparent 51%);
  animation: star-twinkle 4.5s ease-in-out infinite alternate;
}

@keyframes star-twinkle {
  from {
    opacity: 0.35;
  }

  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .star-field {
    animation: none;
  }
}

/* ---------- 全局可见警告条（D2） ---------- */

.app-notice {
  max-width: 640px;
  margin: 16px auto 0;
  padding: 12px 16px;
  border: 1px solid rgba(224, 138, 138, 0.7);
  border-radius: 12px;
  background: rgba(224, 138, 138, 0.12);
  color: var(--danger);
  font-size: 0.92rem;
}

.brand {
  margin: 0;
  font-size: 3.4rem;
  letter-spacing: 0.35em;
  text-indent: 0.35em;
  color: var(--gold);
  font-weight: 600;
  text-shadow: 0 0 24px rgba(212, 175, 55, 0.35);
}

.hub-back {
  margin: 0 auto 12px;
}
.hub-back a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  min-width: 44px;
  color: var(--gold);
  text-decoration: none;
  font-size: 0.95rem;
}

.tagline {
  margin: 12px auto 28px;
  color: var(--text-dim);
  max-width: 30em;
}

.promises {
  list-style: none;
  margin: 0 auto 32px;
  padding: 0;
  max-width: 34em;
  text-align: left;
}

.promises li {
  padding: 10px 14px;
  margin-bottom: 10px;
  background: rgba(23, 29, 51, 0.75);
  border: 1px solid var(--ink-line);
  border-left: 3px solid var(--gold);
  border-radius: 10px;
  font-size: 0.95rem;
}

.gold {
  color: var(--gold-soft);
  font-weight: 600;
}

.legal-bound {
  max-width: 34em;
  margin: 0 auto 28px;
  padding: 10px 14px;
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--ink-mute, #c9cde0);
  border: 1px dashed var(--ink-line, #3a4260);
  border-radius: 10px;
}

.cta {
  display: inline-block;
  min-height: var(--touch);
  line-height: var(--touch);
  padding: 0 40px;
  border-radius: 999px;
  background: linear-gradient(135deg, #c9a227, var(--gold-soft));
  color: #201a05;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.1em;
}

/* ---------- 面板与表单 ---------- */

.panel {
  max-width: 640px;
  margin: 0 auto 28px;
  padding: 24px 18px;
  background: rgba(18, 23, 42, 0.9);
  border: 1px solid var(--ink-line);
  border-radius: 16px;
}

.panel h2 {
  margin: 0 0 18px;
  font-size: 1.3rem;
  color: var(--gold-soft);
  letter-spacing: 0.12em;
}

.field-row {
  display: flex;
  gap: 10px;
}

.field {
  display: block;
  flex: 1;
  margin-bottom: 14px;
}

.field span {
  display: block;
  margin-bottom: 6px;
  font-size: 0.88rem;
  color: var(--text-dim);
}

.field input,
.field select {
  width: 100%;
  min-height: var(--touch);
  padding: 0 12px;
  font-size: 1rem;
  color: var(--text-main);
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
}

.field input:focus,
.field select:focus {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
}

.hint {
  font-size: 0.85rem;
  color: var(--text-dim);
  margin: 4px 0 18px;
}

/* ---------- 问题类型分段控件（移动端触控友好） ---------- */

.qtype-field {
  margin: 0 0 14px;
  padding: 0;
  border: none;
}

.qtype-field legend {
  padding: 0;
  margin-bottom: 6px;
  font-size: 0.88rem;
  color: var(--text-dim);
}

.qtype-group {
  display: flex;
  gap: 6px;
}

.qtype-option {
  flex: 1;
}

.qtype-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.qtype-option span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--touch);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  background: var(--ink-card);
  color: var(--text-dim);
  font-size: 0.95rem;
  cursor: pointer;
  user-select: none;
}

.qtype-option input:checked + span {
  border-color: var(--gold);
  color: var(--gold-soft);
  background: rgba(212, 175, 55, 0.12);
  font-weight: 600;
}

.qtype-option input:focus-visible + span {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
}

.qtype-hint {
  margin: 8px 0 0;
}

.primary-btn {
  display: block;
  width: 100%;
  min-height: 52px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(135deg, #c9a227, var(--gold-soft));
  color: #201a05;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  cursor: pointer;
}

.primary-btn:active {
  transform: scale(0.99);
}

.form-error {
  color: var(--danger);
  margin: 12px 0 0;
}

/* ---------- 牌阵说明 ---------- */

.spread-note {
  margin: 0 0 14px;
  font-size: 0.88rem;
  color: var(--gold-soft);
}

/* ---------- 披露段：永远可见 ---------- */

.disclosure {
  padding: 14px 16px;
  margin-bottom: 20px;
  background: rgba(212, 175, 55, 0.08);
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 12px;
  font-size: 0.92rem;
  color: var(--gold-soft);
  white-space: pre-wrap;
}

/* ---------- 报告工具栏与提示 ---------- */

.report-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.tool-btn {
  flex: 1;
  min-width: 96px;
  min-height: var(--touch);
  border: 1px solid var(--gold);
  border-radius: 10px;
  background: transparent;
  color: var(--gold-soft);
  font-size: 0.92rem;
  cursor: pointer;
}

.tool-tip {
  margin: 0 0 12px;
  color: var(--gold-soft);
  font-size: 0.88rem;
}

/* ---------- 章节目录（横向可滑动，吸顶） ---------- */

.section-toc {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 0;
  margin-bottom: 14px;
  background: rgba(18, 23, 42, 0.96);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.section-toc::-webkit-scrollbar {
  display: none;
}

.toc-chip {
  flex-shrink: 0;
  min-height: var(--touch);
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--ink-line);
  background: var(--ink-card);
  color: var(--text-dim);
  font-size: 0.88rem;
  white-space: nowrap;
  cursor: pointer;
}

.toc-chip.active {
  border-color: var(--gold);
  color: var(--gold-soft);
  background: rgba(212, 175, 55, 0.12);
}

.toc-chip.toc-locked {
  opacity: 0.85;
}

/* ---------- 报告卡片 ---------- */

.report-card {
  position: relative;
  margin-bottom: 16px;
  padding: 18px 16px;
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 14px;
  overflow: hidden;
}

.card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.card-title {
  margin: 0;
  font-size: 1.08rem;
  color: var(--gold-soft);
}

.tone-badge {
  flex-shrink: 0;
  font-size: var(--fs-badge);
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid var(--ink-line);
  color: var(--text-dim);
}

.tone-caution {
  border-color: rgba(224, 138, 138, 0.6);
  color: var(--danger);
}

.tone-opportunity,
.tone-action {
  border-color: rgba(212, 175, 55, 0.6);
  color: var(--gold-soft);
}

.section-body {
  margin: 0 0 10px;
  font-size: 0.98rem;
}

.section-body.blank {
  color: var(--text-dim);
  font-style: italic;
}

/* 正文内「【…】」分段小标题（评审①：长文扫读锚点） */
.section-body.section-subhead {
  margin-top: 16px;
  color: var(--gold-soft);
  font-weight: 600;
  font-size: 1rem;
}

/* 付费墙：渐变淡出 + 内容截断（评审③：blur 滤镜在低端机代价高，弃用） */

.report-card.locked .card-body {
  max-height: 140px;
  overflow: hidden;
  user-select: none;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.55), transparent 88%);
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.55), transparent 88%);
}

.lock-veil {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(to bottom, rgba(11, 14, 26, 0.2), rgba(11, 14, 26, 0.92) 75%);
  color: var(--gold-soft);
  font-size: 0.9rem;
  letter-spacing: 0.15em;
}

/* 第一张锁定卡内嵌的紧凑解锁 CTA（评审②） */
.inline-unlock-cta {
  min-height: var(--touch);
  padding: 0 28px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, #c9a227, var(--gold-soft));
  color: #201a05;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
}

/* ---------- 解锁卡片 ---------- */

.unlock-card {
  margin-top: 4px;
  padding: 20px 16px;
  background: linear-gradient(160deg, rgba(212, 175, 55, 0.12), rgba(18, 23, 42, 0.95));
  border: 1px solid rgba(212, 175, 55, 0.5);
  border-radius: 14px;
}

.unlock-title {
  margin: 0 0 6px;
  color: var(--gold);
}

.unlock-sub,
.unlock-note {
  font-size: 0.88rem;
  color: var(--text-dim);
  margin: 0 0 14px;
}

.unlock-note {
  margin: 12px 0 0;
}

.sku-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: var(--touch);
  padding: 8px 0;
  border-bottom: 1px solid var(--ink-line);
}

.sku-item:last-child {
  border-bottom: none;
}

.sku-name {
  flex: 1;
}

.sku-price {
  color: var(--gold-soft);
  font-weight: 600;
}

.sku-btn {
  min-height: var(--touch);
  min-width: 72px;
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: transparent;
  color: var(--gold-soft);
  font-size: 0.9rem;
  cursor: pointer;
}

/* ---------- 体验码兑换区（解锁卡片内） ---------- */

.redeem-box {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed rgba(212, 175, 55, 0.35);
}

.redeem-credits {
  margin: 0 0 8px;
  font-size: 0.9rem;
  color: var(--gold-soft);
}

.redeem-row {
  display: flex;
  gap: 8px;
}

.redeem-input {
  flex: 1;
  min-height: var(--touch);
  padding: 0 12px;
  font-size: 0.95rem;
  color: var(--text-main);
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
}

.redeem-input:focus {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
}

.redeem-btn {
  min-height: var(--touch);
  min-width: 84px;
  border: 1px solid var(--gold);
  border-radius: 10px;
  background: transparent;
  color: var(--gold-soft);
  font-size: 0.95rem;
  cursor: pointer;
}

.redeem-error {
  margin: 8px 0 0;
  color: var(--danger);
  font-size: 0.85rem;
}

.redeem-ok {
  margin: 8px 0 0;
  color: var(--gold-soft);
  font-size: 0.85rem;
}

.redeem-hint {
  margin: 8px 0 0;
  font-size: var(--fs-reading);
  color: var(--text-dim);
}

.determinism-note {
  margin: 20px 0 0;
  font-size: 0.85rem;
  color: var(--text-dim);
  text-align: center;
}

/* ---------- 今日运势免费卡（金边） ---------- */

.daily-card-inner {
  padding: 16px;
  border: 1px solid var(--gold);
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(212, 175, 55, 0.14), rgba(18, 23, 42, 0.95));
  box-shadow: 0 0 18px rgba(212, 175, 55, 0.18);
}

.daily-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.daily-date {
  font-size: 0.85rem;
  color: var(--text-dim);
}

.daily-energy {
  color: var(--gold);
  letter-spacing: 0.2em;
}

.daily-headline {
  margin: 0 0 12px;
  font-size: 1.05rem;
  color: var(--gold-soft);
  font-weight: 600;
}

.daily-lists {
  display: flex;
  gap: 12px;
}

.daily-list {
  flex: 1;
}

.daily-list-title {
  margin: 0 0 6px;
  font-size: 0.9rem;
  color: var(--gold-soft);
}

.daily-list-title.daily-avoid {
  color: var(--text-dim);
}

.daily-item {
  margin: 0 0 6px;
  font-size: 0.9rem;
}

.daily-lucky {
  margin: 10px 0 6px;
  font-size: 0.88rem;
  color: var(--gold-soft);
}

.daily-seednote {
  margin: 0;
  font-size: 0.85rem;
  color: var(--text-dim);
}

.daily-generic-note {
  margin: 0.35rem 0 0.5rem;
  font-size: 0.85rem;
  color: var(--gold-soft);
}

.daily-empty {
  color: var(--text-dim);
  font-size: 0.92rem;
  margin: 0;
}

/* ---------- 预言冻结提示条 ---------- */

.freeze-toast {
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(212, 175, 55, 0.55);
  border-radius: 12px;
  background: rgba(212, 175, 55, 0.1);
}

.freeze-headline {
  margin: 0 0 8px;
  color: var(--gold-soft);
  font-weight: 600;
  font-size: 0.95rem;
}

.freeze-seal {
  margin: 0 0 4px;
  font-size: 0.85rem;
  color: var(--text-dim);
  word-break: break-all;
}

.freeze-toast.freeze-failed {
  border-color: rgba(224, 138, 138, 0.7);
  background: rgba(224, 138, 138, 0.12);
}

.freeze-toast.freeze-failed .freeze-headline {
  color: var(--danger);
}

.freeze-partial-fail {
  color: var(--danger);
}

/* ---------- 战绩台账 ---------- */

.ledger-pledge {
  padding: 10px 14px;
  border: 1px dashed rgba(212, 175, 55, 0.5);
  border-radius: 10px;
  color: var(--gold-soft);
  font-size: 0.9rem;
}

/* 台账关键数字着色速览（评审⑤：hit 绿 / miss 中性红） */
.ledger-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 0 0 10px;
}

.stat-chip {
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid var(--ink-line);
  font-size: 0.85rem;
  color: var(--text-dim);
}

.stat-hit {
  border-color: rgba(126, 200, 138, 0.6);
  color: #8fd19b;
}

.stat-miss {
  border-color: rgba(224, 138, 138, 0.6);
  color: var(--danger);
}

.stat-void {
  border-color: var(--ink-line);
  color: var(--text-dim);
}

.ledger-summary {
  margin: 0 0 14px;
  padding: 12px 14px;
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  color: var(--text-main);
  font-family: inherit;
  font-size: 0.88rem;
  white-space: pre-wrap;
  word-break: break-word;
}

.ledger-empty-text {
  color: var(--text-dim);
  font-size: 0.92rem;
}

.ledger-card {
  margin-bottom: 12px;
  padding: 12px 14px;
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 12px;
}

.ledger-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.status-badge {
  flex-shrink: 0;
  font-size: var(--fs-badge);
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid var(--ink-line);
}

.badge-pending {
  border-color: rgba(212, 175, 55, 0.4);
  color: var(--text-dim);
}

.badge-hit {
  border-color: rgba(126, 200, 138, 0.6);
  color: #8fd19b;
}

.badge-miss {
  border-color: rgba(224, 138, 138, 0.6);
  color: var(--danger);
}

.badge-void {
  border-color: var(--ink-line);
  color: var(--text-dim);
}

.ledger-seal {
  font-size: var(--fs-reading);
  color: var(--text-dim);
  word-break: break-all;
}

.ledger-statement {
  margin: 0 0 6px;
  font-size: 0.95rem;
}

.ledger-meta {
  margin: 0;
  font-size: var(--fs-reading);
  color: var(--text-dim);
}

.seal-error {
  margin: 8px 0 0;
  padding: 8px 10px;
  border: 1px solid rgba(224, 138, 138, 0.6);
  border-radius: 8px;
  background: rgba(224, 138, 138, 0.08);
  color: var(--danger);
  font-size: var(--fs-reading);
}

.settle-row {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}

.settle-btn {
  min-height: var(--touch);
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--ink-line);
  background: transparent;
  color: var(--text-main);
  font-size: 0.88rem;
  cursor: pointer;
}

.settle-hit {
  border-color: rgba(126, 200, 138, 0.6);
  color: #8fd19b;
}

.settle-miss {
  border-color: rgba(224, 138, 138, 0.6);
  color: var(--danger);
}

.settle-void {
  color: var(--text-dim);
}

/* ---------- 历史报告（紧凑行） ---------- */

.history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: var(--touch);
  padding: 8px 12px;
  margin-bottom: 6px;
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  background: var(--ink-card);
  color: var(--text-main);
  font-size: 0.9rem;
  text-align: left;
  cursor: pointer;
}

.history-row:active {
  border-color: var(--gold);
}

.history-time {
  color: var(--text-main);
}

.history-fp {
  color: var(--text-dim);
  font-size: 0.85rem;
}

/* 正文被配额回收的历史存根：置灰不可点（D2） */
.history-row.history-evicted {
  opacity: 0.55;
  cursor: default;
}

.history-empty {
  color: var(--text-dim);
  font-size: 0.92rem;
}

.site-footer {
  padding: 24px 16px 40px;
  text-align: center;
  color: var(--text-dim);
  font-size: 0.85rem;
}

/* ---------- 回到顶部浮钮 ---------- */

.back-to-top {
  position: fixed;
  right: 16px;
  bottom: 24px;
  z-index: 20;
  min-width: var(--touch);
  min-height: var(--touch);
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: rgba(18, 23, 42, 0.92);
  color: var(--gold-soft);
  font-size: 1.2rem;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* ---------- 今日卡 V2：生肖徽标 / 今日与你 / 吉时 / 今日一牌 ---------- */

.daily-head-left {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.zodiac-badge {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid rgba(212, 175, 55, 0.55);
  border-radius: 999px;
  background: rgba(212, 175, 55, 0.1);
  color: var(--gold-soft);
  font-size: 0.85rem;
}

.daily-personal {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid var(--ink-line);
  border-radius: 12px;
  background: var(--ink-card);
}

.lucky-hours {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.hour-chip {
  display: inline-block;
  padding: 4px 12px;
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 999px;
  background: rgba(212, 175, 55, 0.08);
  color: var(--gold-soft);
  font-size: 0.85rem;
}

.daily-tarot {
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px dashed rgba(212, 175, 55, 0.5);
  border-radius: 12px;
}

.daily-tarot-name {
  margin: 0 0 6px;
  color: var(--gold-soft);
  font-size: 1.02rem;
  font-weight: 600;
}

.daily-tarot-miss {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  font-style: italic;
}

/* ---------- 缘分合盘 ---------- */

.compat-pledge {
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid rgba(212, 175, 55, 0.4);
  border-radius: 12px;
  background: rgba(212, 175, 55, 0.07);
  color: var(--gold-soft);
  font-size: 0.88rem;
}

.compat-card {
  margin-top: 20px;
}

/* overall 分环：conic-gradient 圆环，角度由 JS 按 0-100 分驱动 */
.compat-ring {
  width: 148px;
  height: 148px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: conic-gradient(var(--gold) 0deg, var(--ink-line) 0);
  display: flex;
  align-items: center;
  justify-content: center;
}

.compat-ring-inner {
  width: 118px;
  height: 118px;
  border-radius: 50%;
  background: var(--ink-panel);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.compat-score {
  font-family: var(--font-serif);
  font-size: 2.3rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--gold);
}

.compat-score-label {
  font-size: 0.85rem;
  color: var(--text-dim);
}

.compat-row {
  margin-bottom: 16px;
}

.compat-row-title {
  margin: 0 0 8px;
  font-size: 0.95rem;
  color: var(--gold-soft);
}

.compat-zodiac {
  margin: 0 0 8px;
  font-size: 1.05rem;
}

.compat-note {
  margin: 0;
  font-size: 0.92rem;
  color: var(--text-main);
}

.compat-bazi {
  margin-top: 8px;
}

/* D8：时辰缺省的近似披露——紧贴主披露句，弱化边框避免双框堆叠 */
.compat-approx {
  margin-top: 8px;
  border-style: dashed;
  color: var(--text-dim);
}

.compat-disclosure {
  margin: 16px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 12px;
  background: rgba(212, 175, 55, 0.08);
  color: var(--gold-soft);
  font-size: 0.88rem;
  line-height: 1.6;
}

/* ---------- 继续追问 ---------- */

.followup {
  margin: 26px 0 18px;
  padding-top: 18px;
  border-top: 1px solid var(--ink-line);
}

.followup-title {
  margin: 0 0 4px;
  color: var(--gold-soft);
  font-size: 1.1rem;
}

.followup-hint {
  margin: 0 0 12px;
}

.followup-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 16px;
}

/* 描边胶囊：与章节目录的 toc-chip（实底小片）视觉区分 */
.followup-chip {
  min-height: var(--touch);
  padding: 8px 18px;
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: transparent;
  color: var(--gold-soft);
  font-size: 0.9rem;
  cursor: pointer;
}

.followup-chip.answered {
  border-color: var(--ink-line);
  background: var(--ink-card);
  color: var(--text-dim);
}

.followup-answer {
  margin: 14px 0;
  padding: 14px 16px;
  border: 1px solid var(--ink-line);
  border-radius: 12px;
  background: var(--ink-card);
}

.followup-q {
  margin: 0 0 8px;
  color: var(--gold-soft);
  font-size: 1rem;
}

/* 推演依据：透明红线——永远可见，不进任何遮罩 */
.followup-basis {
  margin-top: 12px;
  padding: 10px 12px;
  border-left: 3px solid var(--gold);
  border-radius: 0 8px 8px 0;
  background: rgba(212, 175, 55, 0.06);
}

.followup-basis-title {
  margin: 0 0 6px;
  font-size: 0.88rem;
  color: var(--gold-soft);
}

.followup-basis-list {
  margin: 0;
  padding-left: 18px;
}

.followup-basis-item {
  margin: 3px 0;
  font-size: 0.88rem;
  color: var(--text-main);
}

/* D11：历史重开缺命盘的如实明示 */
.followup-miss {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  font-style: italic;
}

.followup-history-note {
  margin: 0 0 10px;
  font-size: 0.85rem;
  color: var(--text-dim);
}

.followup-lock {
  margin: 14px 0;
  padding: 14px 16px;
  border: 1px dashed var(--gold);
  border-radius: 12px;
}

.followup-lock-text {
  margin: 0 0 10px;
  color: var(--gold-soft);
}

/* ---------- 连续签到（streak 徽标与里程碑提示条） ---------- */

.streak-badge {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid rgba(224, 138, 138, 0.55);
  border-radius: 999px;
  background: rgba(224, 138, 138, 0.1);
  color: var(--text-main);
  font-size: 0.85rem;
}

.streak-toast {
  margin-bottom: 12px;
}

/* ---------- 数据与设置（备份/导入/清空） ---------- */

.data-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 14px 0;
}

/* 覆盖 .primary-btn 的整行块级形态：设置区三按钮同排自适应 */
.data-btn {
  display: inline-block;
  flex: 1 1 auto;
  width: auto;
  min-height: var(--touch);
  padding: 10px 18px;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
}

/* 清空是破坏性动作：红色警示描边，与金色主按钮/次级按钮拉开视觉距离 */
.danger-btn {
  padding: 10px 18px;
  border: 1px solid var(--danger);
  border-radius: 10px;
  background: transparent;
  color: var(--danger);
  font-size: 0.95rem;
  cursor: pointer;
}

.data-status {
  margin: 10px 0 0;
  padding: 10px 14px;
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  background: var(--ink-card);
  color: var(--text-main);
  font-size: 0.9rem;
}

.data-status-error {
  border-color: var(--danger);
  color: var(--danger);
}

/* 导入 warnings：封印失败被跳过的记录逐条红字，必须显眼（诚实红线） */
.data-warning {
  margin: 8px 0 0;
  padding: 8px 12px;
  border-left: 3px solid var(--danger);
  background: rgba(224, 138, 138, 0.08);
  color: var(--danger);
  font-size: 0.88rem;
}

/* ---------- 时辰未知勾选（V1.8） ---------- */

.hour-unknown {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  min-height: var(--touch);
  font-size: 0.85rem;
  color: var(--text-dim);
  cursor: pointer;
}

/* 覆盖 .field input 的整宽/48px 通配：勾选框保持原生紧凑尺寸 */
.hour-unknown input[type='checkbox'] {
  width: 18px;
  height: 18px;
  min-height: 0;
  margin: 0;
  accent-color: var(--gold);
  cursor: pointer;
}

.field input:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* ---------- 分享卡预览弹层（V1.8） ---------- */

.ledger-card-btn {
  flex: none;
  margin-bottom: 14px;
}

.card-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(5, 7, 15, 0.82);
}

/* display:flex 会压过 [hidden] 的默认 display:none，必须显式补回 */
.card-overlay[hidden] {
  display: none;
}

.card-dialog {
  width: 100%;
  max-width: 400px;
  max-height: 92vh;
  overflow-y: auto;
  padding: 16px;
  border: 1px solid var(--ink-line);
  border-radius: 14px;
  background: var(--ink-panel);
}

.card-preview-img {
  display: block;
  width: 100%;
  border-radius: 10px;
}

.card-dialog-actions {
  display: flex;
  gap: 12px;
  margin-top: 14px;
}

/* 覆盖 .primary-btn 的整行块级形态：与关闭按钮同排 */
.card-save-btn {
  display: inline-block;
  flex: 1;
  width: auto;
  min-height: var(--touch);
  padding: 10px 18px;
  font-size: 1rem;
  letter-spacing: 0.1em;
}

.card-error {
  margin: 10px 0 0;
  color: var(--danger);
  font-size: 0.88rem;
}

/* ---------- V1.9 空态今日运势与台账封印声明 ---------- */

/* 空态折叠（契约 §37）：无档案时今日运势区收成一行引导，renderDaily 动态移位到表单区之后 */
.daily-collapsed {
  padding: 14px 20px;
}

/* 折叠态隐去长提示与签到提示条，只留标题 + 一行引导 */
.daily-collapsed .daily-hint,
.daily-collapsed .streak-toast {
  display: none;
}

.daily-collapsed #daily-title {
  font-size: 1rem;
  margin: 0 0 6px;
}

.daily-empty-line {
  font-size: 0.9rem;
}

/* 台账封印声明小字：如实声明封印覆盖范围，不抢版面 */
.ledger-seal-note {
  margin: 4px 0 10px;
  color: var(--text-dim);
  font-size: var(--fs-reading);
}

/* ---------- 新用户三步引导（V2.1） ---------- */

.onboarding-card {
  margin: 16px auto 0;
  max-width: 720px;
  padding: 18px 20px;
  border: 1px solid var(--gold);
  border-radius: 14px;
  background: var(--ink-panel);
}

.onboarding-title {
  margin: 0 0 12px;
  font-size: 1.05rem;
  color: var(--gold-soft);
  letter-spacing: 0.08em;
}

.onboarding-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.onboarding-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  color: var(--text-dim);
  font-size: 0.92rem;
}

/* 当前步金色高亮 */
.onboarding-step.current {
  border-color: var(--gold);
  background: rgba(212, 175, 55, 0.08);
  color: var(--text-main);
}

.onboarding-step.current .onboarding-mark {
  color: var(--gold);
}

/* 已完成步打勾划线 */
.onboarding-step.done .onboarding-label {
  text-decoration: line-through;
  opacity: 0.7;
}

.onboarding-step.done .onboarding-mark {
  color: var(--gold-soft);
}

.onboarding-mark {
  flex: none;
  width: 1.2em;
  text-align: center;
}

/* 收官完成条：一次性提示，可关闭 */
.onboarding-complete {
  margin: 16px auto 0;
  max-width: 720px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border: 1px solid var(--gold);
  border-radius: 12px;
  background: rgba(212, 175, 55, 0.1);
  color: var(--text-main);
  font-size: 0.92rem;
}

.onboarding-complete-text {
  flex: 1;
}

.onboarding-close {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--touch);
  min-height: var(--touch);
  border: 1px solid var(--ink-line);
  border-radius: 8px;
  background: transparent;
  color: var(--text-dim);
  font-size: 1rem;
  cursor: pointer;
}

/* ---------- 动效挂载补充（V2.2；动画本体在 motion.css/ritual.css） ---------- */

/* greeting 共情行：金字体，披露段之后、工具栏之前 */
.report-greeting {
  margin: 12px 0;
  color: var(--gold-soft);
  font-size: 0.98rem;
  line-height: 1.7;
}

/* 能量单星：未点亮时置暗，.lit（motion.css）负责点亮与发光；☆ 空星保持置暗 */
.energy-star {
  display: inline-block;
  opacity: 0.35;
}

#ritual-mount {
  margin: 0 auto;
  max-width: 720px;
}

/* ---------- 账号区（V2.3：登录只同步购买权益） ---------- */

.account-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.account-input {
  width: 100%;
  min-height: var(--touch);
  padding: 0 12px;
  font-size: 1rem;
  color: var(--text-main);
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
}

.account-input:focus {
  outline: 2px solid var(--gold);
  outline-offset: 1px;
}

.account-actions {
  display: flex;
  gap: 10px;
}

.account-btn {
  flex: 1 1 auto;
  min-height: var(--touch);
  padding: 10px 18px;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  color: var(--text-main);
  background: var(--ink-card);
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  cursor: pointer;
}

.account-btn:hover {
  border-color: var(--gold);
  color: var(--gold);
}

/* 登录是主动作：金色描边突出 */
.account-login-btn {
  border-color: var(--gold);
  color: var(--gold);
}

.account-logged {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.account-user {
  margin: 0;
  color: var(--gold);
  font-weight: 600;
}

.account-ent {
  margin: 0;
  color: var(--text-dim);
  font-size: 0.9rem;
}

.account-logout-btn {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-top: 6px;
}

.account-status {
  margin: 10px 0 0;
  padding: 10px 14px;
  border: 1px solid var(--ink-line);
  border-radius: 10px;
  background: var(--ink-card);
  color: var(--text-main);
  font-size: 0.9rem;
}

.account-status-error {
  border-color: var(--danger);
  color: var(--danger);
}

/* ---------- 订单卡与模拟支付（V2.3 购买动线） ---------- */

.order-card {
  margin-top: 14px;
  padding: 16px 18px;
  border: 1px solid var(--gold);
  border-radius: 12px;
  background: var(--ink-card);
}

.order-title {
  margin: 0 0 8px;
  color: var(--gold);
  font-size: 1.05rem;
}

.order-line {
  margin: 4px 0;
  font-size: 0.92rem;
  color: var(--text-main);
}

.order-status-pending_payment {
  color: var(--gold);
}

.order-status-paid {
  color: var(--ok, #7fc98f);
}

.order-note {
  margin: 8px 0 0;
  font-size: 0.85rem;
  color: var(--text-dim);
}

.mockpay-box {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--ink-line);
}

.mockpay-hint {
  margin: 0 0 8px;
  font-size: 0.85rem;
  color: var(--text-dim);
}

.mockpay-row {
  display: flex;
  gap: 8px;
}

.mockpay-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: var(--touch);
  padding: 0 12px;
  font-size: 0.95rem;
  color: var(--text-main);
  background: var(--ink-deep, var(--ink-card));
  border: 1px solid var(--ink-line);
  border-radius: 10px;
}

.mockpay-btn {
  flex: 0 0 auto;
}

/* ---------- 宽屏微调（移动端优先，桌面只放宽容器） ---------- */

@media (min-width: 720px) {
  .landing {
    padding-top: 96px;
  }

  .panel {
    padding: 32px 36px;
  }

  .brand {
    font-size: 4.2rem;
  }
}

/* ---------- V2.4 对账提醒条与本月运势卡 ---------- */

.due-reminder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px 16px;
  border: 1px solid rgba(212, 175, 55, 0.55);
  border-radius: 12px;
  background: rgba(212, 175, 55, 0.1);
}

.due-reminder-text {
  font-size: 0.92rem;
  color: var(--gold-soft);
}

.due-reminder-btn {
  flex-shrink: 0;
  padding: 6px 16px;
  border: 1px solid rgba(212, 175, 55, 0.6);
  border-radius: 999px;
  background: transparent;
  color: var(--gold-soft);
  font-size: 0.88rem;
  cursor: pointer;
  min-height: var(--touch);
}

.due-reminder-btn:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

.due-reminder-btn:hover {
  background: rgba(212, 175, 55, 0.15);
}

.daily-collapsed #monthly-title {
  font-size: 1rem;
  margin: 0 0 6px;
}

.monthly-theme {
  line-height: 1.8;
}

.monthly-phases {
  margin-top: 12px;
}

.monthly-phase-span {
  color: var(--gold-soft);
  margin-right: 4px;
}

/* ---------- 微信扫码支付（订单卡内，V2 正式渠道） ---------- */

.wxpay-box {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--ink-line);
}

.wxpay-hint {
  margin: 0 0 8px;
  font-size: 0.85rem;
  color: var(--text-dim);
}

/* 正式付款是主动作：与登录键同款金色描边 */
.wxpay-btn {
  width: 100%;
  border-color: var(--gold);
  color: var(--gold);
}

.wxpay-btn:disabled {
  border-color: var(--ink-line);
  color: var(--text-dim);
  cursor: default;
  opacity: 0.6;
}

/* qrSvg 自带白底黑码；暗色卡片里衬一圈白边，扫码器识别余量更足 */
.wxpay-qr {
  display: flex;
  justify-content: center;
  margin-top: 12px;
}

.wxpay-qr svg {
  width: 180px;
  height: 180px;
  border-radius: 8px;
}

.wxpay-status {
  margin: 10px 0 0;
  font-size: 0.85rem;
  color: var(--text-dim);
  text-align: center;
}

.wxpay-status-error {
  color: var(--danger);
}

.wxpay-actions {
  margin-top: 10px;
}

.wxpay-refresh-btn {
  width: 100%;
}
