:root {
  --page-bg: #f7edf7;
  --page-bg-2: #efe7fb;

  --night-0: #101525;
  --night-1: #151b2f;
  --night-2: #1b2540;
  --night-3: #222c4a;
  --night-pink: #2c1b31;
  --night-purple: #241f3d;
  --night-red: #2d1b27;

  --txt-light: #f4f7ff;
  --txt-light-soft: #dbe5f7;
  --txt-light-muted: #bdc9dd;

  --txt-dark: #241823;
  --txt-dark-soft: #4b3546;
  --txt-title: #68264a;

  --pink: #e83f8f;
  --pink-2: #ff78b7;
  --blue: #258fbd;
  --blue-2: #62c8f3;
  --purple: #8a5be8;
  --purple-2: #b8a2ff;
  --gold: #c58a18;
  --red: #df315b;

  --fold-bg: #fffafd;
  --fold-border: #e6bdd3;
  --shadow: rgba(70, 28, 60, 0.13);
  --shadow-night: rgba(0, 0, 0, 0.34);
}

/* =========================
   全局
========================= */

html,
body {
  margin: 0;
  padding: 0;
  font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", "Segoe UI", Arial, sans-serif !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(232, 63, 143, 0.12) 0%, transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(37, 143, 189, 0.10) 0%, transparent 30%),
    linear-gradient(180deg, var(--page-bg) 0%, var(--page-bg-2) 100%) !important;
  color: var(--txt-dark) !important;
}

body *,
.fold-card *,
.stat-row *,
.change-box *,
.memory-row *,
.choice-card *,
.scene-card *,
.player-info *,
.makima-info *,
.danger-card *,
.contract-card * {
  box-sizing: border-box;
}

/* =========================
   正文：深色背景浅色字，强制覆盖
========================= */

.story-card {
  background: linear-gradient(180deg, var(--night-1) 0%, var(--night-0) 100%) !important;
  border: 1px solid #33476f !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  margin: 18px 0 !important;
  color: var(--txt-light) !important;
  box-shadow: 0 10px 28px var(--shadow-night), 0 0 16px rgba(37, 143, 189, 0.12) !important;
}

