/* Scope every rule to the existing offering wrapper. Load after its legacy styles. */
html body [data-screen="offering"] .onnen-completion-flow {
  max-width: 1040px;
  width: min(100%, 1040px);
  margin-inline: auto;
  text-align: left;
  transition: opacity 220ms ease, transform 220ms ease;
}
html body .onnen-completion-flow.onnen-coda-fading {
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
}
html body .onnen-completion-flow > [hidden],
html body .onnen-completion-flow .onnen-coda-selection[hidden],
html body .onnen-completion-flow .onnen-coda-save[hidden],
html body .onnen-completion-flow .onnen-coda-intro[hidden] { display: none !important; }
.onnen-coda-heading { max-width: 780px; margin: 0 0 30px; }
.onnen-coda-step { color: #ac8e78; font: 500 12px/1.5 system-ui, sans-serif; letter-spacing: .18em; margin: 0 0 14px; }
html body #onnenCompletionHeading { color: #e6d8c3; font: 400 clamp(28px, 4.1vw, 48px)/1.45 Georgia, "Noto Serif CJK JP", serif; text-wrap: balance; margin: 0; letter-spacing: .02em; }
#onnenCompletionHeading:focus { outline: none; }
.onnen-coda-intro, .onnen-coda-freedom { color: #b9ac98; font: 400 16px/1.9 system-ui, sans-serif; max-width: 64ch; margin: 18px 0 0; }
.onnen-coda-save { color: #c7af87; font: 400 13px/1.8 system-ui, sans-serif; margin: 14px 0 0; }
html body .onnen-completion-flow #v25KeepsakePreview { max-width: none; margin: 0; padding: 0; border: 0; background: none; }
html body .onnen-completion-flow #v25KeepsakePreview > :is(.v25-keepsake-kicker,h3,.v25-keepsake-intro,.v25-keepsake-foot,.v97-relic-actions) { display: none !important; }
html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: 26px; margin: 0; align-items: center; }
html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-options { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-option { min-height: 100px; padding: 12px; border-radius: 2px; }
html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-option strong { font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-preview { height: 430px; min-height: 430px; max-height: 430px; }
.onnen-coda-confirm { display: flex; justify-content: flex-end; margin-top: 28px; padding-top: 24px; border-top: 1px solid #7f66543d; }
html body #onnenObjectConfirm { min-height: 52px; max-width: 100%; padding: 15px 26px; white-space: normal; text-align: center; font-size: 16px; line-height: 1.6; }
.onnen-coda-selection { display: flex; align-items: center; gap: 18px; padding: 18px 20px; border: 1px solid #88735950; background: #1514138c; }
.onnen-coda-selection-art { width: 78px; flex: 0 0 78px; height: 90px; display: grid; place-items: center; }
.onnen-coda-selection-art > .onnen-sealed-object { width: 78px; height: 90px; min-height: 0; }
.onnen-coda-selection-label, .onnen-coda-selection-name { display: block; }
.onnen-coda-selection-label { color: #ae9781; font-size: 12px; line-height: 1.7; }
.onnen-coda-selection-name { color: #e1d2ba; font-size: 19px; line-height: 1.7; font-weight: 500; }
html body #onnenChangeObject { margin-left: auto; padding: 12px; min-height: 44px; color: #c8b395; font-size: 14px; white-space: normal; }
html body .onnen-completion-flow #onnenCompletionAfter .offering-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 24px 0 0; background: none; }
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start;
  width: 100%; min-width: 0; min-height: 174px; margin: 0; padding: 24px 20px;
  border: 1px solid #88735961; border-radius: 2px; background: #121211ba; color: #e2d2ba; text-align: left;
}
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice > span { display: none; }
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice > strong { color: #e2d2ba; font: 500 18px/1.65 system-ui, sans-serif; letter-spacing: .02em; margin: 0; white-space: normal; overflow-wrap: anywhere; }
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice > strong {
  display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:12px;width:100%;min-height:58px;
}
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice > strong::before {
  content:'';width:54px;height:58px;background:center/contain no-repeat;
  filter:drop-shadow(0 3px 5px #0008);pointer-events:none;transition:transform .25s ease;
}
#onnenCodaLeaveLabel::before {background-image:url('/assets/coda/quiet-departure.webp')!important}
#onnenCodaMoneyLabel::before {background-image:url('/assets/coda/voluntary-offering.webp')!important}
#onnenCodaWordsLabel::before {background-image:url('/assets/coda/leave-words.webp')!important}
@media(hover:hover){html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice:hover>strong::before{transform:translateY(-2px)}}
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice > .onnen-coda-choice-note { color: #b7a991; font: 400 13px/1.8 system-ui, sans-serif; margin: 12px 0 0; white-space: normal; overflow-wrap: anywhere; }
html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice:hover { background: #231b16d9; border-color: #b59373a1; }
html body .onnen-completion-flow :is(.onnen-coda-choice,#onnenObjectConfirm,#onnenChangeObject):focus-visible { outline: 2px solid #e0bd90; outline-offset: 4px; }
html body .onnen-completion-flow #onnenCompletionAfter .custom-offering { grid-column: 1/-1; min-width: 0; margin-top: 8px; }
html body .onnen-completion-flow #onnenCompletionAfter .custom-offering[hidden] { display: none !important; }
html body .onnen-completion-flow #v70OfferingBoundaries { margin-top: 24px; }
@media (max-width: 760px) {
  html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-preview { grid-row: 1; height: 300px; min-height: 300px; max-height: 300px; }
  html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-preview > .onnen-relic { width: min(100%, 290px); height: 290px; }
  html body .onnen-completion-flow #onnenCompletionAfter .offering-actions { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice { min-height: 0; padding: 22px; }
  .onnen-coda-confirm { justify-content: stretch; }
  html body #onnenObjectConfirm { width: 100%; }
}
@media (max-width: 420px) {
  .onnen-coda-heading { margin-bottom: 22px; }
  html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-option { padding: 9px 7px; grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; gap: 4px; }
  html body .onnen-completion-flow #v25KeepsakePreview .v25-keepsake-option strong { font-size: 13px; }
  .onnen-coda-selection { flex-wrap: wrap; gap: 12px; padding: 14px; }
  html body #onnenChangeObject { margin-left: 0; width: 100%; text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  html body [data-screen="offering"] .onnen-completion-flow { transition: none; transform: none; }
  html body .onnen-completion-flow #onnenCompletionAfter .onnen-coda-choice>strong::before{transition:none;transform:none}
}