.match-consent-overlay {
  position: fixed;
  inset: 0;
  z-index: 470;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: max(18px, env(safe-area-inset-top)) 18px max(18px, env(safe-area-inset-bottom));
  background: radial-gradient(circle at 50% 38%, rgba(246, 111, 49, .18), transparent 48%), rgba(8, 8, 17, .9);
  backdrop-filter: blur(17px);
  animation: matchConsentFade .2s ease-out;
}
.match-consent-card {
  position: relative;
  width: min(390px, 100%);
  box-sizing: border-box;
  overflow: hidden;
  padding: 26px 23px 21px;
  border: 1px solid rgba(255, 205, 139, .25);
  border-radius: 28px;
  background: linear-gradient(165deg, rgba(45, 22, 17, .98), rgba(17, 13, 24, .99));
  color: #ffedcf;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .55), inset 0 1px rgba(255, 255, 255, .05);
  text-align: center;
  animation: matchConsentCard .3s cubic-bezier(.2, .9, .25, 1);
}
.match-consent-kicker { color: #efa96a; font: 900 10px/1 Nunito, sans-serif; letter-spacing: .15em; text-transform: uppercase; }
.match-consent-opponent { width: 92px; height: 92px; display: grid; place-items: center; margin: 15px auto 10px; border: 1px solid rgba(255, 191, 112, .24); border-radius: 31px; background: radial-gradient(circle, rgba(255, 171, 74, .2), rgba(255, 103, 55, .04)); box-shadow: 0 0 38px rgba(255, 123, 61, .14); }
.match-consent-opponent span { font-size: 51px; }
.match-consent-card h2 { margin: 5px 0 10px; font: 900 25px/1.15 Nunito, sans-serif; }
.match-consent-card p { margin: 0 auto 18px; color: rgba(255, 235, 207, .66); font: 700 14px/1.5 Nunito, sans-serif; }
.match-consent-card button { width: 100%; min-height: 50px; border-radius: 15px; font: 900 14px Nunito, sans-serif; cursor: pointer; }
.match-consent-accept { border: 1px solid rgba(255, 213, 153, .36); background: linear-gradient(135deg, #f18a37, #d95c32); color: white; box-shadow: 0 9px 25px rgba(218, 83, 42, .25); }
.match-consent-decline { margin-top: 8px; border: 1px solid rgba(255, 222, 181, .15); background: rgba(255, 255, 255, .04); color: #e9cba4; }
.match-consent-card small { display: block; margin-top: 15px; color: rgba(255, 227, 191, .42); font: 700 10px/1.4 Nunito, sans-serif; }
.match-consent-sparks i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #ffbd66; box-shadow: 0 0 12px #f76f33; animation: matchConsentSpark 2.1s ease-in-out infinite; }
.match-consent-sparks i:nth-child(1) { top: 17%; left: 17%; }
.match-consent-sparks i:nth-child(2) { top: 25%; right: 16%; animation-delay: -.7s; }
.match-consent-sparks i:nth-child(3) { top: 11%; right: 34%; animation-delay: -1.35s; }
@keyframes matchConsentFade { from { opacity: 0; } }
@keyframes matchConsentCard { from { opacity: 0; transform: translateY(25px) scale(.97); } }
@keyframes matchConsentSpark { 0%, 100% { opacity: .2; transform: translateY(5px) scale(.7); } 50% { opacity: 1; transform: translateY(-7px) scale(1.25); } }
@media (max-width: 340px) { .match-consent-card { padding: 20px 17px 17px; } .match-consent-opponent { width: 76px; height: 76px; } .match-consent-opponent span { font-size: 43px; } }
@media (prefers-reduced-motion: reduce) { .match-consent-overlay, .match-consent-card, .match-consent-sparks i { animation: none; } }