.story-card,
.story-card *,
.story-card p,
.story-card span,
.story-card div,
.story-card strong,
.story-body,
.story-body *,
.story-body p,
.story-body span,
.story-body div,
.story-body strong {
  color: var(--txt-light) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.story-title {
  color: #ff9ac8 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: 2px !important;
  margin-bottom: 16px !important;
  padding-left: 10px !important;
  border-left: 5px solid var(--pink-2) !important;
  text-shadow: 0 0 10px rgba(255, 120, 183, 0.25) !important;
}

.story-body {
  font-size: 16px !important;
  line-height: 1.95 !important;
}

.story-body p {
  margin: 12px 0 !important;
  color: var(--txt-light) !important;
  opacity: 1 !important;
}

/* 正文内所有段落默认深色块，防止被旧CSS打成浅色 */
.story-body > p {
  background: var(--night-2) !important;
  border: 1px solid #35486f !important;
  border-left: 4px solid var(--blue-2) !important;
  padding: 12px 14px !important;
  border-radius: 9px !important;
  color: var(--txt-light) !important;
  opacity: 1 !important;
}

/* 场景 */
.story-body .scene {
  background: #17233b !important;
  border: 1px solid #345b7a !important;
  border-left: 4px solid var(--blue-2) !important;
  color: #e4f2ff !important;
}

/* 玩家动作 */
.story-body .action {
  background: #2b1d31 !important;
  border: 1px solid #6f3d66 !important;
  border-left: 4px solid var(--pink-2) !important;
  color: #ffe8f4 !important;
}

/* 角色反应 */
.story-body .makima-reaction,
.story-body .enkidu-reaction {
  background: #211f3b !important;
  border: 1px solid #5a4fa0 !important;
  border-left: 4px solid var(--purple-2) !important;
  color: #eeeaff !important;
}

/* 内在/心态 */
.story-body .inner {
  background: #2d1b27 !important;
  border: 1px solid #74364f !important;
  border-left: 4px solid #ff6686 !important;
  color: #ffe5ec !important;
}

/* 收束 */
.story-body .closing {
  background: #171f35 !important;
  border: 1px solid #384865 !important;
  border-left: 4px solid #f0b866 !important;
  color: #f7dfbd !important;
}

/* =========================
   对话：正文内也保持深色
========================= */

.dialogue {
  padding: 12px 14px !important;
  border-radius: 10px !important;
  color: var(--txt-light) !important;
}

.player-line {
  background: #183347 !important;
  border: 1px solid #4fa8ce !important;
  color: #e8f7ff !important;
}

.makima-line,
.enkidu-line {
  background: #332040 !important;
  border: 1px solid #8b5db6 !important;
  color: #f5ecff !important;
}

.player-line *,
.makima-line *,
.enkidu-line *,
.dialogue * {
  color: inherit !important;
  opacity: 1 !important;
}

.speaker {
  font-weight: 900 !important;
  color: #ffffff !important;
  margin-right: 4px !important;
}

/* =========================
   折叠卡片：浅色高可读
========================= */

.fold-card {
  background: var(--fold-bg) !important;
  border: 1px solid var(--fold-border) !important;
  border-radius: 14px !important;
  margin: 18px 0 !important;
  color: var(--txt-dark) !important;
  line-height: 1.75 !important;
  box-shadow: 0 4px 14px var(--shadow) !important;
  overflow: hidden !important;
}

.fold-card *,
.fold-card p,
.fold-card span,
.fold-card div,
.fold-card strong {
  color: var(--txt-dark) !important;
  opacity: 1 !important;
}

.fold-card summary {
  cursor: pointer !important;
  user-select: none !important;
  list-style: none !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  color: var(--txt-title) !important;
  padding: 15px 18px !important;
  background: linear-gradient(90deg, #ffe2ef 0%, #f0e7ff 100%) !important;
  border-left: 5px solid var(--pink) !important;
}

.fold-card summary::-webkit-details-marker {
  display: none !important;
}

.fold-card summary::before {
  content: "▶" !important;
  display: inline-block !important;
  margin-right: 8px !important;
  color: var(--pink) !important;
}

.fold-card[open] summary::before {
  content: "▼" !important;
}

.fold-card summary:hover {
  background: linear-gradient(90deg, #ffd5e8 0%, #e8dcff 100%) !important;
}

.fold-card > p {
  margin: 10px 14px !important;
  padding: 10px 12px !important;
  background: #ffffff !important;
  border: 1px solid #ead7e3 !important;
  border-radius: 8px !important;
}

/* =========================
   状态判定
========================= */

.thought-card {
  border-left: 4px solid var(--gold) !important;
}

.thought-card summary {
  border-left-color: var(--gold) !important;
  background: linear-gradient(90deg, #fff0c8 0%, #fff7e8 100%) !important;
  color: #694600 !important;
}

.thought-card summary::before {
  color: var(--gold) !important;
}

/* =========================
   场景
========================= */

.scene-card {
  border-left: 4px solid var(--blue) !important;
}

.scene-card summary {
  border-left-color: var(--blue) !important;
}

.scene-card summary::before {
  color: var(--blue) !important;
}

.scene-card > p {
  background: #eef8ff !important;
  border: 1px solid #bdddf0 !important;
}

/* =========================
   主角信息
========================= */

.player-info {
  border-left: 4px solid var(--pink) !important;
}

.player-info summary {
  border-left-color: var(--pink) !important;
}

.player-info > p {
  background: #fff0f7 !important;
  border: 1px solid #efbdd7 !important;
}

/* =========================
   角色信息
========================= */

.makima-info,
.enkidu-info {
  border-left: 4px solid var(--purple) !important;
}

.makima-info summary,
.enkidu-info summary {
  border-left-color: var(--purple) !important;
}

.makima-info summary::before,
.enkidu-info summary::before {
  color: var(--purple) !important;
}

.makima-info > p,
.enkidu-info > p {
  background: #f4efff !important;
  border: 1px solid #d9ccff !important;
}

/* =========================
   属性
========================= */

.stat-card {
  border-left: 4px solid var(--pink) !important;
}

.stat-card summary {
  border-left-color: var(--pink) !important;
}

.stat-row {
  background: #fff2f8 !important;
  border: 1px solid #efbdd7 !important;
}

.change-box {
  background: #fff5e3 !important;
  border: 1px solid #edd09b !important;
}

/* =========================
   心态与触发点
========================= */

.danger-card {
  border-left: 4px solid var(--red) !important;
}

.danger-card summary {
  border-left-color: var(--red) !important;
  background: linear-gradient(90deg, #ffe2e9 0%, #fff0f4 100%) !important;
  color: #7e263d !important;
}

.danger-card summary::before {
  color: var(--red) !important;
}

.danger-card > p {
  background: #fff0f4 !important;
  border: 1px solid #efbcc9 !important;
}

/* =========================
   契约/备用模块
========================= */

.contract-card {
  border-left: 4px solid var(--gold) !important;
}

.contract-card summary {
  border-left-color: var(--gold) !important;
}

.contract-card summary::before {
  color: var(--gold) !important;
}

.contract-card > p {
  background: #fff5e3 !important;
  border: 1px solid #edd09b !important;
}

/* =========================
   关系与姿态/备用模块
========================= */

.relation-card,
.body-card {
  border-left: 4px solid var(--purple) !important;
}

.relation-card summary,
.body-card summary {
  border-left-color: var(--purple) !important;
}

.relation-card summary::before,
.body-card summary::before {
  color: var(--purple) !important;
}

.relation-row,
.body-row {
  background: #f4efff !important;
  border: 1px solid #d9ccff !important;
}

/* =========================
   记忆
========================= */

.memory-card {
  border-left: 4px solid var(--purple) !important;
}

.memory-card summary {
  border-left-color: var(--purple) !important;
}

.memory-card summary::before {
  color: var(--purple) !important;
}

.memory-row {
  background: #f4efff !important;
  border: 1px solid #d9ccff !important;
}

/* =========================
   自动选项
========================= */

.choice-card {
  border-left: 4px solid var(--pink) !important;
}

.choice-card summary {
  border-left-color: var(--pink) !important;
}

.choice-card > p {
  background: #fff0f7 !important;
  border: 1px solid #efbdd7 !important;
}

.choice-card p strong,
.stat-card p strong,
.danger-card p strong,
.contract-card p strong,
.relation-card p strong,
.body-card p strong,
.memory-card p strong,
.scene-card p strong,
.player-info p strong,
.makima-info p strong,
.enkidu-info p strong {
  color: #241823 !important;
  font-weight: 900 !important;
}

/* =========================
   数值进度条
========================= */

.bar {
  display: inline-block !important;
  width: 100% !important;
  max-width: 480px !important;
  height: 12px !important;
  background: #f2d8e8 !important;
  border: 1px solid #d8aac6 !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  vertical-align: middle !important;
  margin: 6px 8px 6px 0 !important;
  box-shadow: inset 0 1px 4px rgba(100, 35, 72, 0.12) !important;
}

.bar-fill {
  display: block !important;
  height: 100% !important;
  width: 0%;
  min-width: 0 !important;
  background: linear-gradient(90deg, #e83f8f, #8a5be8) !important;
  border-radius: 999px !important;
  transition: width 0.3s ease !important;
}

.danger-fill {
  background: linear-gradient(90deg, #1d8fb8, #df315b) !important;
}

.bar-fill[style*="width:0%"] {
  display: none !important;
}

.bar-fill[style*="width:1%"],
.bar-fill[style*="width:2%"],
.bar-fill[style*="width:3%"] {
  border-radius: 999px 0 0 999px !important;
}

.breakthrough-fill {
  background: linear-gradient(90deg, #1d8fb8, #8a5be8, #e83f8f) !important;
}

.contract-fill {
  background: linear-gradient(90deg, #c58a18, #e83f8f) !important;
}

/* =========================
   状态标签
========================= */

.status-tag {
  display: inline-block !important;
  padding: 2px 8px !important;
  margin: 2px 4px 2px 0 !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  background: #ffe6f1 !important;
  border: 1px solid #efbdd7 !important;
  color: #241823 !important;
}

.status-danger {
  background: #ffe1e8 !important;
  border-color: #efbcc9 !important;
  color: #7e263d !important;
}

.status-contract {
  background: #fff2c8 !important;
  border-color: #edd09b !important;
  color: #75511d !important;
}

.status-control {
  background: #f2eaff !important;
  border-color: #d9ccff !important;
  color: #4a3a7a !important;
}

/* =========================
   移动端适配
========================= */

@media (max-width: 700px) {
  .story-card,
  .fold-card {
    margin: 14px 0 !important;
  }

  .story-card {
    padding: 14px !important;
    border-radius: 12px !important;
  }

  .story-title,
  .fold-card summary {
    font-size: 18px !important;
  }

  .fold-card summary {
    padding: 14px 16px !important;
  }

  .story-body {
    font-size: 15px !important;
    line-height: 1.8 !important;
  }

  .story-body p {
    margin: 10px 0 !important;
  }

  .fold-card > p {
    margin: 8px 10px !important;
    padding: 9px 10px !important;
  }

  .dialogue {
    padding: 9px 10px !important;
  }

  .bar {
    max-width: 100% !important;
    height: 10px !important;
  }

  .status-tag {
    font-size: 12px !important;
    padding: 2px 7px !important;
  }
}