.psh-quiz { --psh-primary:#2563eb; --psh-primary-600:#1d4ed8; --psh-border:#e2e8f0; --psh-bg:#ffffff; --psh-muted:#4a5568; border:1px solid var(--psh-border); padding:16px; background:var(--psh-bg); border-radius:8px; position:relative; }
.psh-quiz .psh-quiz-header { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:10px; }
.psh-quiz .psh-progress { flex:1; }
.psh-quiz .psh-progress-text { font-size:12px; color:#4a5568; margin-bottom:6px; }
.psh-quiz .psh-progress-bar { width:100%; height:8px; background:#edf2f7; border-radius:999px; overflow:hidden; }
.psh-quiz .psh-progress-fill { display:block; height:100%; background:var(--psh-primary); width:0%; transition:width .2s ease; }
.psh-quiz .psh-timer { font-weight:600; }

.psh-quiz .psh-q { margin:12px 0; padding:12px; border:1px solid var(--psh-border); border-radius:8px; background:#fff; }
.psh-quiz .psh-q:hover { box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.psh-quiz .psh-q-title { font-weight:600; font-size:16px; margin-bottom:6px; }
.psh-quiz .psh-q-title .psh-num { color:var(--psh-primary); margin-right:6px; }
.psh-quiz .psh-q-meta { font-size:12px; color:#718096; margin-bottom:6px; }
.psh-quiz .psh-q-desc { color:#2d3748; margin-bottom:8px; }
.psh-quiz .psh-q-media { margin:8px 0; }
.psh-quiz .psh-q-media img { max-width:100%; border-radius:6px; }
.psh-quiz .psh-q-media iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:6px; }

.psh-quiz .psh-opt { display:block; margin:6px 0; cursor:pointer; }
.psh-quiz .psh-opt input { position:absolute; opacity:0; pointer-events:none; }
.psh-quiz .psh-opt span { display:block; padding:10px 12px; border:1px solid var(--psh-border); border-radius:8px; transition:all .15s ease; }
.psh-quiz .psh-opt:hover span, .psh-quiz .psh-opt:focus-within span { border-color:#cbd5e0; background:#f7fafc; }
.psh-quiz .psh-opt input:checked + span { border-color:var(--psh-primary); background:#eff6ff; box-shadow:inset 0 0 0 1px var(--psh-primary); }

.psh-quiz .psh-ident { display:flex; gap:8px; margin-top:10px; }
.psh-quiz .psh-ident input { flex:1; padding:8px; border:1px solid var(--psh-border); border-radius:6px; }

.psh-quiz .psh-actions { margin-top:12px; display:flex; gap:8px; }
.psh-quiz .psh-actions .psh-submit, .psh-quiz .psh-actions .psh-retry { background:var(--psh-primary); border:1px solid var(--psh-primary-600); color:#fff; padding:8px 14px; border-radius:6px; cursor:pointer; }
.psh-quiz .psh-actions .psh-prev, .psh-quiz .psh-actions .psh-next { background:#edf2f7; border:1px solid #cbd5e0; color:#1a202c; padding:8px 14px; border-radius:6px; cursor:pointer; }
.psh-quiz .psh-actions .psh-retry { background:#4a5568; border-color:#2d3748; }
.psh-quiz .psh-actions .psh-retry[disabled] { opacity:.6; cursor:not-allowed; }

.psh-quiz .psh-results { margin-top:12px; padding-top:10px; border-top:1px solid var(--psh-border); }
.psh-quiz .psh-item.ok { color:#2f855a; }
.psh-quiz .psh-item.bad { color:#c53030; }
.psh-quiz .psh-share { margin-top:10px; display:flex; align-items:center; gap:6px; }
.psh-quiz .psh-share .psh-share-btn { background:#edf2f7; border:1px solid #cbd5e0; padding:6px 10px; cursor:pointer; border-radius:999px; color:#1a202c; font-weight:600; }
.psh-quiz .psh-share .psh-facebook { background:#1877F2 !important; border-color:#1877F2 !important; color:#fff !important; }
.psh-quiz .psh-share .psh-twitter { background:#000000 !important; border-color:#000000 !important; color:#fff !important; }
.psh-quiz .psh-share .psh-whatsapp { background:#25D366 !important; border-color:#25D366 !important; color:#fff !important; }
.psh-quiz .psh-share .psh-linkedin { background:#0A66C2 !important; border-color:#0A66C2 !important; color:#fff !important; }
.psh-quiz .psh-share .psh-copy { background:#4A5568 !important; border-color:#2D3748 !important; color:#fff !important; }
.psh-quiz .psh-locked { background:#fffaf0; border:1px solid #f6ad55; padding:8px; margin-bottom:10px; border-radius:6px; }
.psh-quiz .psh-retry-msg { color:#c05621; margin-left:8px; }
.psh-quiz .psh-numgrid { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.psh-quiz .psh-numgrid { list-style:none; padding:0; }
.psh-quiz .psh-numbtn {
  min-width:28px; height:28px; border-radius:999px; border:1px solid var(--psh-border); background:#f7fafc; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; padding:0 8px; line-height:1; box-sizing:border-box;
  -webkit-appearance:none; appearance:none; text-decoration:none; user-select:none; position:relative; vertical-align:middle;
  white-space:nowrap; font-size:13px; font-weight:600; font-variant-numeric: tabular-nums;
}
.psh-quiz .psh-numbtn::before, .psh-quiz .psh-numbtn::after { content:none !important; }
.psh-quiz .psh-numbtn.ok { border-color:#38a169; background:#f0fff4; color:#2f855a; font-weight:600; }
.psh-quiz .psh-numbtn.bad { border-color:#e53e3e; background:#fff5f5; color:#c53030; font-weight:600; }
.psh-quiz .psh-qdetails { margin-top:12px; }
.psh-quiz .psh-detail-item { border:1px solid var(--psh-border); border-radius:8px; padding:10px; background:#fff; }
.psh-quiz .psh-d-title { font-weight:600; margin-bottom:6px; }
.psh-quiz .psh-d-desc { color:#4a5568; margin-bottom:8px; }
.psh-quiz .psh-d-options { list-style:none; padding:0; margin:0; }
.psh-quiz .psh-d-options li { padding:6px 8px; border:1px solid var(--psh-border); border-radius:6px; margin:4px 0; }
.psh-quiz .psh-d-options li.chosen { box-shadow: inset 0 0 0 2px #718096; }
.psh-quiz .psh-d-options li.correct { background:#f0fff4; border-color:#38a169; }
.psh-quiz .psh-d-options li.chosen:not(.correct) { background:#fff5f5; border-color:#e53e3e; }
.psh-quiz .psh-d-explain { margin-top:8px; padding:8px; background:#ebf8ff; border:1px solid #bee3f8; border-radius:6px; }
.psh-quiz .psh-your-sel { margin-top:6px; color:#2d3748; }
.psh-quiz .psh-your-sel.bad { color:#c53030; }
.psh-quiz .psh-your-sel.ok { color:#2f855a; }
.psh-quiz .psh-numbtn.active { outline: 2px solid var(--psh-primary); }
.psh-quiz .psh-q-tools { margin-top:6px; }
.psh-quiz .psh-q-tools .psh-clear { background:#edf2f7; border:1px solid #cbd5e0; color:#1a202c; padding:6px 10px; border-radius:6px; cursor:pointer; }
.psh-quiz .psh-numbtn.na { border-color:#a0aec0; background:#edf2f7; color:#4a5568; }
.psh-quiz .psh-your-sel.na { color:#4a5568; font-style:italic; }
.psh-quiz .psh-emailpdf { margin-top:10px; }
.psh-quiz .psh-emailpdf .psh-email-row { display:flex; gap:8px; margin-bottom:6px; }
.psh-quiz .psh-emailpdf input { flex:1; padding:8px; border:1px solid var(--psh-border); border-radius:6px; }
.psh-quiz .psh-emailpdf .psh-email-send { background:var(--psh-primary); border:1px solid var(--psh-primary-600); color:#fff; padding:8px 14px; border-radius:6px; cursor:pointer; }
.psh-quiz .psh-share { margin-top:10px; display:flex; align-items:center; gap:6px; }
.psh-quiz .psh-share .psh-share-btn { background:#edf2f7; border:1px solid #cbd5e0; padding:4px 8px; cursor:pointer; }
.psh-quiz .psh-locked { background:#fffaf0; border:1px solid #f6ad55; padding:8px; margin-bottom:10px; }
.psh-quiz .psh-retry-msg { color:#c05621; margin-left:8px; }
.psh-quiz .psh-intro { border:1px dashed var(--psh-border); padding:14px; border-radius:8px; background:#f8fafc; margin-bottom:12px; }
.psh-quiz .psh-intro-title { font-size:18px; font-weight:700; margin-bottom:6px; }
.psh-quiz .psh-intro-meta { color:#4a5568; margin-bottom:10px; }
.psh-quiz .psh-start { background:var(--psh-primary); border:1px solid var(--psh-primary-600); color:#fff; padding:8px 14px; border-radius:6px; cursor:pointer; }

.psh-quiz .psh-loading { position:absolute; inset:0; background:rgba(255,255,255,0.88); display:none; align-items:center; justify-content:center; flex-direction:column; gap:12px; text-align:center; font-weight:600; color:#1a202c; z-index:30; padding:20px; }
.psh-quiz .psh-loading.is-active { display:flex; }
.psh-quiz .psh-loading::before { content:''; width:36px; height:36px; border-radius:50%; border:3px solid rgba(37,99,235,0.25); border-top-color:var(--psh-primary); animation:psh-spin 1s linear infinite; }
@keyframes psh-spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }