/*
 * 新国风叙事 CG 主题（2026-08）
 *
 * 目标不是复刻古画，也不是把古装人物放进现代时尚棚拍。完整保留晚明世界，
 * 以当代文字游戏常见的二维人物审美、通透光色、情绪化镜头和丝绸层次重塑界面。
 * 白日保持春庭高明度；夜景用蓝紫月光与暖灯形成可读层次，不允许全屏压黑。
 */

:root {
  --paper: #fff7ed;
  --paper-light: #fffdf8;
  --paper-dark: #e7d6c7;
  --ink: #292d3b;
  --ink-soft: #646676;
  --night: #e8edf8;
  --night-soft: #d8dfef;
  --gold: #b98642;
  --gold-bright: #d2a15b;
  --cinnabar: #c84f5c;
  --jade: #3f8f83;
  --honey: #d39847;
  --azurite: #355f98;
  --lilac: #8c79ad;
  --line: rgba(72, 75, 96, .2);
  --silk: rgba(255, 250, 245, .9);
  --silk-strong: rgba(255, 253, 249, .975);
  --cg-shadow: 0 22px 64px rgba(79, 63, 74, .16);
}

html,
body {
  color: var(--ink);
  background:
    radial-gradient(circle at 14% 10%, rgba(242, 180, 188, .2), transparent 28%),
    radial-gradient(circle at 86% 86%, rgba(91, 146, 170, .15), transparent 30%),
    #f3e9df;
}

#app::after {
  opacity: .34;
  mix-blend-mode: soft-light;
  background-image:
    radial-gradient(ellipse at 12% 18%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(ellipse at 74% 12%, rgba(229,137,154,.34) 0 1px, transparent 2px),
    radial-gradient(circle at 48% 82%, rgba(82,128,152,.22) 0 1px, transparent 2px);
  background-size: 31px 37px, 43px 49px, 53px 61px;
}

