:root {
  --doorlet-ink: #2d1b33;
  --doorlet-muted: #736779;
  --doorlet-purple: #3d174f;
  --doorlet-purple-light: #612b73;
  --doorlet-red: #a52d3e;
  --doorlet-gold: #d6a13d;
  --doorlet-cream: #fbf7ef;
}

body.doorlet-modal-open { overflow: hidden; }

.doorlet-overlay {
  --door-origin-x: 50vw;
  --door-origin-y: 50vh;
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex !important;
  width: 100%;
  min-height: 100%;
  padding: clamp(14px, 3vw, 42px);
  overflow: auto;
  align-items: flex-start;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  clip-path: circle(0 at var(--door-origin-x) var(--door-origin-y));
  pointer-events: none;
  background:
    radial-gradient(circle at 16% 10%, rgba(208, 155, 62, .20), transparent 24%),
    radial-gradient(circle at 88% 86%, rgba(139, 45, 62, .20), transparent 26%),
    linear-gradient(145deg, #1d0e26, #3e174d 54%, #27102f);
  transition: clip-path .64s cubic-bezier(.22,.78,.2,1), opacity .22s ease, visibility .64s ease;
}

.doorlet-overlay::before,
.doorlet-overlay::after {
  content: "";
  position: fixed;
  inset: -80px 0 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.85) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(255,255,255,.55) 0 1.5px, transparent 2.2px);
  background-position: 0 0, 42px 65px;
  background-size: 85px 85px, 135px 135px;
  opacity: .34;
  animation: christmas-snow 18s linear infinite;
}

.doorlet-overlay::after {
  opacity: .17;
  filter: blur(.3px);
  transform: scale(1.15);
  animation-duration: 28s;
}

.doorlet-overlay.is-open {
  visibility: visible;
  opacity: 1;
  clip-path: circle(150vmax at var(--door-origin-x) var(--door-origin-y));
  pointer-events: auto;
}

.christmas-glow {
  position: fixed;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(235, 196, 119, .13);
  border-radius: 50%;
  pointer-events: none;
}

.christmas-glow::before,
.christmas-glow::after {
  content: "";
  position: absolute;
  inset: 38px;
  border: inherit;
  border-radius: inherit;
}

.christmas-glow::after { inset: 78px; }
.christmas-glow-one { left: -100px; bottom: -90px; }
.christmas-glow-two { right: -110px; top: -100px; }

.doorlet-modal {
  position: relative;
  z-index: 2;
  width: min(1160px, 100%);
  margin: auto 0;
  overflow: visible;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 28px;
  background: var(--doorlet-cream);
  box-shadow: 0 35px 100px rgba(9, 2, 13, .5);
  opacity: 0;
  transform: perspective(1200px) translateY(28px) scale(.96) rotateX(3deg);
  transform-origin: var(--door-origin-x) var(--door-origin-y);
  transition: transform .52s cubic-bezier(.2,.8,.2,1) .1s, opacity .35s ease .12s;
}

.doorlet-overlay.is-open .doorlet-modal { opacity: 1; transform: perspective(1200px) translateY(0) scale(1) rotateX(0); }

.doorlet-modal-header {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  min-height: 190px;
  padding: 42px 48px 38px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 82% 20%, rgba(224, 177, 79, .19), transparent 24%),
    linear-gradient(130deg, #32123f, #5b2464 64%, #7a273f);
}

.doorlet-modal-header::after {
  content: "✦";
  position: absolute;
  right: 15%;
  bottom: -58px;
  color: rgba(255,255,255,.07);
  font: 180px/1 Georgia, serif;
}

.doorlet-kicker {
  display: block;
  margin-bottom: 10px;
  color: #efc873;
  font: 700 11px/1.2 Montserrat, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.doorlet-modal-header h1 {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #fff;
  font: 600 clamp(38px, 5vw, 62px)/1.05 "Source Serif Pro", Georgia, serif;
}

.doorlet-modal-header h1 span { color: #f2cc78; }
.doorlet-modal-header p { margin: 13px 0 0; color: #dfd1e2; font: 400 15px/1.6 Montserrat, sans-serif; }

.doorlet-close {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  padding: 0;
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 15px;
  background: rgba(255,255,255,.1);
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}

.doorlet-close:hover,
.doorlet-close:focus-visible { background: rgba(255,255,255,.2); transform: scale(1.04); outline: 3px solid rgba(239,200,115,.28); }
.doorlet-close svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

.doorlet-prizes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 26px;
}

.doorlet-prize-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #e7ded0;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(59, 36, 45, .07);
  animation: prize-card-in .45s both;
}

.doorlet-prize-card:nth-child(2) { animation-delay: .06s; }
.doorlet-prize-card:nth-child(3) { animation-delay: .12s; }
.doorlet-prize-card:nth-child(4) { animation-delay: .18s; }
.doorlet-prize-card:nth-child(5) { animation-delay: .24s; }
.doorlet-prize-card:nth-child(6) { animation-delay: .30s; }
.doorlet-prize-card:nth-child(7) { animation-delay: .36s; }

.prize-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 16px 18px;
  color: #fff;
  background: linear-gradient(125deg, var(--doorlet-purple), var(--doorlet-purple-light));
}

