html.raffle-page-active{overflow:hidden}
.photo-mural-dialog.raffle-is-active{position:fixed;inset:0;width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;overflow:hidden;background:#24171e}
.photo-mural-dialog.raffle-is-active>:not(.raffle-screen){visibility:hidden!important;pointer-events:none!important}
.raffle-screen{position:absolute;inset:0;z-index:200;isolation:isolate;overflow:auto;display:grid;place-items:center;min-height:100%;padding:clamp(24px,5vh,66px) clamp(20px,5vw,90px);color:#fff8ee;background:radial-gradient(ellipse at 50% 10%,#85445588,transparent 60%),linear-gradient(135deg,#24171e,#4e2637 55%,#24171e);text-align:center}
.raffle-screen[data-pool="bride"]{--raffle-burst-accent:#ffb5cf;--raffle-celebration-glow:#f2a1bf77;background:radial-gradient(ellipse at 50% 10%,#cc4b7055,transparent 65%),linear-gradient(135deg,#641329,#962b4b 55%,#641329)}
.raffle-screen[data-pool="groom"]{--raffle-burst-accent:#a7d4ff;--raffle-celebration-glow:#77b8ff77;background:radial-gradient(ellipse at 50% 10%,#3b80d055,transparent 65%),linear-gradient(135deg,#05295c,#104b95 55%,#05295c)}
.raffle-screen[data-pool="groom"] .raffle-lead,.raffle-screen[data-pool="groom"] .raffle-time{color:#e4efff}
.raffle-screen[data-pool="groom"] .raffle-exit{background:#05234dcc}
.raffle-screen::before{content:'';position:absolute;inset:18px;border:1px solid #dabd8955;pointer-events:none;border-radius:12px;z-index:-1}
.raffle-content{position:relative;z-index:1;width:min(1080px,100%);margin:auto}
.raffle-brand{margin:0 0 15px;font:clamp(20px,3vw,34px) Georgia,serif;letter-spacing:.03em}.raffle-brand em{color:#e8cba1}
.raffle-group{display:inline-block;margin:0 0 20px;padding:8px 20px;border:1px solid #d9b88688;border-radius:30px;color:#efd6b3;font:clamp(12px,1.4vw,17px) Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.raffle-screen h2{margin:10px auto 20px;max-width:1000px;color:#fff8ee;font-size:clamp(34px,5.8vw,82px);font-weight:400;line-height:1.1;letter-spacing:-.035em;text-wrap:balance}
.raffle-lead{max-width:800px;margin:0 auto 20px;font-size:clamp(17px,2.3vw,28px);line-height:1.45;color:#eedde2}
.raffle-footnote{margin:22px 0 0;color:#e3c69e;font-size:clamp(15px,1.8vw,22px)}
.raffle-exit{position:absolute;z-index:3;top:max(22px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right));width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid #e6c7b077;border-radius:50%;background:#291b26cc;color:#fff8ee;cursor:pointer;font:28px Arial,sans-serif}
.raffle-exit:focus-visible{outline:3px solid #efd6b3;outline-offset:4px}
.raffle-beacon{width:clamp(68px,12vh,130px);margin:2px auto 22px;filter:drop-shadow(0 0 16px #d08d9b66)}
.raffle-beacon svg{display:block;width:100%;stroke:#edbac5;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.raffle-beacon-glow{stroke:#fff8ee;animation:raffle-beacon-sweep 3s ease-in-out infinite}
.raffle-lights{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.raffle-light{position:absolute;z-index:0;pointer-events:none;top:-30%;height:150%;width:45%;opacity:.4;transform-origin:top center;background:linear-gradient(90deg,transparent,#c86e8655,transparent);will-change:transform}
.raffle-light-left{left:0;animation:raffle-light-sweep 7s ease-in-out infinite}.raffle-light-right{right:0;animation:raffle-light-sweep 7s ease-in-out -3.5s infinite reverse}
.raffle-screen[data-phase="drawing"] .raffle-light{opacity:.2}.raffle-screen[data-phase="result"] .raffle-light{background:linear-gradient(90deg,transparent,#e1bb7255,transparent)}
.raffle-screen[data-pool="groom"][data-phase="drawing"] .raffle-light{background:linear-gradient(90deg,transparent,#6cafff88,transparent)}
.raffle-screen[data-pool="bride"][data-phase="drawing"] .raffle-light{background:linear-gradient(90deg,transparent,#f082ab88,transparent)}
.raffle-number-wrap{display:flex;flex-direction:column;align-items:center;margin:12px auto 20px}
.raffle-number-label{font:clamp(12px,1.6vw,20px) Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#e3c69e}
.raffle-number{display:block;min-width:5ch;margin:8px 0 0;font:700 clamp(92px,20vh,230px)/1 Arial,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.04em;color:#fff8ee;text-shadow:0 5px 30px #10091066}
.raffle-screen[data-phase="result"] .raffle-number{color:#ffe3a9;text-shadow:0 3px 8px #170c14,0 0 28px #efbd6580;will-change:transform;animation:raffle-winner-arrive .85s ease-out both,raffle-winner-pulse 1.8s ease-in-out .85s infinite}
.raffle-progress-wrap{max-width:520px;margin:16px auto 0}.raffle-progress{height:6px;border-radius:5px;background:#f1d4db22;overflow:hidden}.raffle-progress span{display:block;width:0;height:100%;border-radius:inherit;background:#e3c69e;transition:width 1s linear}.raffle-time{font:16px Arial,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:#efdae0}
.raffle-network{font:14px/1.5 Arial,sans-serif;color:#ffdca5;max-width:620px;margin:16px auto 0}.raffle-network:empty{display:none}
@keyframes raffle-light-sweep{0%,100%{transform:rotate(-25deg)}50%{transform:rotate(25deg)}}
@keyframes raffle-beacon-sweep{0%,100%{opacity:.45;transform:translateX(-3px)}50%{opacity:1;transform:translateX(7px)}}
@keyframes raffle-winner-arrive{from{transform:translateY(12px) scale(.86);opacity:.3}to{transform:none;opacity:1}}
@keyframes raffle-winner-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@media(max-width:600px){.raffle-screen{padding:68px 24px 35px}.raffle-screen::before{inset:12px}.raffle-brand{font-size:22px}.raffle-group{font-size:11px;letter-spacing:.07em;padding:8px 13px}.raffle-screen h2{font-size:clamp(32px,9vw,50px)}.raffle-number{min-width:4ch;font-size:clamp(82px,24vw,130px)}.raffle-lead{font-size:18px}.raffle-footnote{font-size:16px}.raffle-exit{top:18px;right:18px}}
@media(max-height:600px) and (min-width:601px){.raffle-screen{padding:20px 60px}.raffle-brand{font-size:20px;margin-bottom:7px}.raffle-group{margin-bottom:8px;padding:5px 15px;font-size:11px}.raffle-screen h2{font-size:clamp(30px,7vh,44px);margin:6px auto 10px}.raffle-beacon{width:64px;margin:0 auto 10px}.raffle-lead{font-size:17px;margin-bottom:8px}.raffle-number-wrap{margin:5px auto}.raffle-number{font-size:25vh}.raffle-progress-wrap{margin:8px auto 0}.raffle-footnote{font-size:14px;margin-top:10px}.raffle-time{margin:7px 0}}
@media(prefers-reduced-motion:reduce){.raffle-light,.raffle-beacon-glow,.raffle-screen[data-phase="result"] .raffle-number{animation:none}.raffle-progress span{transition:none}}

/* Full rotations make the red and blue beams read as a turning light bar. */
.raffle-screen[data-phase="announcing"] .raffle-beacon{
  width:clamp(180px,30vw,340px);max-width:50vh;margin:4px auto 16px;filter:none;
}
.raffle-screen[data-phase="announcing"] .raffle-light{
  width:110vmax;height:110vmax;max-width:1500px;max-height:1500px;
  top:50%;left:50%;right:auto;transform-origin:center;opacity:.6;
  animation:raffle-police-orbit 7.2s linear infinite;
}
.raffle-screen[data-phase="announcing"] .raffle-light-left{
  background:linear-gradient(30deg,transparent 45%,#fa394d77 50%,transparent 65%);
  background:conic-gradient(from 0deg,transparent 0deg 15deg,#fa394d88 42deg,transparent 83deg 360deg);
}
.raffle-screen[data-phase="announcing"] .raffle-light-right{
  background:linear-gradient(30deg,transparent 45%,#397cff88 50%,transparent 65%);
  background:conic-gradient(from 180deg,transparent 0deg 15deg,#397cff99 42deg,transparent 83deg 360deg);
}
.raffle-beacon-red,.raffle-beacon-blue,.raffle-beacon-ray-red,.raffle-beacon-ray-blue{
  animation:raffle-lightbar-glow 2.8s ease-in-out infinite;
}
.raffle-beacon-blue,.raffle-beacon-ray-blue{animation-delay:-1.4s}
.raffle-beacon-ray-red,.raffle-beacon-ray-blue{transform-box:fill-box;transform-origin:center}
.raffle-beacon-rotor{transform-box:view-box;animation:raffle-beacon-rotate 2.8s linear infinite;will-change:transform}
.raffle-beacon-rotor-red{transform-origin:73px 61px}
.raffle-beacon-rotor-blue{transform-origin:167px 61px;animation-delay:-1.4s}
@keyframes raffle-police-orbit{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@keyframes raffle-beacon-rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes raffle-lightbar-glow{
  0%,100%{opacity:.3}
  25%,40%{opacity:1}
  65%,80%{opacity:.35}
}
@media(max-height:600px) and (min-width:601px){
  .raffle-screen[data-phase="announcing"] .raffle-beacon{max-width:30vh;margin:0 auto 6px}
}
@media(prefers-reduced-motion:reduce){
  .raffle-screen[data-phase="announcing"] .raffle-light,
  .raffle-beacon-red,.raffle-beacon-blue,.raffle-beacon-ray-red,.raffle-beacon-ray-blue,.raffle-beacon-rotor{
    animation:none;opacity:.7;
  }
  .raffle-screen[data-phase="announcing"] .raffle-light{transform:translate(-50%,-50%)}
}

/* The keepsake remains prominent beside its group through every phase. */
.raffle-identity{--raffle-emblem-size:clamp(200px,25vh,280px);display:flex;justify-content:center;align-items:center;gap:28px;min-height:var(--raffle-emblem-size);margin:0 auto 12px}
.raffle-identity .raffle-group{min-width:0;margin:0;padding:10px 22px;font-size:clamp(13px,1.5vw,19px);line-height:1.4}
.raffle-emblem{display:flex;align-items:center;justify-content:center;flex:0 0 var(--raffle-emblem-size);height:var(--raffle-emblem-size);pointer-events:none}
.raffle-emblem svg{display:none;overflow:visible;max-width:100%;max-height:100%;width:var(--raffle-emblem-size);height:var(--raffle-emblem-size)}
.raffle-screen[data-pool="bride"] .raffle-emblem-bride{display:block;animation:raffle-shoe-dance 3.6s ease-in-out infinite;transform-origin:52% 80%}
.raffle-screen[data-pool="groom"] .raffle-emblem-groom{display:block;animation:raffle-tie-sway 3.8s ease-in-out infinite;transform-origin:50% 12%}
.raffle-emblem-spark{animation:raffle-keepsake-spark 3.2s ease-in-out infinite}
@keyframes raffle-shoe-dance{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-5px) rotate(5deg)}}
@keyframes raffle-tie-sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes raffle-keepsake-spark{0%,100%{opacity:.35}50%{opacity:1}}
@media(max-width:600px){
  .raffle-identity{--raffle-emblem-size:clamp(132px,37vw,160px);gap:14px;margin-bottom:10px}
  .raffle-identity .raffle-group{padding:9px 12px;font-size:12px;letter-spacing:.05em}
}
@media(max-height:600px) and (min-width:601px){
  .raffle-identity{--raffle-emblem-size:110px;gap:18px;margin-bottom:6px}
  .raffle-identity .raffle-group{padding:7px 16px;font-size:12px}
  .raffle-content{padding-left:140px}
  .raffle-identity{min-height:0}
  .raffle-emblem{position:absolute;left:0;top:50%;width:var(--raffle-emblem-size);transform:translateY(-50%)}
}
@media(min-height:601px) and (max-height:800px) and (min-width:601px){
  .raffle-screen{padding-top:24px;padding-bottom:24px}
  .raffle-screen:not([data-phase="announcing"]) h2{font-size:clamp(34px,6vh,48px);margin:6px auto 12px}
  .raffle-screen:not([data-phase="announcing"]) .raffle-lead{margin-bottom:12px}
  .raffle-screen:not([data-phase="announcing"]) .raffle-number-wrap{margin:8px auto 12px}
}
@media(prefers-reduced-motion:reduce){
  .raffle-screen[data-pool] .raffle-emblem svg,.raffle-emblem-spark{animation:none}
}

/* A golden winner plaque keeps the result clear amid the celebration. */
.raffle-screen[data-phase="result"] .raffle-footnote{margin-top:14px;text-shadow:0 2px 4px #1b1026}
.raffle-screen[data-phase="result"] .raffle-number-wrap{
  position:relative;isolation:isolate;width:min(720px,94%);max-width:100%;
  margin:20px auto 26px;padding:18px 32px 24px;border:2px solid #f8d58a;border-radius:28px;
  background:radial-gradient(ellipse at 50% 0%,#80582088,transparent 75%),linear-gradient(145deg,#251b2bf2,#180f24ed);
  box-shadow:0 0 0 5px #ffd98a20,inset 0 0 0 5px #ffd98a18,0 12px 35px #09081055;
}
.raffle-screen[data-phase="result"] .raffle-number-wrap::before{
  content:'';position:absolute;inset:-12px;z-index:-1;border:3px solid #ffe9b9;border-radius:38px;
  box-shadow:0 0 28px 5px #ffce5a66,inset 0 0 18px #ffce5a44;pointer-events:none;
  animation:raffle-prize-halo 2.8s ease-in-out infinite;
}
.raffle-screen[data-phase="result"] .raffle-number-label{color:#ffe4a5;font-weight:700;letter-spacing:.22em}
.raffle-screen[data-phase="result"] .raffle-number-label::before{content:'✦ ';color:#fff5ce}
.raffle-screen[data-phase="result"] .raffle-number-label::after{content:' ✦';color:#fff5ce}
.raffle-screen[data-phase="result"] .raffle-number{
  min-width:0;max-width:100%;margin-top:10px;font-size:clamp(110px,25vh,300px);font-weight:900;
  color:#fff0bd;letter-spacing:.01em;-webkit-text-stroke:1px #ffdc83;
  text-shadow:0 2px 0 #eab75e,0 4px 0 #bc7b2c,0 7px 0 #77441d,0 10px 18px #07030b,0 0 32px #ffd46d99;
  animation:raffle-prize-arrive 1s cubic-bezier(.18,.8,.25,1) both,raffle-prize-pulse 2.2s ease-in-out 1s infinite;
}
@keyframes raffle-prize-arrive{
  0%{transform:translateY(22px) scale(.55);opacity:0}
  65%{transform:translateY(0) scale(1.12);opacity:1}
  100%{transform:scale(1);opacity:1}
}
@keyframes raffle-prize-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
@keyframes raffle-prize-halo{0%,100%{opacity:.3}50%{opacity:1}}
@media(max-width:600px){
  .raffle-screen[data-phase="result"] .raffle-number-wrap{width:94%;margin:18px auto 22px;padding:17px 12px 23px;border-radius:22px}
  .raffle-screen[data-phase="result"] .raffle-number-wrap::before{inset:-8px;border-radius:30px}
  .raffle-screen[data-phase="result"] .raffle-number{font-size:clamp(92px,27vw,155px)}
  .raffle-screen[data-phase="result"] .raffle-number-label{font-size:12px;letter-spacing:.15em}
}
@media(max-height:600px) and (min-width:601px){
  .raffle-screen[data-phase="result"] .raffle-number-wrap{width:min(540px,94%);margin:14px auto 18px;padding:10px 24px 16px}
  .raffle-screen[data-phase="result"] .raffle-number{font-size:26vh}
  .raffle-screen[data-phase="result"] .raffle-number-wrap::before{inset:-7px}
}
@media(min-height:601px) and (max-height:800px) and (min-width:601px){
  .raffle-screen[data-phase="result"] .raffle-number-wrap{padding:12px 24px 20px;margin:12px auto 18px}
  .raffle-screen[data-phase="result"] .raffle-number{font-size:23vh}
}
@media(prefers-reduced-motion:reduce){
  .raffle-screen[data-phase="result"] .raffle-number,.raffle-screen[data-phase="result"] .raffle-number-wrap::before{animation:none}
}
