/* ========== QUIZ (scoped di dalam #quizOverlay) ========== */
#quizOverlay{--qd:#150C22;--qp:#221530;--qp2:#2C1B40;--neon:#C6FF3D;--coral:#FF5D73;--gold:#FFC857;--qt:#F6EFE7;--qm:#B29FC7;--rtrack:#3A2650;position:fixed;inset:0;z-index:9000;background:radial-gradient(circle at 15% 10%, rgba(198,255,61,0.08), transparent 40%),radial-gradient(circle at 85% 90%, rgba(255,93,115,0.08), transparent 40%),var(--qd);overflow-y:auto;padding:24px 16px;font-family:'Plus Jakarta Sans',sans-serif;color:var(--qt);display:none}
#quizOverlay.active{display:block}
#quizOverlay *{box-sizing:border-box;margin:0;padding:0}
#quizOverlay .qz-close{position:fixed;top:16px;right:20px;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,0.06);border:1px solid var(--rtrack);color:var(--qt);font-size:20px;line-height:1;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;transition:all .15s ease}
#quizOverlay .qz-close:hover{border-color:var(--gold);color:var(--gold);transform:rotate(90deg)}
#quizOverlay .qz-app{width:100%;max-width:520px;margin:0 auto}
#quizOverlay .qz-screen{display:none}
#quizOverlay .qz-screen.active{display:block}
#quizOverlay .qz-eyebrow{font-family:'Space Mono',monospace;letter-spacing:.18em;text-transform:uppercase;font-size:11px;color:var(--neon);margin-bottom:10px}
#quizOverlay .qz-title{font-family:'Baloo 2',sans-serif;font-weight:800;font-size:40px;line-height:1.05;margin-bottom:14px}
#quizOverlay .qz-title span{color:var(--neon)}
#quizOverlay .qz-lede{color:var(--qm);font-size:15px;line-height:1.6;margin-bottom:28px;max-width:42ch}
#quizOverlay .qz-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:30px}
#quizOverlay .qz-rule-chip{background:var(--qp);border:1px solid var(--rtrack);border-radius:14px;padding:14px 10px;text-align:center}
#quizOverlay .qz-rule-chip .n{font-family:'Space Mono',monospace;font-size:20px;font-weight:700;color:var(--gold);display:block}
#quizOverlay .qz-rule-chip .l{font-size:11px;color:var(--qm);margin-top:4px;display:block}
#quizOverlay .qz-btn{font-family:'Baloo 2',sans-serif;font-weight:700;font-size:18px;border:none;border-radius:16px;padding:16px 28px;cursor:pointer;background:var(--neon);color:#111;width:100%;transition:transform .15s ease, box-shadow .15s ease;box-shadow:0 8px 0 #7ea31c}
#quizOverlay .qz-btn:active{transform:translateY(6px);box-shadow:0 2px 0 #7ea31c}
#quizOverlay .qz-btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#quizOverlay .qz-btn.qz-secondary{background:transparent;color:var(--qt);border:2px solid var(--rtrack);box-shadow:none;margin-top:10px}
#quizOverlay .qz-btn.qz-secondary:active{transform:translateY(2px)}
#quizOverlay .qz-topbar{display:flex;align-items:center;gap:14px;margin-bottom:18px}

