/* 🎯 شو ألعب؟ */
.qz-wrap{padding-bottom:40px}
.qz-head{padding-bottom:18px}
.qz-box{max-width:760px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:26px 22px 22px;position:relative;overflow:hidden}
.qz-box::before{content:"";position:absolute;inset:-40% -20% auto auto;width:320px;height:320px;background:radial-gradient(circle,color-mix(in srgb,var(--pri) 22%,transparent),transparent 70%);pointer-events:none}
.qz-box.qz-done{max-width:none;background:transparent;border:0;padding:0}
.qz-box.qz-done::before{display:none}
.qz-in>*{animation:qzIn .35s ease both}
@keyframes qzIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.qz-prog{display:flex;gap:6px;margin-bottom:6px}
.qz-prog i{flex:1;height:6px;border-radius:6px;background:var(--line);transition:background .3s}
.qz-prog i.done{background:var(--pri)}
.qz-prog i.on{background:linear-gradient(90deg,var(--pri),var(--mag))}
.qz-count{font-size:.82rem;color:var(--dim);text-align:end;margin-bottom:10px}

.qz-q{font-size:clamp(1.3rem,4vw,1.7rem);font-weight:900;margin:4px 0 4px;text-align:center}
.qz-sub{color:var(--mut);text-align:center;margin:0 0 6px}
.qz-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.qz-opts.many{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.qz-opt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:110px;padding:16px 10px;border-radius:var(--r);border:1.5px solid var(--line2);background:var(--card2);color:var(--txt);font:inherit;font-weight:700;cursor:pointer;transition:transform .15s,border-color .15s,background .15s,box-shadow .15s}
.qz-opt i{font-style:normal;font-size:2rem;line-height:1}
.qz-opt:hover{transform:translateY(-3px);border-color:var(--pri);box-shadow:var(--glow)}
.qz-opt.on{border-color:var(--pri);background:color-mix(in srgb,var(--pri) 18%,var(--card2))}
.qz-back{margin-top:16px;background:none;border:0;color:var(--mut);font:inherit;cursor:pointer;padding:8px 4px}
.qz-back:hover{color:var(--txt)}

.qz-res-head{text-align:center;margin:0 auto 20px;max-width:760px}
.qz-res-ic{font-size:2.6rem;animation:bpWig 3s ease-in-out infinite}
.qz-res-head h2{font-size:clamp(1.3rem,4vw,1.8rem);font-weight:900;margin:6px 0 10px}
.qz-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.qz-chip{background:var(--card2);border:1px solid var(--line2);border-radius:999px;padding:5px 12px;font-size:.85rem}
.qz-note{color:var(--warn);font-size:.9rem;margin:12px 0 0}
.qz-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}

.qz-promo{background:linear-gradient(120deg,color-mix(in srgb,var(--cyan) 22%,var(--card)),var(--card))}

@media (max-width:560px){
  .qz-box{padding:20px 14px 16px}
  .qz-opts{grid-template-columns:repeat(2,1fr);gap:10px}
  .qz-opts:not(.many) .qz-opt:last-child:nth-child(odd){grid-column:1/-1}
  .qz-opt{min-height:92px}
  .qz-actions .btn{flex:1 1 100%}
}