/* --- base / layout (igual ao anterior) --- */
.aba-quiz{--bg:#f7f9fc;--text:#0f172a;--primary:#7E57C2;--accent:#7AC9F5}
.aba-quiz{font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;color:var(--text);
background:radial-gradient(1200px 600px at 120% -10%, rgba(126,87,194,.15), transparent 60%),radial-gradient(900px 500px at -10% 110%, rgba(122,201,245,.15), transparent 60%),var(--bg)}
.aba-quiz *{box-sizing:border-box}

.aba-quiz .wrap{max-width:980px;margin:0 auto;padding:16px}
.aba-quiz .card{background:#fff;border-radius:18px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.08);margin:12px 0}
.aba-quiz .muted{color:#5b6477}

.aba-quiz .abaq-topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.7);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid rgba(126,87,194,.15)}
.aba-quiz .abaq-topbar-inner{display:flex;gap:12px;align-items:center;justify-content:space-between;max-width:980px;margin:0 auto;padding:8px 16px}
.aba-quiz .brand{font-weight:800;letter-spacing:.3px;color:var(--primary)}
.aba-quiz .score-wrap{display:flex;align-items:center;gap:8px}
.aba-quiz .score-pill{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,var(--accent),var(--primary));color:#fff;padding:6px 12px;border-radius:999px;font-weight:600;white-space:nowrap}
.aba-quiz .audio-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:2px solid var(--primary);color:var(--primary);background:#fff;border-radius:999px;cursor:pointer}
.aba-quiz .audio-btn[aria-pressed=true]{background:var(--primary);color:#fff}

.aba-quiz .progress-meta{display:flex;justify-content:space-between;align-items:center;margin:4px 0 8px;color:#5b6477;font-size:.9rem}
.aba-quiz .abaq-progress{width:100%;height:8px;background:#e9eef6;border-radius:999px;overflow:hidden}
.aba-quiz .abaq-bar{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),var(--primary));transition:width .5s ease}

.aba-quiz .btn{appearance:none;border:0;border-radius:14px;padding:14px 18px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 6px 16px rgba(126,87,194,.25)}
.aba-quiz .btn-primary{background:var(--primary);color:#fff}
.aba-quiz .btn-block{display:block;width:100%}

.aba-quiz .options{display:grid;gap:10px;margin:12px 0 8px}
.aba-quiz .opt{background:#f3f6fb;border:2px solid transparent;border-radius:12px;padding:14px;cursor:pointer;display:flex;gap:10px;align-items:center}
.aba-quiz .opt[aria-checked=true]{border-color:var(--primary);background:#eef2ff}
.aba-quiz .box{width:18px;height:18px;border-radius:4px;border:2px solid var(--primary);position:relative;flex:0 0 auto}
.aba-quiz .opt[aria-checked=true] .box::after{content:"";position:absolute;inset:3px;background:var(--primary);border-radius:2px}

.aba-quiz .popup{position:fixed;inset:0;display:none;place-items:center;background:rgba(12,18,34,.55);z-index:100;padding:18px}
.aba-quiz .popup[aria-hidden="false"]{display:grid}
.aba-quiz .pop-card{max-width:520px;width:96vw;text-align:center}
.aba-quiz .points{font-size:2rem;font-weight:800;color:#22c55e}
.aba-quiz .confetti{position:fixed;inset:0;pointer-events:none;z-index:120}

/* --- TYPING: animação 100% CSS --- */
.aba-quiz .typing{white-space:pre-wrap;line-height:1.7}
@keyframes tw-reveal { to { opacity:1; visibility:visible; } }
@keyframes tw-img-reveal { to { opacity:1; } }

.aba-quiz .typing .tw-ch{
  opacity:0; visibility:hidden;
  animation: tw-reveal 0s linear forwards;
  animation-delay: var(--d, 0ms);
}

.aba-quiz .typing img.tw-img{
  opacity:0;
  max-width:100%; height:auto; display:block; margin:12px 0;
  animation: tw-img-reveal 0s linear forwards;
  animation-delay: var(--d, 0ms);
}
/* ... (resto do seu CSS igual) ... */
.aba-quiz .typing{white-space:pre-wrap;line-height:1.7}
@keyframes tw-reveal { to { opacity:1; visibility:visible; } }
@keyframes tw-img-reveal { to { opacity:1; } }
.aba-quiz .typing .tw-ch{
  opacity:0; visibility:hidden;
  animation: tw-reveal 0s linear forwards;
  animation-delay: var(--d, 0ms);
}
.aba-quiz .typing img.tw-img{
  opacity:0;
  max-width:100%; height:auto; display:block; margin:12px 0;
  animation: tw-img-reveal 0s linear forwards;
  animation-delay: var(--d, 0ms);
}