:root {
  --v14-gold:#e7be6b;
  --v14-cream:#fff8e9;
  --v14-red:#aa4b45;
  --v14-ink:#12373c;
  --v14-ease:cubic-bezier(.2,.78,.2,1);
}

/* The relationship gap becomes the visual climax, not another paragraph. */
.relation-conclusion {
  width:100%; min-height:104px; margin-top:8px; padding:11px 14px 12px;
  display:grid; align-content:center; border:1px solid rgba(231,190,107,.36); border-left:4px solid var(--v14-gold); border-radius:4px 16px 16px 4px;
  background:linear-gradient(110deg,rgba(8,39,44,.94),rgba(8,39,44,.68)); box-shadow:0 15px 35px rgba(1,20,24,.22);
}
.relation-conclusion small { margin-bottom:5px; font-size:11px; letter-spacing:.04em; }
.relation-equation { display:flex; align-items:center; gap:9px; color:var(--v14-cream); white-space:nowrap; }
.relation-equation b { font-family:"STSong","Songti SC",serif; font-size:25px; line-height:1; letter-spacing:.02em; }
.relation-equation i { color:var(--v14-gold); font:700 20px/1 "Times New Roman",serif; opacity:.9; }
.relation-conclusion > strong { display:block; margin-top:7px; color:rgba(255,248,233,.76); font-size:15px; line-height:1.45; }
.relation-conclusion.is-visible .relation-equation b,.relation-conclusion.is-visible .relation-equation i,.relation-conclusion.is-visible > strong { animation:v14EquationIn .48s var(--v14-ease) both; }
.relation-conclusion.is-visible .relation-equation i:nth-of-type(1) { animation-delay:.11s; }
.relation-conclusion.is-visible .relation-equation b:nth-of-type(2) { animation-delay:.2s; }
.relation-conclusion.is-visible .relation-equation i:nth-of-type(2) { animation-delay:.29s; }
.relation-conclusion.is-visible .relation-equation b:nth-of-type(3) { animation-delay:.38s; }
.relation-conclusion.is-visible > strong { animation-delay:.48s; }

