@font-face{font-family:Alliance;src:url("AllianceBlackSWFTE.woff2") format("woff2");font-weight:900;font-display:swap}

body.quiz-active{overflow:hidden}
.lucky-quiz{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;overflow:auto;padding:20px;background:#170a2f url("bg.jpg") center/cover no-repeat;color:#fff;font-family:Roboto,Arial,sans-serif}
.lucky-quiz::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 30%,rgba(124,43,206,.14),rgba(10,3,29,.72) 68%,rgba(5,1,17,.92))}
.lucky-quiz.is-hidden{display:none}
.quiz-shell{position:relative;width:min(680px,100%);padding:30px 34px 34px;border:2px solid #f3bd39;border-radius:24px;background:linear-gradient(160deg,rgba(46,15,85,.97),rgba(15,5,39,.98));box-shadow:0 22px 70px rgba(0,0,0,.65),0 0 34px rgba(242,184,50,.18);text-align:center}
.quiz-kicker{display:inline-block;margin-bottom:12px;padding:6px 14px;border:1px solid rgba(255,211,98,.55);border-radius:99px;color:#ffd667;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.quiz-title{margin:0 auto 24px;max-width:570px;color:#fff;font-family:Alliance,Roboto,sans-serif;font-size:clamp(25px,5vw,40px);line-height:1.04;text-transform:uppercase;text-shadow:0 3px 0 #5a1d70,0 0 22px rgba(255,207,75,.28)}
.quiz-progress{margin:0 auto 26px;max-width:560px}
.quiz-progress-copy{display:flex;justify-content:space-between;margin-bottom:7px;color:#d9cbe8;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.quiz-progress-track{height:7px;overflow:hidden;border-radius:99px;background:rgba(255,255,255,.12)}
.quiz-progress-track i{display:block;width:25%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f29b23,#ffe478);box-shadow:0 0 14px rgba(255,212,85,.7);transition:width .3s ease}
.quiz-step{display:none;animation:quizIn .28s ease}
.quiz-step.active{display:block}
.quiz-step h2{max-width:590px;margin:0 auto 22px;color:#fff;font-size:clamp(21px,3.7vw,29px);font-weight:900;line-height:1.25}
.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 auto;max-width:560px}
.quiz-options button{min-height:70px;padding:13px 16px;border:1px solid rgba(255,220,120,.38);border-radius:14px;background:linear-gradient(180deg,rgba(105,48,154,.92),rgba(60,22,103,.96));box-shadow:inset 0 1px rgba(255,255,255,.12),0 7px 18px rgba(0,0,0,.22);color:#fff;font-size:18px;font-weight:900;text-align:left;transition:transform .08s,border-color .15s,filter .15s}
.quiz-options button span{display:inline-block;width:35px;font-size:24px;text-align:center;margin-right:8px}
.quiz-options button:hover,.quiz-options button:focus-visible{border-color:#ffd65f;filter:brightness(1.13);outline:none}
.quiz-options button:active,.quiz-options button.selected{transform:scale(.98);border-color:#ffe172;background:linear-gradient(180deg,#8a4ab6,#64248b)}
.quiz-result .quiz-gift{font-size:64px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.3))}
.quiz-result h2{margin:5px auto 13px;color:#ffd65f;font-family:Alliance,Roboto,sans-serif;font-size:clamp(31px,6vw,48px);text-transform:uppercase}
.quiz-result p{max-width:540px;margin:0 auto 12px;color:#fff;font-size:clamp(19px,3.7vw,25px);line-height:1.4}
.quiz-result strong{color:#ffe16f}
.quiz-result .quiz-ready{margin-top:16px;font-weight:900}
.quiz-reveal{width:min(520px,100%);margin-top:10px;padding:18px 20px;border:2px solid #fff0a4;border-radius:14px;background:linear-gradient(#ffe96f,#f19a18);box-shadow:0 8px 0 #9d4e09,0 14px 32px rgba(0,0,0,.38);color:#341352;font-family:Alliance,Roboto,sans-serif;font-size:clamp(18px,4vw,25px);font-weight:900;text-transform:uppercase;text-shadow:0 1px rgba(255,255,255,.45)}
.quiz-reveal:active{transform:translateY(4px);box-shadow:0 4px 0 #9d4e09,0 9px 20px rgba(0,0,0,.32)}
@keyframes quizIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

@media(max-width:560px){
  .lucky-quiz{align-items:flex-start;padding:12px}
  .quiz-shell{margin:auto 0;padding:22px 14px 25px;border-radius:18px}
  .quiz-title{margin-bottom:18px}
  .quiz-progress{margin-bottom:20px}
  .quiz-step h2{margin-bottom:17px}
  .quiz-options{grid-template-columns:1fr;gap:9px}
  .quiz-options button{min-height:58px;padding:10px 14px;font-size:17px}
  .quiz-options button span{font-size:21px}
}
