#luck-pop-backdrop{
  position:fixed;inset:0;z-index:99980;
  background:rgba(2,6,23,.62);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  opacity:0;pointer-events:none;
  transition:opacity .35s ease;
}
#luck-pop-backdrop.on{opacity:1;pointer-events:auto}
#luck-pop{
  position:fixed;left:50%;top:50%;z-index:99981;
  width:min(380px,calc(100vw - 24px));
  transform:translate(-50%,-50%) scale(.7);
  opacity:0;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% -10%,rgba(251,191,36,.18),transparent 55%),
    radial-gradient(100% 100% at 50% 100%,#0b1220 0%,#020617 70%);
  color:#f8fafc;
  border:1px solid rgba(251,191,36,.45);
  border-radius:28px;
  padding:22px 20px 18px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 0 100px rgba(37,99,235,.22),
    0 40px 110px rgba(2,8,23,.7);
  transition:transform .5s cubic-bezier(.22,1.25,.36,1), opacity .35s ease;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  text-align:center;
}
#luck-pop.on{transform:translate(-50%,-50%) scale(1);opacity:1;pointer-events:auto}
#luck-pop .lk-x{
  position:absolute;top:10px;right:12px;border:0;background:rgba(255,255,255,.08);
  color:#94a3b8;font-size:18px;cursor:pointer;line-height:1;
  width:32px;height:32px;border-radius:50%;
}
#luck-pop .lk-k{
  margin:0;font-size:10px;font-weight:800;letter-spacing:.2em;
  text-transform:uppercase;color:#fbbf24;
}
#luck-pop h3{margin:6px 0 6px;font-size:26px;letter-spacing:-.03em;font-weight:800}
#luck-pop .lk-sub{margin:0 auto 14px;max-width:30ch;font-size:13px;line-height:1.45;color:#94a3b8}
#luck-pop .lk-machine{
  position:relative;
  width:240px;height:240px;
  margin:0 auto 14px;
  filter:drop-shadow(0 16px 28px rgba(0,0,0,.45));
}
#luck-pop .lk-pointer{
  position:absolute;left:50%;top:-8px;z-index:5;
  width:0;height:0;margin-left:-11px;
  border-left:11px solid transparent;
  border-right:11px solid transparent;
  border-top:18px solid #fbbf24;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.5));
}
#luck-pop .lk-ring{
  position:absolute;inset:0;
  border-radius:50%;
  transform:rotate(0deg);
  transition:transform 0s;
  background:
    /* 8 slices: FREE / PRO alternating */
    conic-gradient(from -22.5deg,
      #1d4ed8 0deg 45deg,
      #f59e0b 45deg 90deg,
      #2563eb 90deg 135deg,
      #fbbf24 135deg 180deg,
      #1e40af 180deg 225deg,
      #d97706 225deg 270deg,
      #3b82f6 270deg 315deg,
      #f59e0b 315deg 360deg);
  box-shadow:
    0 0 0 7px #0f172a,
    0 0 0 9px rgba(251,191,36,.5),
    0 14px 40px rgba(0,0,0,.5),
    inset 0 0 28px rgba(0,0,0,.35);
}
#luck-pop .lk-ring.spinning{
  transition: none;
  animation: lk-spin 0.26s linear infinite;
}
#luck-pop .lk-ring.stopping{
  transition: transform 4.2s cubic-bezier(.05,.55,.12,1);
}
@keyframes lk-spin{
  from{transform:rotate(0deg)}
  to{transform:rotate(360deg)}
}
/* labels on slices */
#luck-pop .lk-labels{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  border-radius:50%;
}
#luck-pop .lk-labels span{
  position:absolute;left:50%;top:50%;
  width:72px;margin-left:-36px;margin-top:-10px;
  font-size:11px;font-weight:900;letter-spacing:.06em;
  text-transform:uppercase;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  transform-origin:50% 10px;
}
#luck-pop .lk-labels .pro{color:#0f172a}
#luck-pop .lk-labels .free{color:#eff6ff}
#luck-pop .lk-labels span:nth-child(1){transform:rotate(0deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(2){transform:rotate(45deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(3){transform:rotate(90deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(4){transform:rotate(135deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(5){transform:rotate(180deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(6){transform:rotate(225deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(7){transform:rotate(270deg) translateY(-88px)}
#luck-pop .lk-labels span:nth-child(8){transform:rotate(315deg) translateY(-88px)}
#luck-pop .lk-hub{
  position:absolute;left:50%;top:50%;
  width:92px;height:92px;
  margin:-46px 0 0 -46px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#1e293b,#020617 72%);
  border:3px solid #fbbf24;
  box-shadow:0 0 28px rgba(251,191,36,.3), inset 0 0 18px rgba(0,0,0,.5);
  display:grid;place-items:center;
  z-index:4;
}
#luck-pop .lk-hub .lk-face{
  font-size:34px;line-height:1;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.4));
  transition:transform .25s ease, opacity .2s;
}
#luck-pop .lk-hub .lk-face.blur{opacity:.4;filter:blur(2px);transform:scale(.85)}
#luck-pop .lk-legend{
  display:flex;justify-content:center;gap:14px;margin:0 0 12px;
  font-size:11px;font-weight:800;letter-spacing:.04em;
}
#luck-pop .lk-legend i{
  display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px;
}
#luck-pop .lk-legend .lg-pro i{background:#fbbf24}
#luck-pop .lk-legend .lg-free i{background:#2563eb}
#luck-pop .lk-form{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px;align-items:center}
#luck-pop .lk-consent{flex:1 0 100%;display:flex;align-items:flex-start;gap:6px;margin:4px 0 0;font-size:10px;line-height:1.35;color:#94a3b8;text-align:left}
#luck-pop .lk-consent input,
#luck-pop .lk-consent input[type="checkbox"]{
  -webkit-appearance:checkbox;appearance:checkbox;
  width:13px!important;height:13px!important;min-width:13px!important;min-height:13px!important;
  max-width:13px!important;max-height:13px!important;
  margin:2px 0 0!important;padding:0!important;flex:0 0 13px!important;
  transform:none!important;accent-color:#2563eb;background:transparent!important;
  border-radius:3px!important;
}
#luck-pop .lk-consent a{color:#93c5fd;text-decoration:underline}
#luck-pop .lk-form input:not([type="checkbox"]){
  flex:1;height:46px;border-radius:999px;border:1px solid #334155;
  background:#0f172a;color:#fff;padding:0 16px;font:inherit;
  outline:none!important;box-shadow:none!important;text-align:left;
}
#luck-pop .lk-form button{
  height:46px;min-width:100px;border:0;border-radius:999px;
  background:linear-gradient(180deg,#fbbf24,#d97706);color:#0f172a;
  font-weight:900;padding:0 18px;cursor:pointer;
  box-shadow:0 8px 22px rgba(251,191,36,.4);
  letter-spacing:.02em;
}
#luck-pop .lk-form button:disabled{opacity:.55;cursor:wait}
#luck-pop .lk-msg{margin:12px 0 6px;font-size:14px;font-weight:700;color:#e2e8f0;min-height:1.2em}
#luck-pop .lk-free{
  display:none;align-items:center;justify-content:center;width:100%;
  height:44px;padding:0 16px;border-radius:999px;background:#fff;color:#0f172a;
  font-weight:800;text-decoration:none;margin-top:6px;
}
#luck-pop .lk-free.on{display:inline-flex}
@media(max-width:640px){
  #luck-pop{width:calc(100vw - 20px)}
  #luck-pop .lk-machine{width:210px;height:210px}
  #luck-pop .lk-labels span{font-size:10px;width:64px;margin-left:-32px}
  #luck-pop .lk-labels span:nth-child(n){/* keep */ }
  #luck-pop .lk-labels span:nth-child(1){transform:rotate(0deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(2){transform:rotate(45deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(3){transform:rotate(90deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(4){transform:rotate(135deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(5){transform:rotate(180deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(6){transform:rotate(225deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(7){transform:rotate(270deg) translateY(-76px)}
  #luck-pop .lk-labels span:nth-child(8){transform:rotate(315deg) translateY(-76px)}
  #luck-pop .lk-hub{width:80px;height:80px;margin:-40px 0 0 -40px}
  #luck-pop .lk-hub .lk-face{font-size:28px}
  #luck-pop .lk-consent{font-size:10px;gap:5px}
  #luck-pop .lk-consent input[type="checkbox"]{width:12px!important;height:12px!important;min-width:12px!important;min-height:12px!important;max-width:12px!important;max-height:12px!important;flex-basis:12px!important}
  #luck-pop .lk-form{gap:6px}
}