.prize-count {
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 99px;
  color: #eaddec;
  font: 700 10px/1 Montserrat, sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ticket-number { display: grid; justify-items: end; }
.ticket-number small { color: #d6c4db; font: 600 9px/1.2 Montserrat, sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.ticket-number strong { margin-top: 4px; color: #f4ce79; font: 700 clamp(22px, 3vw, 31px)/1 Montserrat, sans-serif; letter-spacing: .04em; }
.is-locked .ticket-number strong { font-size: 16px; }

.prize-description { padding: 24px 24px 20px; }
.prize-label { display: block; color: #9a2940; font: 700 9px/1.2 Montserrat, sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.prize-description h2 { margin: 8px 0 0; color: var(--doorlet-ink); font: 600 clamp(20px, 2.3vw, 28px)/1.25 "Source Serif Pro", Georgia, serif; }
.prize-value { display: inline-flex; align-items: center; gap: 12px; margin: 17px 0 0; padding: 10px 13px; color: #6b4b17; border: 1px solid #ead29e; border-radius: 11px; background: linear-gradient(135deg,#fff8e8,#f8e8c4); box-shadow: 0 6px 16px rgba(151,105,30,.08); font-family: Montserrat,sans-serif; }
.prize-value span { font-size: 9px; line-height: 1.25; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.prize-value strong { color: #4a2e08; font-size: 21px; line-height: 1; white-space: nowrap; }

.prize-sponsor {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 17px;
  align-items: center;
  margin-top: auto;
  padding: 19px 24px 22px;
  border-top: 1px solid #eee7dd;
  background: #fdfaf5;
}

.prize-sponsor-logo {
  position: relative;
  display: grid;
  width: 104px;
  height: 82px;
  padding: 9px;
  place-items: center;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #ebe2d5;
  border-radius: 13px;
  background: #fff;
}

.prize-sponsor-logo img { position: absolute; inset: 9px; display: block; width: calc(100% - 18px); height: calc(100% - 18px); max-width: none; max-height: none; padding: 0; object-fit: contain; object-position: center; }
.prize-sponsor-logo>span { color: #7b4b83; font: 700 34px "Source Serif Pro", serif; }
.prize-sponsor-copy { min-width: 0; }
.prize-sponsor-copy h3 { margin: 5px 0 5px; color: var(--doorlet-ink); font: 600 17px/1.25 "Source Serif Pro", Georgia, serif; }
.prize-sponsor-copy p { margin: 0; color: var(--doorlet-muted); font: 400 11px/1.45 Montserrat, sans-serif; }
.sponsor-links { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10px; }
.sponsor-links a { display: inline-flex; gap: 5px; align-items: center; padding: 7px 9px; color: #5c2968; border-radius: 8px; background: #f0e8f1; text-decoration: none; font: 700 9px/1.2 Montserrat, sans-serif; }
.sponsor-links a:hover,
.sponsor-links a:focus-visible { color: #fff; background: #663071; outline: none; }

.doorlet-modal-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  padding: 7px 25px 27px;
  color: #86768a;
  text-align: center;
  font: 500 11px/1.5 Montserrat, sans-serif;
}

.doorlet-modal-footer span { color: var(--doorlet-gold); }

.doorlet-loading,
.doorlet-message {
  grid-column: 1 / -1;
  min-height: 260px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  color: var(--doorlet-muted);
  text-align: center;
}

.doorlet-loading>span {
  width: 40px;
  height: 40px;
  border: 3px solid #eadfeb;
  border-top-color: #6e3479;
  border-radius: 50%;
  animation: doorlet-spin .85s linear infinite;
}

.doorlet-loading strong { font: 600 13px Montserrat, sans-serif; }
.doorlet-message>span { display: grid; width: 52px; height: 52px; place-items: center; color: #fff; border-radius: 16px; background: #a4384a; font: 700 24px serif; }
.doorlet-message h2 { margin: 5px 0 0; color: var(--doorlet-ink); font: 600 25px "Source Serif Pro", serif; }
.doorlet-message p { margin: 0; font: 400 12px Montserrat, sans-serif; }

@keyframes prize-card-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes doorlet-spin { to { transform: rotate(360deg); } }
@keyframes christmas-snow { to { background-position: 22px 170px, 15px 245px; } }

@media (max-width: 820px) {
  .doorlet-overlay { padding: 12px; }
  .doorlet-modal { border-radius: 22px; }
  .doorlet-modal-header { min-height: 165px; padding: 30px 26px; }
  .doorlet-prizes { grid-template-columns: 1fr; padding: 17px; }
}

@media (max-width: 520px) {
  .doorlet-overlay { padding: 0; }
  .doorlet-modal { width: 100%; min-height: 100vh; border: 0; border-radius: 0; }
  .doorlet-modal-header { min-height: 175px; padding: 28px 20px 30px; }
  .doorlet-modal-header h1 { font-size: 39px; }
  .doorlet-modal-header p { max-width: 235px; font-size: 12px; }
  .doorlet-close { width: 46px; height: 46px; flex-basis: 46px; }
  .doorlet-prizes { gap: 13px; padding: 14px; }
  .prize-card-top { padding: 15px; }
  .prize-description { padding: 21px 18px 18px; }
  .prize-description h2 { font-size: 22px; }
  .prize-sponsor { grid-template-columns: 76px minmax(0,1fr); gap: 13px; padding: 16px 18px 19px; }
  .prize-sponsor-logo { width: 76px; height: 68px; }
  .doorlet-modal-footer { padding: 8px 18px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .doorlet-overlay,
  .doorlet-modal,
  .doorlet-prize-card { transition: none; animation: none; }
  .doorlet-overlay::before,
  .doorlet-overlay::after { animation: none; }
  .doorlet-overlay { clip-path: none; }
}