.loading,
.fatal-card {
  color: var(--ink);
  background: linear-gradient(145deg, #fffdf8, #f3e4dd);
}

.eyebrow { color: var(--cinnabar); }

/* 年龄门：从明亮宅门进入，而不是穿过一堵黑墙。 */
.age-gate {
  color: var(--ink);
  background:
    linear-gradient(90deg, rgba(255,250,244,.96) 0%, rgba(255,250,244,.86) 45%, rgba(255,250,244,.25) 76%),
    url('../assets/bg/compound_new_guofeng.webp') center / cover;
}

.age-gate::before {
  border: 1px solid rgba(185, 127, 92, .26);
  background: rgba(255, 248, 242, .12);
  box-shadow:
    inset 0 0 0 8px rgba(255, 253, 249, .42),
    inset 0 0 0 9px rgba(200, 79, 92, .12),
    0 26px 90px rgba(75, 65, 82, .13);
}

.age-gate p:not(.eyebrow) { color: #5d6070; }

.age-seal {
  color: var(--cinnabar);
  border-color: var(--cinnabar);
  background: rgba(255, 250, 245, .76);
  box-shadow: 0 10px 28px rgba(152, 63, 79, .14);
}

/* 按钮是剧情签，不是黑色系统框。 */
.ink-button,
.plain-button {
  border-color: rgba(80, 91, 120, .28);
  color: #343745;
  background: rgba(255, 252, 248, .84);
  box-shadow: 0 9px 25px rgba(61, 69, 91, .08);
  backdrop-filter: blur(8px);
}

.ink-button:hover:not(:disabled),
.plain-button:hover {
  color: #a93345;
  border-color: rgba(200, 79, 92, .58);
  background: #fffaf7;
}

.ink-button.primary {
  color: #fffaf7;
  border-color: #b94050;
  background: linear-gradient(145deg, #d96370, #b83f50);
  box-shadow: 0 13px 32px rgba(177, 56, 73, .24);
}

.ink-button.primary:hover:not(:disabled),
.ink-button.primary:focus-visible {
  color: #fff;
  border-color: #a83546;
  background: linear-gradient(145deg, #e06d79, #aa3547);
}

.ink-button.story-continue {
  color: #406d91;
  background: transparent;
  box-shadow: none;
}

.ink-button.story-continue:hover:not(:disabled) { color: var(--cinnabar); }

/* 标题图自带左侧春庭留白，标题直接进入画面，不另做硬分栏。 */
.title-screen {
  display: grid;
  grid-template-columns: minmax(19rem, 42%) 1fr;
  color: var(--ink);
  background: #f7e9e2;
}

.title-art {
  background-position: center;
  filter: saturate(1.04) contrast(1.01) brightness(1.02);
}

.title-art::after {
  background:
    linear-gradient(90deg, rgba(255,250,246,.96) 0%, rgba(255,250,246,.82) 22%, rgba(255,250,246,.18) 45%, transparent 66%),
    linear-gradient(0deg, rgba(92,65,83,.1), transparent 45%);
}

.title-copy {
  z-index: 2;
  grid-column: 1;
  padding: 8vh 2.2vw 7vh 5.3vw;
  background: radial-gradient(circle at 30% 48%, rgba(255,255,255,.62), transparent 54%);
}

.title-copy::before {
  right: auto;
  left: 2.1vw;
  top: 8vh;
  color: rgba(192, 66, 85, .08);
}

.title-copy::after {
  content: "";
  width: min(18rem, 76%);
  height: 3px;
  margin: .2rem 0 1.25rem;
  order: -1;
  background: linear-gradient(90deg, var(--azurite) 0 20%, var(--cinnabar) 20% 40%, #d5aa65 40% 60%, var(--lilac) 60% 80%, var(--jade) 80%);
  box-shadow: 0 1px rgba(255,255,255,.86);
}

.title-copy h1 {
  color: #2e3040;
  text-shadow: 0 2px rgba(255,255,255,.78);
}

.title-subtitle { color: #996334; }
.identity-line { color: #545969; border-left-color: var(--cinnabar); }
.rating-line { color: #a74d59; }
.save-note { color: #767786; }

/* 游戏框架像一层铺在 CG 上的轻绢，不再把画面装进暗木盒。 */
.game-shell { background: #e8e5e7; }

.topbar {
  color: #343846;
  border-bottom-color: rgba(64, 96, 135, .22);
  background:
    linear-gradient(90deg, rgba(255,253,249,.98), rgba(239,245,248,.95) 55%, rgba(255,241,238,.97));
  box-shadow: 0 8px 30px rgba(65, 71, 91, .12);
}

.day-mark { border-right-color: rgba(64, 96, 135, .18); }
.day-mark b { color: #7a5a2e; }
.day-mark span,
.hud-notice { color: #707383; }
.hud-notice.urgent { color: #a93647; background: rgba(200,79,92,.08); }
.top-actions #btn-mute { color: #6e7180; }

.phase-stage,
.dialogue-stage,
.night-talk-stage,
.scene-view { background: #e7e4e7; }

#app .visual-stage::before { filter: saturate(1.01) contrast(1.01) brightness(1.03); }

#app .visual-stage::after {
  background:
    linear-gradient(180deg, rgba(255,248,244,.02), rgba(77,72,91,.08)),
    radial-gradient(120% 96% at 76% 36%, transparent 55%, rgba(70,64,89,.11) 100%);
}

/* 通用对话与账册面板。 */
.decision-panel,
.confirm-card,
.gallery-book,
.roster-sheet,
.epilogue-copy,
.fate-coda-copy {
  color: var(--ink);
  border-color: rgba(86, 92, 119, .22);
  background:
    linear-gradient(145deg, var(--silk-strong), rgba(245, 236, 236, .94));
  box-shadow: var(--cg-shadow);
  backdrop-filter: blur(16px) saturate(.9);
}

.decision-panel::before,
.confirm-card::before {
  content: "";
  position: absolute;
  inset: 7px;
  pointer-events: none;
  border: 1px solid rgba(200, 79, 92, .09);
}

.phase-header h2,
.decision-panel h2,
.confirm-card h2,
.gallery-book h2,
.roster-sheet h2 { color: #303342; }

.phase-header > p:last-child,
.phase-lead,
.speaker-line,
.consent-note,
.want-line { color: #626574; }

.morning-note,
.day-speaker,
.want-line {
  border-left-color: rgba(200,79,92,.58);
  color: #575b69;
  background: rgba(217,99,112,.055);
}

.choice-button {
  color: #343745;
  border: 1px solid rgba(79, 91, 120, .18);
  border-left: 4px solid rgba(78, 125, 155, .58);
  background: rgba(255,253,249,.76);
  box-shadow: 0 7px 22px rgba(66,68,89,.06);
}

.choice-button span { color: #676a79; }
.choice-button .choice-meta { color: #9a6834; }

.choice-button:hover:not(:disabled):not([aria-disabled="true"]),
.choice-button:focus-visible {
  border-color: rgba(200,79,92,.5);
  border-left-color: var(--cinnabar);
  background: #fffaf7;
  box-shadow: 0 10px 27px rgba(141,65,81,.1);
}

.story-progress { color: #9b6d3a; }
.story-progress b { color: #4c5060; }

/* 五扇院门像角色卡面，但仍属于同一个古代庭院。 */
.visit-prompt {
  color: #333746;
  border-left-color: var(--cinnabar);
  background: rgba(255,251,247,.9);
  box-shadow: 0 14px 40px rgba(72,67,88,.13);
  backdrop-filter: blur(14px);
}

.accord-panel { border-left-color: rgba(71,101,134,.24); }
.accord-heading,
.visit-prompt h2 { color: #353846; }

.accord-seal {
  color: #707383;
  border-color: rgba(74,91,118,.2);
  background: rgba(255,253,249,.72);
}

.accord-seal.complete { color: #8d4450; background: rgba(200,79,92,.07); }

.door-card {
  color: #303441;
  border: 1px solid rgba(87, 92, 119, .27);
  background: #fbf2ed;
  box-shadow: 0 16px 42px rgba(71,65,87,.15);
}

.door-card::before { border-color: rgba(200,79,92,.16); }
.door-card > span { color: #4d5264; background: rgba(255,250,246,.88); }
.door-card img { filter: saturate(1.03) brightness(1.05) contrast(.99); }
.door-card > div { color: #323542; background: linear-gradient(transparent, rgba(251,242,237,.97) 58%); }
.door-card small,
.door-knock,
.door-forecast dd { color: #666978; }

/* 人物近景保留插画质感；只在文字所在一侧覆浅色雾纱。 */
.close-portrait,
.close-portrait.closer {
  filter: drop-shadow(-16px 20px 22px rgba(74,64,87,.17)) saturate(1.03) brightness(1.04) contrast(1.01);
}

#app .dialogue-stage::after,
#app .morning-stage::after { background: linear-gradient(90deg, rgba(255,249,245,.34), transparent 60%); }

.night-talk-cg,
.close-cg,
.close-cg.closer,
#app .scene-view > img { filter: saturate(1.02) brightness(1.03) contrast(1.01); }

.close-cg::after,
.morning-cg::after {
  background:
    linear-gradient(96deg, rgba(244,240,244,.94) 0%, rgba(244,240,244,.8) 30%, rgba(244,240,244,.08) 58%, rgba(63,59,82,.08) 100%),
    radial-gradient(112% 88% at 72% 40%, transparent 52%, rgba(69,62,91,.13) 100%);
}

.close-cg.closer { filter: saturate(1.04) brightness(1.01) contrast(1.02); }
.morning-cg { filter: saturate(1) brightness(1.08) contrast(1); }

#app .night-talk-stage::after,
#app .night-talk-result::after {
  background:
    linear-gradient(96deg, rgba(243,241,249,.96) 0%, rgba(243,241,249,.86) 42%, rgba(243,241,249,.1) 69%),
    linear-gradient(0deg, rgba(72,62,98,.08), transparent 62%);
}

.night-talk-voice,
.night-talk-continuity,
.night-talk-memory,
.route-branch-memory,
.day-consequence,
.ledger-status {
  color: #515565;
  border-color: rgba(75, 91, 120, .22);
  background: rgba(255,253,250,.68);
}

.night-talk-voice b,
.night-talk-continuity b,
.route-branch-memory b,
.day-consequence b { color: #3f4352; }

.night-talk-voice p,
.night-talk-memory p,
.night-talk-continuity p,
.route-branch-memory p { color: #626575; }

.night-talk-prop {
  color: #7b5a2e;
  border-color: rgba(179, 130, 66, .35);
  background: radial-gradient(circle, rgba(255,253,249,.98), rgba(226,214,221,.94) 72%);
  box-shadow: 0 18px 46px rgba(74,65,91,.16), inset 0 0 0 8px rgba(255,255,255,.25);
}

/* 场景册与剧情结果让 CG 继续占主位。 */
#app .scene-scrim {
  background: linear-gradient(90deg, rgba(247,243,246,.93) 0%, rgba(247,243,246,.67) 34%, transparent 66%);
}

#app .scene-caption,
#app .scene-view:is([data-scene-tier="public"], [data-scene-tier="ensemble"]) .scene-caption {
  color: #303442;
  border: 1px solid rgba(77, 91, 119, .21);
  border-left: 4px solid var(--cinnabar);
  background: rgba(255,251,248,.88);
  box-shadow: 0 20px 52px rgba(67,63,84,.15);
  backdrop-filter: blur(14px);
}

#app .scene-caption h2,
#app .scene-caption > p:not(.eyebrow) { color: #343746; }
#app .scene-meta { color: #6a6d7c; }
#app .scene-meta span { border-color: rgba(75,91,119,.22); }

#app .scene-view:is([data-scene-tier="public"], [data-scene-tier="ensemble"]) .scene-scrim {
  background: linear-gradient(0deg, rgba(250,246,247,.72) 0%, rgba(250,246,247,0) 38%);
}

#app .scene-view:is([data-scene-tier="public"], [data-scene-tier="ensemble"]) .scene-caption {
  background: linear-gradient(0deg, rgba(255,251,248,.96) 0%, rgba(255,251,248,.84) 52%, rgba(255,251,248,0) 100%);
  backdrop-filter: none;
}

#app .scene-view:is([data-scene-tier="public"], [data-scene-tier="ensemble"]) > img {
  filter: saturate(1.03) brightness(1.03) contrast(1.01);
}

/* 旧结构里最暗的三张群像，强制回到新 CG 自己的曝光。 */
.scene-view[data-scene-id="inner_court_alliance"] > img,
.scene-view[data-scene-id="inner_court_accord"] > img,
.scene-view[data-scene-id="inner_court_afterglow"] > img {
  filter: saturate(1.03) brightness(1.04) contrast(1.01);
}

.scene-view[data-scene-id="inner_court_alliance"] .scene-caption,
.scene-view[data-scene-id="inner_court_afterglow"] .scene-caption {
  color: var(--ink);
  border-color: rgba(80,95,123,.22);
  border-left-color: var(--cinnabar);
  background: linear-gradient(145deg, rgba(255,253,249,.97), rgba(241,235,241,.92));
}

.shared-night-accord-overview,
.shared-night-accord-entry,
.alliance-tableau-overview,
.alliance-tableau-entry,
.shared-afterglow-tableau-overview,
.shared-afterglow-tableau-entry {
  color: #4a4e5e;
  border-color: rgba(80,96,124,.2);
  background: rgba(255,252,249,.68);
}

.shared-night-accord-overview header,
.shared-night-accord-entry > header,
.alliance-tableau-overview > header,
.alliance-tableau-entry > header,
.shared-afterglow-tableau-overview header,
.shared-afterglow-tableau-entry > header { color: #767887; }

.shared-night-accord-overview header b,
.shared-night-accord-entry > header b,
.alliance-tableau-overview > header b,
.alliance-tableau-entry > header b,
.shared-afterglow-tableau-overview header b,
.shared-afterglow-tableau-entry > header b { color: #8e6040; }

.shared-night-accord-overview > div > span,
.shared-night-accord-ledger article,
.alliance-tableau-overview,
.alliance-tableau-entry,
.alliance-tableau-path > span,
.alliance-tableau-actions article,
.shared-afterglow-tableau-overview > div > span,
.shared-afterglow-tableau-actions article {
  border-color: rgba(91,111,140,.18);
  background: rgba(247,244,247,.68);
}

.shared-night-accord-overview b,
.shared-night-accord-ledger b,
.alliance-tableau-members b,
.alliance-tableau-path b,
.alliance-tableau-actions b,
.shared-afterglow-tableau-overview b,
.shared-afterglow-tableau-actions b { color: #805a42; }

.shared-night-accord-overview em,
.shared-night-accord-overview small,
.shared-night-accord-ledger p,
.shared-night-accord-conclusion,
.alliance-tableau-overview > p,
.alliance-tableau-entry > p,
.alliance-tableau-members span,
.alliance-tableau-path small,
.alliance-tableau-path em,
.alliance-tableau-actions p,
.shared-afterglow-tableau-overview small,
.shared-afterglow-tableau-overview em,
.shared-afterglow-tableau-entry > p,
.shared-afterglow-tableau-actions p { color: #666a79; }

.alliance-tableau-members figure { background: rgba(231,226,232,.72); }
.alliance-tableau-members img,
.alliance-tableau-actions img { filter: saturate(1) brightness(1.03); }
.alliance-tableau-members figcaption { background: linear-gradient(90deg, transparent, rgba(251,247,245,.94) 42%); }

.shared-night-accord-ledger blockquote,
.alliance-tableau-entry > blockquote,
.shared-afterglow-tableau-entry > blockquote {
  color: #4b655f;
  border-left-color: rgba(63,143,131,.54);
  background: rgba(63,143,131,.07);
}

.gallery-overlay,
.confirm-overlay,
.roster-overlay,
.epilogue-overlay,
.fate-coda-overlay {
  background: rgba(224, 220, 226, .62);
  backdrop-filter: blur(14px) saturate(.82);
}

.gallery-book > header,
.roster-sheet > header,
.epilogue-copy > header,
.fate-coda-copy > header { border-color: rgba(79,94,122,.19); }

.roster-sheet,
.gallery-book { color: #383c4a; }

/* 压力与成功只改变局部色，不改变整场曝光。 */
.day-consequence.resolved {
  border-color: rgba(63,143,131,.4);
  background: rgba(63,143,131,.07);
}

.day-consequence.missed,
.hud-notice.urgent {
  border-color: rgba(200,79,92,.44);
  background: rgba(200,79,92,.075);
}

.fast .scene-view > img { animation: none; filter: saturate(1.02) brightness(1.03); }

/*
 * 复合叙事页不能继续沿用旧主题的“黑底上叠半透明卡”结构。新插画本身已经
 * 承担场景气氛；面板、旁听者和多人回应要成为彼此分开的纸面层，不能互相透图。
 */
#app :is(.opening-aftermath-stage, .day-aftermath-stage, .aftermath-stage, [class*="-aftermath-stage"]) {
  background: #e8e4e7;
}

#app :is(
  .day-aftermath-lead,
  .aftermath-main,
  .personal-afterglow-aftermath-close
) {
  filter: saturate(1.02) brightness(1.04) contrast(1.01);
}

#app .decision-panel :is(p:not(.eyebrow), li, dd, small, em) { color: #626574; }
#app .decision-panel :is(h2, h3, h4, b, strong, dt) { color: #343746; }

#app .decision-panel :is(
  blockquote,
  [class*="-origin"],
  [class*="-echo"],
  [class*="-memory"],
  [class*="-stake"],
  [class*="-ledger"],
  [class*="-rule"],
  [class*="-voice"],
  [class*="-note"]
) {
  color: #515565;
  border-color: rgba(75, 91, 120, .22);
  background: rgba(255, 253, 250, .72);
}

#app .decision-panel :is(
  [class*="-transcript"],
  [class*="-archive"]
) li,
#app .supporting-context > summary,
#app .supporting-context-pages > * {
  color: #5f6271;
  border-color: rgba(75, 91, 120, .18);
  background: rgba(244, 240, 241, .82);
}

#app .decision-panel :is(
  blockquote,
  [class*="-origin"],
  [class*="-echo"],
  [class*="-memory"],
  [class*="-stake"],
  [class*="-ledger"],
  [class*="-rule"],
  [class*="-voice"],
  [class*="-note"],
  [class*="-transcript"] li,
  [class*="-archive"] li
) :is(p, small, em) { color: #626574; }

#app .decision-panel :is(
  blockquote,
  [class*="-origin"],
  [class*="-echo"],
  [class*="-memory"],
  [class*="-stake"],
  [class*="-ledger"],
  [class*="-rule"],
  [class*="-voice"],
  [class*="-note"],
  [class*="-transcript"] li,
  [class*="-archive"] li
) :is(b, strong) { color: #3f4352; }

#app .decision-panel :is(
  blockquote,
  [class*="-origin"],
  [class*="-echo"],
  [class*="-memory"],
  [class*="-stake"],
  [class*="-ledger"],
  [class*="-rule"],
  [class*="-voice"],
  [class*="-note"],
  [class*="-transcript"] li,
  [class*="-archive"] li
) > span { color: #91623f; }

/* 多人卡不再悬浮在同一张人物图上：给卡组一张不透底的薄绢托纸。 */
#app :is(
  .opening-aftermath-cast,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) {
  padding: .45rem;
  border: 1px solid rgba(80, 95, 123, .18);
  background: rgba(249, 246, 246, .94);
  box-shadow: 0 18px 52px rgba(67, 63, 84, .14);
  backdrop-filter: blur(12px) saturate(.9);
}

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figure {
  border-color: rgba(80, 95, 123, .2);
  background: #eee7e6;
  filter: none;
  transform: none;
}

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figure:not(.speaking):not(.is-responding) { opacity: .8; }

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figure:is(.speaking, .is-responding) {
  opacity: 1;
  border-color: rgba(200, 79, 92, .54);
  box-shadow: 0 10px 28px rgba(130, 66, 82, .14);
}

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) img { filter: saturate(1.02) brightness(1.04) contrast(1.01); }

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figcaption {
  color: #444856;
  background: linear-gradient(transparent, rgba(252, 248, 246, .98) 48%);
}

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figcaption :is(b, strong) { color: #353846; }

#app :is(
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .crisis-cast,
  .crisis-aftermath-cast,
  .pair-portraits,
  .pair-aftermath-cast,
  .jiaoer-aftermath-cast,
  .invitation-aftermath-cast,
  .council-resolution-cast,
  .public-aftermath-cast,
  .act-aftermath-cast,
  .final-aftermath-cast,
  .alliance-assembly-cast,
  .alliance-result-cast,
  .collapse-cast,
  .collapse-result-cast,
  .shared-result-cast,
  .shared-dawn-result-cast
) figcaption :is(span, small, em, p) { color: #666978; }

.day-aftermath-reactions figure:only-child {
  width: min(250px, 100%);
  height: min(520px, 72%);
  align-self: center;
}

.aftermath-observer {
  padding: .38rem;
  color: #3f4352;
  border: 1px solid rgba(80, 95, 123, .2);
  background: rgba(252, 248, 246, .94);
  box-shadow: 0 14px 38px rgba(67, 63, 84, .14);
  opacity: 1;
}

.aftermath-observer img {
  mask-image: none;
  filter: saturate(1.02) brightness(1.04) contrast(1.01);
}

.aftermath-observer figcaption span { color: #91623f; }
.aftermath-observer figcaption b { color: #353846; }

/* 单人抉择按内容收高，避免短段落被一整块空白纸面包到屏幕底。 */
.dialogue-panel,
.night-talk-panel {
  top: 50%;
  bottom: auto;
  max-height: 88%;
  overflow-y: auto;
  transform: translateY(-50%);
}

/* 结局与后日谈也必须延续亮色叙事，不在最后一屏突然回到旧黑金主题。 */
.ending-view {
  color: var(--ink);
  background: #eee7e6;
}

.ending-art,
.ending-view[data-ending="exclusive"] .ending-art,
.ending-view[data-ending="intrigue"] .ending-art,
.ending-view[data-ending="unstable"] .ending-art {
  filter: saturate(1.01) brightness(1.03) contrast(1.01);
  background-blend-mode: screen;
}

.ending-copy {
  border-left: 1px solid rgba(80, 95, 123, .16);
  background:
    radial-gradient(circle at 18% 12%, rgba(218, 113, 126, .08), transparent 35%),
    linear-gradient(145deg, rgba(255, 253, 249, .985), rgba(240, 237, 243, .97));
  box-shadow: -20px 0 54px rgba(67, 63, 84, .12);
}

.ending-copy h1 { color: #303342; }
.ending-copy h1:focus-visible {
  outline: 2px solid rgba(200, 79, 92, .54);
  outline-offset: .3rem;
}
.ending-tag { color: #9a6834; }
.ending-copy > p:not(.eyebrow):not(.ending-tag):not(.ending-note) { color: #5f6372; }
.ending-note { color: #737584; }

.ending-ledger span,
.ending-habits,
.ending-habits article,
.household-ending span {
  color: #626574;
  border-color: rgba(80, 95, 123, .18);
  background: rgba(255, 253, 250, .64);
}

.ending-ledger b,
.ending-habits > header b,
.ending-habits article b,
.household-ending b { color: #454958; }

.ending-habits > header,
.ending-habits article span,
.ending-habits article small,
.household-ending small { color: #737584; }

.epilogue-book,
.fate-coda-book {
  color: var(--ink);
  border-color: rgba(80, 95, 123, .24);
  background: #eee7e8;
  box-shadow: 0 32px 90px rgba(67, 63, 84, .28);
}

.epilogue-art { background: #e8e2e3; }
.epilogue-art::after { background: linear-gradient(90deg, transparent 62%, rgba(244, 239, 240, .9)); }
.epilogue-art img { filter: saturate(1.02) brightness(1.03) contrast(1.01); }
.epilogue-art > span { color: rgba(154, 104, 52, .22); }

.epilogue-copy h2,
.epilogue-body,
.epilogue-progress,
.epilogue-relations b,
.epilogue-route-note,
.epilogue-habit b,
.epilogue-habit p,
.epilogue-night-conversations header b,
.epilogue-night-conversations li b,
.epilogue-night-conversations li p { color: #4e5261; }

.epilogue-relations span,
.epilogue-route-note,
.epilogue-habit,
.epilogue-night-conversations,
.epilogue-night-conversations li {
  color: #666978;
  border-color: rgba(80, 95, 123, .18);
  background: rgba(255, 253, 250, .64);
}

.fate-coda-art { filter: saturate(1.01) brightness(1.03) contrast(1.01); }
.fate-coda-art::after {
  background: linear-gradient(90deg, rgba(242, 241, 246, .98) 0%, rgba(242, 241, 246, .9) 31%, rgba(242, 241, 246, .2) 55%, transparent 76%);
}

.fate-coda-copy {
  color: #4e5261;
  background: linear-gradient(90deg, rgba(248, 250, 252, .99), rgba(248, 250, 252, .9) 72%, transparent);
}

.fate-coda-copy > header p,
.fate-coda-copy > header .eyebrow,
.fate-coda-progress i,
.fate-coda-variants > span { color: #6d7180; }

.fate-coda-variants,
.fate-coda-variants button {
  color: #555968;
  border-color: rgba(80, 95, 123, .2);
  background: rgba(255, 253, 250, .7);
}

.fate-coda-variants button.current {
  color: #8d4450;
  border-color: rgba(200, 79, 92, .48);
  background: rgba(200, 79, 92, .07);
}

.fate-coda-copy h2 { color: #303442; }
.fate-coda-body,
.fate-coda-decision > p,
.fate-coda-result p,
.fate-coda-combination > p { color: #5f6372; }

.fate-coda-ledger-section,
.fate-coda-ledger-section article,
.fate-coda-result {
  color: #555968;
  border-color: rgba(80, 95, 123, .2);
  background: rgba(255, 253, 250, .7);
}

.fate-coda-ledger-section > header span,
.fate-coda-ledger-section article > span,
.fate-coda-result span,
.fate-coda-combination > span { color: #737786; }

.fate-coda-ledger-section > header h3,
.fate-coda-ledger-section article > b,
.fate-coda-result b,
.fate-coda-combination > b { color: #454958; }

.fate-coda-ledger-section article > p { color: #626574; }

.fate-coda-decision .choice-button {
  color: #343745;
  border-color: rgba(79, 91, 120, .2);
  background: rgba(255, 253, 249, .82);
}

.fate-coda-decision .choice-button:hover,
.fate-coda-decision .choice-button:focus-visible {
  border-color: rgba(200, 79, 92, .5);
  background: #fffaf7;
}

.fate-coda-copy > footer > span { color: #707483; }

@media (max-width: 900px) {
  .age-gate {
    background:
      linear-gradient(0deg, rgba(255,250,245,.98) 0%, rgba(255,250,245,.87) 56%, rgba(255,250,245,.22) 100%),
      url('../assets/bg/compound_new_guofeng.webp') center / cover;
  }

  .title-art {
    inset: 0 0 auto;
    height: 52%;
    background-color: #f8e8e2;
    background-position: 63% top;
    background-size: auto 100%;
    background-repeat: no-repeat;
  }

  .title-art::after {
    background: linear-gradient(0deg, #f7e8e2 0%, rgba(247,232,226,.86) 36%, rgba(247,232,226,.04) 72%);
  }

  .title-copy {
    justify-content: flex-start;
    padding: 42vh 1.2rem 1.25rem;
    background: linear-gradient(0deg, rgba(247,232,226,.99), rgba(247,232,226,.8) 68%, transparent);
  }

  .title-copy h1 {
    white-space: nowrap;
    font-size: clamp(2rem, 8.7vw, 2.45rem);
  }

  .title-copy::after { width: 13rem; margin-bottom: .65rem; }
  .visit-prompt { background: rgba(255,251,248,.94); }

  /* 窄屏只保留一张主图；重复的人物卡会把画面和正文同时吃掉。 */
  .opening-aftermath-cast,
  .day-aftermath-reactions,
  .aftermath-observer { display: none; }

  .opening-aftermath-panel,
  .aftermath-panel { max-height: 76%; overflow-y: auto; }

  .dialogue-panel,
  .night-talk-panel {
    top: auto;
    bottom: 2%;
    max-height: 76%;
    transform: none;
  }

  #app :is(
    .crisis-cast,
    .crisis-aftermath-cast,
    .pair-portraits,
    .pair-aftermath-cast,
    .jiaoer-aftermath-cast,
    .invitation-aftermath-cast,
    .council-resolution-cast,
    .public-aftermath-cast,
    .act-aftermath-cast,
    .final-aftermath-cast,
    .alliance-assembly-cast,
    .alliance-result-cast,
    .collapse-cast,
    .collapse-result-cast,
    .shared-result-cast,
    .shared-dawn-result-cast
  ) {
    top: 1.5%;
    bottom: auto;
    height: 22%;
    padding: .2rem;
  }

  #app :is(
    .crisis-cast,
    .crisis-aftermath-cast,
    .pair-portraits,
    .pair-aftermath-cast,
    .jiaoer-aftermath-cast,
    .invitation-aftermath-cast,
    .council-resolution-cast,
    .public-aftermath-cast,
    .act-aftermath-cast,
    .final-aftermath-cast,
    .alliance-assembly-cast,
    .alliance-result-cast,
    .collapse-cast,
    .collapse-result-cast,
    .shared-result-cast,
    .shared-dawn-result-cast
  ) figcaption :is(p, small, em) { display: none; }

  #app .scene-scrim {
    background: linear-gradient(0deg, rgba(246,242,246,.96), rgba(246,242,246,.16) 74%);
  }

  .close-cg::after,
  .morning-cg::after {
    background: linear-gradient(0deg, rgba(243,240,245,.98) 0%, rgba(243,240,245,.83) 47%, rgba(243,240,245,.05) 78%);
  }

  .fate-coda-art::after {
    background: linear-gradient(0deg, rgba(240,244,248,.99) 0%, rgba(240,244,248,.9) 62%, rgba(240,244,248,.06) 91%);
  }

  .fate-coda-copy {
    background: linear-gradient(0deg, rgba(248,250,252,.995), rgba(248,250,252,.91) 78%, transparent);
  }

  .ending-art { opacity: .76; }
  .ending-copy {
    background: linear-gradient(0deg, rgba(250, 247, 245, .995) 0%, rgba(250, 247, 245, .95) 64%, rgba(250, 247, 245, .88) 100%);
  }

  .epilogue-art::after { background: linear-gradient(0deg, rgba(244, 239, 240, .94), transparent 62%); }
}

@media (prefers-reduced-motion: reduce) {
  .title-art,
  .door-card img,
  .night-talk-cg,
  .close-portrait,
  .scene-view > img {
    transition: none !important;
    animation: none !important;
  }
}