.finish-card {
  flex: 0 0 auto;
  width: min(100%, 640px);
  min-height: min(61dvh, 520px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: clamp(14px, 3dvh, 30px) 14px;
  border-radius: clamp(24px, 6vw, 42px);
  background: #fbf6eafa;
  color: #364832;
}
.finish-card .badge { background: #dfe5c9; color: #344333; font-size: 12px; border-radius: 99px; padding: 5px 14px; }
.finish-art { width: min(78%, clamp(116px, 31dvh, 232px)); height: auto; overflow: visible; margin: clamp(3px, 1.4dvh, 14px) 0 0; }
.finish-card h1 { margin: 0; font: 500 clamp(35px, min(11.8vw, 7.7dvh), 62px)/1.04 Georgia, serif; letter-spacing: -.045em; }
.finish-card h1:focus { outline: none; }
.finish-card .finish-sub { margin: clamp(6px, 1.8dvh, 18px) 0 0; font: 400 clamp(20px, min(5.6vw, 3.8dvh), 31px)/1.14 Georgia, serif; letter-spacing: -.025em; }
.finish-card .finish-note { margin: clamp(16px, 6dvh, 54px) 0 0; font: 400 clamp(13px, 1.8dvh, 16px)/1.5 system-ui, sans-serif; }
@media (prefers-reduced-motion: no-preference) {
  .finish-sparkle .gold-ray { transform-box: fill-box; transform-origin: center; animation: gold-ray-glint 820ms ease-in-out both; }
  .finish-sparkle .gold-ray:nth-child(2) { animation-delay: 100ms; }
  .finish-sparkle .gold-ray:nth-child(3) { animation-delay: 200ms; }
  @keyframes gold-ray-glint {
    0%, 100% { opacity: 1; transform: scale(1); }
    28% { opacity: .55; transform: scale(.91); }
    63% { stroke: #ffdc76; transform: scale(1.14); }
  }
}
@media (max-height: 540px) {
  .finish-card { min-height: 0; padding-block: 9px; }
  .finish-art { width: min(115px, 22dvh); margin-top: 0; }
  .finish-card .finish-note { margin-top: 8px; }
}