#luck-pop .lk-timer{
  display:none;margin:10px 0 4px;padding:10px 12px;
  border-radius:16px;border:1px solid rgba(251,191,36,.45);
  background:linear-gradient(180deg,rgba(251,191,36,.12),rgba(15,23,42,.5));
}
#luck-pop .lk-timer.on{display:block}
#luck-pop .lk-timer .lk-t-k{
  margin:0 0 6px;font-size:10px;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:#fbbf24;
}
#luck-pop .lk-timer .lk-t-row{
  display:flex;justify-content:center;gap:8px;
}
#luck-pop .lk-timer .lk-t-cell{
  min-width:52px;padding:8px 6px;border-radius:12px;
  background:#0f172a;border:1px solid #334155;
}
#luck-pop .lk-timer .lk-t-n{
  display:block;font-size:20px;font-weight:900;letter-spacing:-.03em;color:#f8fafc;font-variant-numeric:tabular-nums;
}
#luck-pop .lk-timer .lk-t-l{
  display:block;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin-top:2px;
}

.lk-px{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;border:0}

#luck-pop .lk-form input.bad{
  border-color:#f87171 !important;
  box-shadow:0 0 0 3px rgba(248,113,113,.28)!important;
  animation: lk-shake .32s ease;
}
@keyframes lk-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
#luck-pop .lk-err{
  flex:1 0 100%;margin:0;color:#fca5a5;font-size:12px;font-weight:800;
  text-align:left;padding:0 8px;letter-spacing:.01em;
}
#luck-pop .lk-burst{
  position:absolute;left:50%;top:42%;width:0;height:0;pointer-events:none;z-index:8;
}
#luck-pop .lk-burst i{
  position:absolute;left:0;top:0;width:8px;height:8px;border-radius:2px;
  animation: lk-burst var(--d, .7s) cubic-bezier(.12,.7,.2,1) forwards;
  opacity:0;
}
@keyframes lk-burst{
  0%{transform:translate(0,0) rotate(0) scale(.4);opacity:1}
  100%{transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.2);opacity:0}
}
#luck-pop .lk-result{
  display:none;margin:4px 0 8px;padding:12px 12px 10px;
  border-radius:18px;
}
#luck-pop .lk-result.on{display:block;animation:lk-pop .45s cubic-bezier(.22,1.3,.36,1)}
@keyframes lk-pop{from{transform:scale(.86);opacity:0}to{transform:none;opacity:1}}
#luck-pop .lk-result.free{
  background:linear-gradient(180deg,rgba(37,99,235,.28),rgba(15,23,42,.55));
  border:1px solid rgba(96,165,250,.55);
  box-shadow:0 0 40px rgba(37,99,235,.28);
}
#luck-pop .lk-result.pro{
  background:linear-gradient(180deg,rgba(251,191,36,.28),rgba(15,23,42,.55));
  border:1px solid rgba(251,191,36,.65);
  box-shadow:0 0 48px rgba(251,191,36,.32);
}
#luck-pop .lk-r-k{
  margin:0;font-size:10px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;
}
#luck-pop .lk-result.free .lk-r-k{color:#93c5fd}
#luck-pop .lk-result.pro .lk-r-k{color:#fbbf24}
#luck-pop .lk-r-h{
  margin:4px 0 4px;font-size:22px;font-weight:900;letter-spacing:-.03em;color:#fff;
}
#luck-pop .lk-r-s{margin:0;font-size:13px;font-weight:650;line-height:1.4;color:#cbd5e1}
#luck-pop.won-pro{
  border-color:rgba(251,191,36,.85);
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset, 0 0 120px rgba(251,191,36,.35), 0 40px 110px rgba(2,8,23,.7);
}
#luck-pop.won-free{
  border-color:rgba(96,165,250,.7);
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset, 0 0 110px rgba(37,99,235,.35), 0 40px 110px rgba(2,8,23,.7);
}
#luck-pop.won-pro .lk-hub{
  border-color:#fde68a;
  box-shadow:0 0 36px rgba(251,191,36,.55), inset 0 0 18px rgba(0,0,0,.5);
  animation: lk-hub-bounce .5s ease;
}
#luck-pop.won-free .lk-hub{
  border-color:#93c5fd;
  box-shadow:0 0 36px rgba(59,130,246,.5), inset 0 0 18px rgba(0,0,0,.5);
  animation: lk-hub-bounce .5s ease;
}
@keyframes lk-hub-bounce{0%{transform:scale(.7)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
#luck-pop .lk-free.on{
  height:48px;font-size:15px;letter-spacing:.01em;
  box-shadow:0 10px 28px rgba(255,255,255,.18);
  animation: lk-pop .4s .12s both;
}
