/* Styles (unchanged) */
.sqg-container { max-width: 860px; margin: 16px auto; }
.sqg-card { background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:20px; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.sqg-progress { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.sqg-step { font-size:14px; color:#374151; }
.sqg-timer { font-variant-numeric: tabular-nums; margin-left:auto; padding:2px 8px; border:1px solid #e5e7eb; border-radius:999px; background:#f9fafb; }
.sqg-bar { flex:1; height:8px; background:#f3f4f6; border-radius:999px; overflow:hidden; }
.sqg-bar-fill { height:100%; width:0%; background:#3b82f6; transition:width .25s ease; }
.sqg-question h3 { margin:8px 0 8px; font-size:20px; }
.sqg-media-wrap { margin:8px 0 8px; }
.sqg-answers { display:grid; gap:10px; margin-bottom:8px; }
.sqg-row { display:flex; gap:10px; align-items:flex-start; padding:12px; border:1px solid #e5e7eb; border-radius:10px; cursor:pointer; background:#fff; transition:transform .05s ease, background .15s ease; }
.sqg-row:hover { background:#f9fafb; }
.sqg-row:focus { outline:3px solid #93c5fd; }
.sqg-row:active { transform:scale(0.995); }
.sqg-row.sqg-disabled { opacity:.92; cursor:default; }
.sqg-letter { font-weight:700; min-width:28px; text-align:center; }
.sqg-opt { flex:1; }
.sqg-feedback { margin:8px 0 0; font-weight:600; }
.sqg-correct { border-color:#10b981; background:#ecfdf5; }
.sqg-incorrect { border-color:#ef4444; background:#fef2f2; }
.sqg-actions { display:flex; justify-content:center; margin-top:12px; }
.sqg-btn { background:#111827; color:#fff; border:none; padding:10px 16px; border-radius:10px; cursor:pointer; }
.sqg-result { text-align:center; padding:8px; }
.sqg-score { font-size:22px; margin-bottom:4px; }
.sqg-message { font-size:18px; font-weight:600; }
.sqg-sub { color:#4b5563; margin-bottom:8px; }
.sqg-details { text-align:left; margin:10px auto; }
.sqg-details summary { cursor:pointer; font-weight:600; margin-bottom:6px; }
.sqg-list { margin-left:20px; }
.sqg-qsum { padding:8px 0; border-bottom:1px solid #eee; }
.sqg-explain, .sqg-exp { margin-top:6px; padding:8px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:8px; }
.sqg-error { background:#fff7ed; border:1px solid #fdba74; color:#9a3412; padding:12px; border-radius:8px; }
