.quiz-container{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;position:relative;background:var(--color-ink-950);overflow:hidden}.quiz-emoji-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}.quiz-emoji-float{position:absolute;bottom:-40px;opacity:0;animation:emoji-rise linear infinite}@keyframes emoji-rise{0%{opacity:0;transform:translateY(0) rotate(0)}10%{opacity:.15}80%{opacity:.1}to{opacity:0;transform:translateY(-110vh) rotate(30deg)}}.quiz-intro{position:relative;z-index:10;text-align:center;max-width:480px;animation:fade-up .6s ease-out}.quiz-intro__badge{display:inline-block;font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.15em;color:var(--color-twilight-400);border:1px solid color-mix(in srgb,var(--color-twilight-400) 30%,transparent);border-radius:20px;padding:6px 16px;margin-bottom:32px}.quiz-intro__title{font-family:var(--font-display);font-size:clamp(32px,6vw,48px);font-weight:700;line-height:1.15;color:var(--color-ink-0)}.quiz-intro__gradient{background:linear-gradient(135deg,var(--color-twilight-300),var(--color-dusk-400));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.quiz-intro__subtitle{margin-top:20px;font-size:18px;color:var(--color-ink-400);font-style:italic;font-family:var(--font-serif)}.quiz-intro__start{margin-top:40px;display:inline-flex;align-items:center;padding:16px 40px;border-radius:12px;font-family:var(--font-display);font-weight:600;font-size:16px;color:var(--color-ink-0);background:linear-gradient(135deg,var(--color-twilight-500),var(--color-dusk-500));border:none;cursor:pointer;transition:all .25s ease}.quiz-intro__start:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 8px 30px -8px color-mix(in srgb,var(--color-twilight-500) 40%,transparent),0 0 60px -20px color-mix(in srgb,var(--color-dusk-500) 30%,transparent)}.quiz-intro__start:active{transform:translateY(0) scale(.98)}.quiz-intro__back{display:block;margin-top:24px;font-size:13px;color:var(--color-ink-600);text-decoration:none;transition:color .2s}.quiz-intro__back:hover{color:var(--color-ink-400)}.quiz-progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--color-ink-900);z-index:50}.quiz-progress__bar{height:100%;position:relative;background:linear-gradient(90deg,var(--color-twilight-400),var(--color-dusk-400));transition:width .5s cubic-bezier(.34,1.56,.64,1)}.quiz-progress__glow{position:absolute;right:-2px;top:-4px;width:12px;height:12px;border-radius:50%;background:var(--color-dusk-400);filter:blur(4px);opacity:.8}.quiz-counter{position:fixed;top:16px;right:24px;font-family:var(--font-mono);font-size:13px;z-index:50;background:color-mix(in srgb,var(--color-ink-950) 80%,transparent);padding:4px 10px;border-radius:8px;border:1px solid var(--color-ink-800)}.quiz-counter__current{color:var(--color-ink-0);font-weight:600}.quiz-counter__sep{color:var(--color-ink-700);margin:0 2px}.quiz-counter__total{color:var(--color-ink-600)}.quiz-image-wrap{width:100%;max-width:320px;margin:0 auto 20px;border-radius:16px;overflow:hidden;aspect-ratio:1;position:relative}.quiz-image{width:100%;height:100%;object-fit:cover;display:block;animation:image-fade .5s ease-out;border-radius:16px}.quiz-image-wrap:after{content:"";position:absolute;inset:0;border-radius:16px;box-shadow:inset 0 0 40px 10px var(--color-ink-950);pointer-events:none}@keyframes image-fade{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@media(max-width:480px){.quiz-image-wrap{max-width:220px}}.quiz-question__emoji-badge{text-align:center;margin-bottom:12px}.quiz-question__emoji{font-size:32px;display:inline-block;animation:emoji-bounce .5s cubic-bezier(.34,1.56,.64,1)}@keyframes emoji-bounce{0%{transform:scale(0) rotate(-15deg)}60%{transform:scale(1.2) rotate(5deg)}to{transform:scale(1) rotate(0)}}.quiz-question{max-width:560px;width:100%}.quiz-question--enter{animation:slide-in .4s ease-out}.quiz-question--exit{animation:slide-out .25s ease-in forwards}.quiz-question__text{font-family:var(--font-display);font-size:clamp(18px,4vw,24px);font-weight:600;color:var(--color-ink-0);text-align:center;line-height:1.35;margin-bottom:28px}.quiz-options{display:flex;flex-direction:column;gap:10px}.quiz-option{display:flex;align-items:center;gap:12px;width:100%;padding:14px 18px;border-radius:12px;background:var(--color-ink-900);border:1px solid var(--color-ink-800);color:var(--color-ink-200);font-size:14px;line-height:1.4;text-align:left;cursor:pointer;transition:all .2s ease;opacity:0;animation:option-enter .35s ease-out forwards;animation-delay:var(--stagger, 0ms)}@keyframes option-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.quiz-option:hover:not(:disabled){border-color:var(--color-ink-600);background:color-mix(in srgb,var(--color-ink-800) 60%,var(--color-ink-900));transform:translate(4px)}.quiz-option--selected{border-color:var(--color-twilight-400)!important;background:color-mix(in srgb,var(--color-twilight-900) 40%,var(--color-ink-900))!important;animation:option-select .4s cubic-bezier(.34,1.56,.64,1) forwards!important;opacity:1!important;box-shadow:0 0 20px -6px color-mix(in srgb,var(--color-twilight-400) 30%,transparent)}@keyframes option-select{0%{transform:scale(1)}40%{transform:scale(1.03)}to{transform:scale(1)}}.quiz-option--dimmed{opacity:.3!important;transform:scale(.98)!important;transition:all .3s ease}.quiz-option:disabled{cursor:default}.quiz-option__emoji{flex-shrink:0;font-size:20px;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.quiz-option__text{flex:1}.quiz-confetti{position:fixed;top:50%;left:50%;pointer-events:none;z-index:100}.quiz-confetti__particle{position:absolute;font-size:20px;animation:confetti-burst .7s ease-out forwards;animation-delay:var(--delay, 0s)}@keyframes confetti-burst{0%{opacity:1;transform:translate(0) scale(1) rotate(0)}to{opacity:0;transform:translate(calc(cos(var(--angle)) * var(--distance)),calc(sin(var(--angle)) * var(--distance))) scale(.5) rotate(180deg)}}.quiz-calculating{display:flex;flex-direction:column;align-items:center;gap:40px;animation:fade-up .5s ease-out}.quiz-calculating__orbit{position:relative;width:160px;height:160px;animation:orbit-spin 12s linear infinite}.quiz-calculating__orbit-emoji{position:absolute;font-size:20px;top:50%;left:50%;transform:rotate(calc(360deg / var(--orbit-total) * var(--orbit-i))) translate(70px) rotate(calc(-360deg / var(--orbit-total) * var(--orbit-i)));opacity:.5}@keyframes orbit-spin{to{transform:rotate(360deg)}}.quiz-calculating__center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);animation:calc-emoji-enter .4s cubic-bezier(.34,1.56,.64,1)}.quiz-calculating__emoji{font-size:56px;display:block;animation:calc-emoji-pulse 2s ease-in-out infinite}@keyframes calc-emoji-enter{0%{transform:translate(-50%,-50%) scale(0) rotate(-20deg)}to{transform:translate(-50%,-50%) scale(1) rotate(0)}}@keyframes calc-emoji-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}.quiz-calculating__text{font-family:var(--font-serif);font-style:italic;font-size:18px;color:var(--color-ink-300);animation:fade-up .35s ease-out;text-align:center}@keyframes fade-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes slide-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-40px)}}