#quizOverlay .qz-meta{flex:1}
#quizOverlay .qz-qcount{font-family:'Space Mono',monospace;font-size:12px;color:var(--qm);margin-bottom:6px}
#quizOverlay .qz-progress-track{height:6px;background:var(--rtrack);border-radius:99px;overflow:hidden}
#quizOverlay .qz-progress-fill{height:100%;background:linear-gradient(90deg, var(--neon), var(--gold));border-radius:99px;transition:width .3s ease}
#quizOverlay .qz-score-box{text-align:right;flex-shrink:0}
#quizOverlay .qz-score-box .val{font-family:'Space Mono',monospace;font-weight:700;font-size:20px;color:var(--gold)}
#quizOverlay .qz-score-box .lbl{font-size:10px;color:var(--qm);text-transform:uppercase;letter-spacing:.1em}
#quizOverlay .qz-combo{display:inline-flex;align-items:center;gap:6px;background:rgba(255,200,87,0.12);border:1px solid var(--gold);color:var(--gold);font-family:'Space Mono',monospace;font-size:12px;font-weight:700;padding:5px 10px;border-radius:99px;margin-bottom:16px;opacity:0;transform:translateY(-4px) scale(.9);transition:all .25s ease}
#quizOverlay .qz-combo.show{opacity:1;transform:translateY(0) scale(1)}
#quizOverlay .qz-category{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--coral);margin-bottom:10px}
#quizOverlay .qz-question{font-family:'Baloo 2',sans-serif;font-weight:700;font-size:26px;line-height:1.25;margin-bottom:24px;min-height:96px}
#quizOverlay .qz-answers{display:grid;gap:12px;margin-bottom:8px}
#quizOverlay .qz-answer{text-align:left;background:var(--qp);border:2px solid var(--rtrack);color:var(--qt);font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:600;padding:15px 16px;border-radius:14px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:transform .12s ease, border-color .12s ease, background .12s ease}
#quizOverlay .qz-answer:hover:not(:disabled){border-color:var(--neon);transform:translateY(-2px)}
#quizOverlay .qz-answer:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#quizOverlay .qz-answer .key{font-family:'Space Mono',monospace;font-size:12px;color:var(--qm);width:20px;flex-shrink:0}
#quizOverlay .qz-answer:disabled{cursor:default}
#quizOverlay .qz-answer.correct{background:rgba(198,255,61,0.14);border-color:var(--neon)}
#quizOverlay .qz-answer.correct .key{color:var(--neon)}
#quizOverlay .qz-answer.wrong{background:rgba(255,93,115,0.14);border-color:var(--coral);animation:qz-shake .4s ease}
#quizOverlay .qz-answer.wrong .key{color:var(--coral)}
#quizOverlay .qz-answer.dim{opacity:.4}
@keyframes qz-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
#quizOverlay .qz-float{position:fixed;font-family:'Space Mono',monospace;font-weight:700;font-size:22px;color:var(--neon);pointer-events:none;animation:qz-floatUp 1s ease forwards;z-index:9050}
@keyframes qz-floatUp{0%{opacity:0;transform:translateY(0) scale(.8)}20%{opacity:1;transform:translateY(-10px) scale(1.1)}100%{opacity:0;transform:translateY(-70px) scale(1)}}
#quizOverlay .qz-particle{position:fixed;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:9049;animation:qz-burst .8s ease-out forwards}
@keyframes qz-burst{0%{transform:translate(0,0) rotate(0deg);opacity:1}100%{transform:var(--tp) rotate(360deg);opacity:0}}
#quizOverlay .qz-result-card{background:var(--qp);border:1px solid var(--rtrack);border-radius:22px;padding:32px 26px;text-align:center}
#quizOverlay .qz-rank-emoji{font-size:56px;margin-bottom:6px}
#quizOverlay .qz-rank-title{font-family:'Baloo 2',sans-serif;font-weight:800;font-size:28px;color:var(--gold);margin-bottom:4px}
#quizOverlay .qz-rank-sub{color:var(--qm);font-size:13px;margin-bottom:24px}
#quizOverlay .qz-final-score{font-family:'Space Mono',monospace;font-weight:700;font-size:52px;color:var(--neon);line-height:1}
#quizOverlay .qz-final-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--qm);margin-bottom:26px}
#quizOverlay .qz-stat-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:26px}
#quizOverlay .qz-stat{background:var(--qp2);border-radius:12px;padding:12px}
#quizOverlay .qz-stat .v{font-family:'Space Mono',monospace;font-weight:700;font-size:20px}
#quizOverlay .qz-stat .k{font-size:11px;color:var(--qm);margin-top:2px}
#quizOverlay .qz-note{font-size:12px;color:var(--qm);margin:16px 0 4px;line-height:1.5}
@media(max-width:420px){#quizOverlay .qz-title{font-size:32px}#quizOverlay .qz-question{font-size:21px}}
