:root{--hoop-bg: #f5c98d;--hoop-bg-dark: #d68646;--hoop-bg-darker: #b96a35;--hoop-text: #2c1b0b;--hoop-accent: #f1782d;--hoop-shadow: rgba(54, 26, 10, .25)}.hoop-quiz-page{min-height:calc(100vh - 2rem);min-height:calc(100svh - 2rem);display:flex;justify-content:center;align-items:stretch;padding:.75rem}.hoop-quiz{width:min(100%,560px);display:flex;flex-direction:column;gap:.75rem;padding:.75rem .75rem 1rem;border-radius:20px;background:radial-gradient(circle at top,#ffe3b8,#f1b66d 55%,#e39a5a);box-shadow:0 18px 40px var(--hoop-shadow);color:var(--hoop-text);font-family:var(--font-display, "Noto Sans Arabic"),sans-serif;opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}.hoop-quiz.hoop-quiz--ready{opacity:1;transform:translateY(0)}.hoop-quiz__prompt{font-size:clamp(1.05rem,3.2vw,1.5rem);font-weight:700;text-align:center;letter-spacing:.2px}.hoop-quiz__stage{position:relative;flex:1 1 auto;min-height:62vh;min-height:62svh;border-radius:18px;overflow:hidden;background:transparent;border:none;touch-action:none;overscroll-behavior:contain}.hoop-quiz__canvas{width:100%;height:100%;display:block;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.hoop-quiz__guide-replay{position:absolute;top:12px;left:50%;margin-left:-1.6rem;z-index:3;width:3.2rem;height:3.2rem;padding:.45rem;--speaker-bg: #fff7ed;--speaker-border: rgba(249, 115, 22, .5)}.hoop-quiz__guide-replay.speaker-btn:active{--speaker-press-offset: 2px}.hoop-quiz__guide-replay svg{width:100%;height:100%}.hoop-quiz__win-gif{position:absolute;left:0;top:0;width:0;height:0;opacity:0;pointer-events:none;z-index:2147483647}.hoop-quiz__win-gif.is-active{opacity:1}.hoop-quiz__controls{display:flex;justify-content:center;align-items:center;gap:.5rem;font-size:.95rem;color:#3b2412}.hoop-quiz__toggle{border:none;padding:.55rem .9rem;border-radius:999px;background:#fff3dd;color:#5c3516;font-weight:600;box-shadow:inset 0 0 0 2px #ff8c4959;transition:transform .2s ease,box-shadow .2s ease;cursor:pointer}.hoop-quiz__toggle:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 2px #ff8c4980,0 6px 16px #46220c26}.hoop-quiz__toggle:active{transform:translateY(0)}.hoop-quiz-question{display:flex;flex-direction:column;align-items:center;gap:.6rem;width:100vw;max-width:100vw;margin:0}.hoop-quiz-question .hoop-quiz{width:100vw;position:relative;height:100vh;min-height:100vh;height:100dvh;min-height:100dvh;padding:0;gap:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden}.hoop-quiz-question .hoop-quiz__stage{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;min-height:100%;border-radius:0}.hoop-quiz-question .hoop-quiz__prompt{position:absolute;top:12px;left:12px;right:12px;z-index:2;font-size:clamp(1.05rem,3vw,1.35rem);color:#2b1a0c;text-shadow:0 2px 0 rgba(255,255,255,.35)}.hoop-quiz-question .hoop-quiz__controls{position:absolute;left:0;right:0;bottom:12px;z-index:2}.hoop-quiz-feedback{min-height:1.4rem;font-weight:600;text-align:center;color:#3b2412}.hoop-quiz-feedback.is-correct{color:#1f7d2f}.hoop-quiz-feedback.is-wrong{color:#b33b1c}.hoop-quiz-question.flash-wrong.shake-wrong{animation:flash-wrong .5s ease-in-out}.hoop-quiz-screen-flash{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2147483646;opacity:0;background:#dc00129e}.hoop-quiz-screen-flash.is-active{animation:hoop-quiz-screen-flash .62s cubic-bezier(.2,.85,.2,1)}.hoop-quiz-screen-shake{animation:hoop-quiz-screen-shake .32s ease-in-out}@keyframes hoop-quiz-screen-flash{0%{opacity:0}14%{opacity:1}30%{opacity:.16}44%{opacity:.92}62%{opacity:.12}76%{opacity:.72}to{opacity:0}}@keyframes hoop-quiz-screen-shake{0%{transform:translate(0)}25%{transform:translate(-14px)}50%{transform:translate(14px)}75%{transform:translate(-9px)}to{transform:translate(0)}}@media (max-width: 560px){.hoop-quiz{border-radius:16px}.hoop-quiz__stage{min-height:56vh}}