/* Closing sequence: a full-screen scrim and three successive tabletop panels. */
#ri-ending-overlay {
  position: fixed;
  inset: 0;
  width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; border: 0;
  z-index: 11000;
  display: grid;
  place-items: center;
  padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  background: rgba(28, 27, 24, .7);
  color: #1c1b18;
  font-family: Body, Arial, sans-serif;
}
#ri-ending-overlay:not([open]) { display: none; }
#ri-ending-overlay::backdrop { background: transparent; }
#ri-ending-overlay .ri-ending-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: min(520px, 100%);
  max-height: 100%;
  overflow: auto;
  overscroll-behavior: contain;
  padding: clamp(22px, 4vw, 38px);
  border: 4px solid #1c1b18;
  border-radius: 22px 26px 19px 24px;
  background: #fffdf4;
  box-shadow: 7px 8px 0 #1c1b18;
  text-align: center;
  scrollbar-color: #8b7457 #f7eed9;
}
#ri-ending-overlay .ri-ending-summary { background: #f7dc78; }
#ri-ending-overlay .ri-ending-title {
  margin: 0;
  font: 700 clamp(27px, 5vw, 42px)/1.05 Display, Body, sans-serif;
  letter-spacing: -.035em;
}
#ri-ending-overlay .ri-ending-amount {
  display: block;
  margin: 0;
  font: 700 clamp(64px, 12vw, 112px)/1 Display, Body, sans-serif;
  letter-spacing: -.055em;
  overflow-wrap: anywhere;
}
#ri-ending-overlay .ri-ending-copy {
  margin: 0;
  max-width: 32ch;
  font: 500 clamp(16px, 2.4vw, 20px)/1.4 Body, Arial, sans-serif;
}
#ri-ending-overlay .ri-ending-gift-art {
  display: block;
  width: min(240px, 65vw);
  max-width: 100%;
  max-height: min(43dvh, 340px);
  height: auto;
  object-fit: contain;
  border: 3px solid #1c1b18;
  border-radius: 8px 11px 7px 9px;
  background: #f5ecd5;
  box-shadow: 4px 5px 0 #1c1b18;
  animation: ri-ending-gift-fly-in .65s cubic-bezier(.18,.8,.24,1) both;
}
#ri-ending-overlay .ri-ending-gift-name {
  margin: 0;
  font: 700 clamp(23px, 4vw, 34px)/1.1 Display, Body, sans-serif;
  letter-spacing: -.025em;
}
#ri-ending-overlay .ri-ending-handmade {
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;
  aspect-ratio: 5/7; padding: 20px; background:#fff9e9;color:#1c1b18;
  font:700 22px/1.2 Body,Arial,sans-serif;
}
#ri-ending-overlay .ri-ending-handmade b { color:#cb4265;font-size:60px; }
#ri-ending-overlay .ri-ending-action-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(100%, 340px);
}
#ri-ending-overlay .ri-ending-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 165px;
  min-height: 50px;
  max-width: 100%;
  margin: 3px 0 0;
  padding: 10px 22px;
  border: 3px solid #1c1b18;
  border-radius: 999px;
  background: #f8dc73;
  color: #1c1b18;
  box-shadow: none;
  font: 500 17px/1.2 Body, Arial, sans-serif;
  text-align: center;
  white-space: normal;
}
#ri-ending-overlay .ri-ending-action-list .ri-ending-button { width: 100%; margin: 0; }
#ri-ending-overlay .ri-ending-button:hover:not(:disabled) { background: #ffe78a; }
#ri-ending-overlay .ri-ending-button:active:not(:disabled) { transform: translateY(2px); box-shadow: none; }
#ri-ending-overlay .ri-ending-button:focus-visible { outline: 3px solid #75466c; outline-offset: 4px; }
#ri-ending-overlay .ri-ending-button:disabled { opacity: .55; box-shadow: none; }
#ri-ending-overlay .ri-ending-button svg { width: 20px; height: 20px; flex: none; }
@keyframes ri-ending-gift-fly-in {
  from { opacity: 0; transform: translate(15vw, -16vh) rotate(12deg) scale(.7); }
  70% { opacity: 1; transform: translate(0, 2px) rotate(-2deg) scale(1.03); }
  to { opacity: 1; transform: translate(0, 0) rotate(0) scale(1); }
}
@media (max-width: 480px), (max-height: 650px) {
  #ri-ending-overlay .ri-ending-panel { gap: 10px; padding: 20px; }
  #ri-ending-overlay .ri-ending-gift-art { width: min(190px, 58vw); max-height: 38dvh; }
  #ri-ending-overlay .ri-ending-button { min-height: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  #ri-ending-overlay .ri-ending-gift-art { animation: none; }
}