/* The purchase conclusion visibly replaces the wrong question with the useful one. */
.risk-conclusion {
  width:100%; min-height:112px; margin-top:8px; padding:10px 13px 11px;
  display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"label label" "old new"; align-items:center; gap:5px 12px;
  border:1px solid rgba(231,190,107,.34); border-left:4px solid var(--v14-gold); border-radius:4px 15px 15px 4px;
  background:linear-gradient(105deg,rgba(7,38,43,.95),rgba(7,38,43,.7)); box-shadow:0 14px 34px rgba(1,20,24,.22);
}
.risk-conclusion small { grid-area:label; margin:0; font-size:11px; letter-spacing:.04em; }
.risk-question-shift { grid-area:old; align-self:stretch; display:grid; align-content:center; justify-items:start; gap:5px; }
.risk-question-shift del { color:rgba(255,255,255,.5); font-size:13px; line-height:1.25; text-decoration-color:var(--v14-red); text-decoration-thickness:2px; }
.risk-question-shift i { padding:3px 7px; border:1px solid rgba(231,190,107,.34); border-radius:999px; color:var(--v14-gold); font-size:9px; font-style:normal; font-weight:800; }
.risk-conclusion > strong { grid-area:new; display:block; color:var(--v14-cream); font-family:"STSong","Songti SC",serif; font-size:20px; line-height:1.33; text-align:left; }
.risk-conclusion > strong u { color:#fff; text-decoration-color:var(--v14-gold); text-decoration-thickness:4px; text-underline-offset:4px; }
.risk-conclusion.is-visible .risk-question-shift { animation:v14OldQuestion .56s var(--v14-ease) both; }
.risk-conclusion.is-visible > strong { animation:v14RealQuestion .6s .2s var(--v14-ease) both; }

/* Each evidence card reads like a reveal: observation first, missing proof second. */
.replay-screen { grid-template-rows:auto 66px minmax(292px,356px) 58px; }
.evidence-focus { padding:14px; grid-template-rows:auto minmax(100px,1fr) 29px minmax(112px,1fr); gap:7px; }
.evidence-focus-number { font-size:11px; font-weight:800; letter-spacing:.08em; }
.evidence-side { position:relative; padding:15px 16px; align-content:center; justify-content:stretch; border-radius:11px; overflow:hidden; }
.evidence-side::before { content:""; position:absolute; left:0; top:15px; bottom:15px; width:4px; border-radius:0 4px 4px 0; background:var(--v14-gold); }
.evidence-side small { margin-bottom:7px; color:#6e7e80; font-size:12px; font-weight:700; }
.evidence-side p { color:var(--v14-ink); font-size:18px; line-height:1.55; letter-spacing:.005em; }
.evidence-side p strong { display:inline; color:#0a3036; font-size:22px; line-height:1.38; font-weight:800; }
.evidence-missing { border-color:rgba(170,75,69,.2); background:linear-gradient(115deg,#f5f1e9,#edf2ed); }
.evidence-missing::before { background:var(--v14-red); }
.evidence-missing p strong { color:#852f2e; }
.evidence-divider b { color:#a2403b; font-size:12px; letter-spacing:.08em; }
.evidence-seen { animation:v14EvidenceSeen .48s var(--v14-ease) both; }
.evidence-divider { animation:v14EvidenceDivider .28s .34s ease both; }
.evidence-missing { animation:v14EvidenceMissing .54s .52s var(--v14-ease) both; }

@keyframes v14EquationIn { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:none; } }
@keyframes v14OldQuestion { from { opacity:0; transform:translateX(-8px); } to { opacity:1; transform:none; } }
@keyframes v14RealQuestion { from { opacity:0; transform:translateX(12px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes v14EvidenceSeen { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@keyframes v14EvidenceDivider { from { opacity:0; } to { opacity:1; } }
@keyframes v14EvidenceMissing { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }

@media (max-height:740px) {
  .agreement-choice-screen[data-relation-sequence] { grid-template-rows:40px auto minmax(184px,1fr) 184px; }
  .relation-chain { grid-template-rows:auto 6px auto 6px auto minmax(54px,1fr); }
  .relation-node { min-height:38px; padding-top:4px; padding-bottom:4px; }
  .relation-link { height:6px; }
  .relation-conclusion { min-height:54px; margin-top:4px; padding:6px 9px 7px; grid-template-columns:auto 1fr; grid-template-areas:"label equation" "statement statement"; column-gap:9px; }
  .relation-conclusion small { grid-area:label; align-self:center; margin:0; font-size:8px; }
  .relation-equation { grid-area:equation; gap:6px; }
  .relation-equation b { font-size:18px; }
  .relation-equation i { font-size:15px; }
  .relation-conclusion > strong { grid-area:statement; margin-top:3px; font-size:11px; line-height:1.3; }

  .risk-conclusion { min-height:72px; margin-top:4px; padding:6px 9px 7px; gap:3px 8px; }
  .risk-conclusion small { font-size:8px; }
  .risk-question-shift { gap:3px; }
  .risk-question-shift del { font-size:10px; }
  .risk-question-shift i { padding:2px 5px; font-size:7px; }
  .risk-conclusion > strong { font-size:16px; line-height:1.25; }

  .replay-screen { grid-template-rows:auto 56px minmax(250px,292px) 54px; }
  .evidence-focus { padding:10px; grid-template-rows:auto minmax(83px,1fr) 24px minmax(93px,1fr); gap:5px; }
  .evidence-side { padding:11px 13px; }
  .evidence-side::before { top:11px; bottom:11px; width:3px; }
  .evidence-side small { margin-bottom:4px; font-size:10px; }
  .evidence-side p { font-size:16px; line-height:1.46; }
  .evidence-side p strong { font-size:18px; line-height:1.36; }
}

@media (max-width:370px) {
  .relation-equation { gap:5px; }
  .relation-equation b { font-size:17px; }
  .risk-conclusion > strong { font-size:15px; }
  .evidence-side p { font-size:15px; }
  .evidence-side p strong { font-size:17px; }
}

@media (prefers-reduced-motion:reduce) {
  .relation-conclusion.is-visible .relation-equation b,.relation-conclusion.is-visible .relation-equation i,.relation-conclusion.is-visible > strong,
  .risk-conclusion.is-visible .risk-question-shift,.risk-conclusion.is-visible > strong,
  .evidence-seen,.evidence-divider,.evidence-missing { animation:none!important; }
}