:root{--accent:#0369a1;--lime:#84cc16}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
[x-cloak]{display:none!important}
.shadow-soft{box-shadow:0 12px 36px rgba(15,23,42,.055)}
.pattern-grid{background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);background-size:32px 32px}
.info-card,.stat-card,.result-stat{border:1px solid #e2e8f0;border-radius:1rem;background:#f8fafc;padding:1rem}
.info-card div,.stat-card span,.result-stat span{display:block;font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}
.info-card b{display:block;margin-top:.5rem;font-size:.9rem;color:#0f172a}
.stat-card,.result-stat{background:#fff;box-shadow:0 12px 36px rgba(15,23,42,.045)}
.stat-card b,.result-stat b{display:block;margin-top:.3rem;font-size:1.35rem;color:#0f172a}
.quill-content{word-break:break-word;overflow-wrap:anywhere}
.quill-content p{margin:0 0 .65rem}
.quill-content p:last-child{margin-bottom:0}
.quill-content .ql-align-right{text-align:right}
.quill-content .ql-align-center{text-align:center}
.quill-content .ql-align-justify{text-align:justify}
.quill-content .ql-direction-rtl,.quill-content [dir=rtl],.arabic-content,.arabic-content *,.arabic-option,.arabic-option *{direction:rtl;text-align:right;font-family:Amiri,"Noto Naskh Arabic",serif!important;font-size:1.2rem!important;line-height:2!important}
.quill-content img{display:block;max-width:100%;height:auto}
.quill-content ol,.quill-content ul{margin:.5rem 0;padding-left:1.25rem}
.quiz-option{transition:background-color .18s,border-color .18s,box-shadow .18s,transform .18s}
.quiz-option:hover{transform:translateY(-1px)}
.quiz-option.is-selected{border-color:rgba(2,132,199,.55);background:rgba(2,132,199,.07);box-shadow:0 0 0 3px rgba(2,132,199,.1)}
.pgk-option.is-selected{border-color:#0284c7;background:#f0f9ff;box-shadow:inset 4px 0 0 #0284c7,0 0 0 2px rgba(2,132,199,.09)}
.review-box{border:1px solid #e2e8f0;border-radius:1rem;background:#f8fafc;padding:1rem;font-size:.875rem;line-height:1.75}
.review-box>span{display:block;margin-bottom:.5rem;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}
.result-filter{display:inline-flex;flex:none;align-items:center;gap:.5rem;border:1px solid #e2e8f0;border-radius:.8rem;background:#fff;padding:.65rem .9rem;font-size:.8rem;font-weight:700;color:#475569;transition:.18s}
.result-filter span{display:grid;min-width:1.4rem;height:1.4rem;place-items:center;border-radius:999px;background:#f1f5f9;padding:0 .35rem;font-size:.68rem}
.result-filter:hover{border-color:#cbd5e1;background:#f8fafc}
.result-filter.is-active{border-color:#0f172a;background:#0f172a;color:#fff}
.result-filter.is-active span{background:rgba(255,255,255,.14);color:#fff}
.finish-confirmation{border-radius:1.75rem!important;padding:1.35rem!important}
.finish-summary{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1.15rem 0 .9rem;text-align:left}
.finish-summary>div{border:1px solid #e2e8f0;border-radius:1rem;background:#f8fafc;padding:.9rem 1rem}
.finish-summary span{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#94a3b8}
.finish-summary strong{display:block;margin-top:.25rem;font-size:1.5rem;line-height:1;color:#0f172a}
.finish-summary .has-unanswered{border-color:#fed7aa;background:#fff7ed}
.finish-summary .has-unanswered strong{color:#c2410c}
.finish-note{margin:0;text-align:left;font-size:.86rem;line-height:1.65;color:#64748b}
.finish-confirm-button{border-radius:.8rem!important;background:#0f172a!important;font-weight:700!important;padding:.75rem 1.1rem!important}
.finish-cancel-button{border-radius:.8rem!important;background:#f1f5f9!important;color:#475569!important;font-weight:700!important;padding:.75rem 1.1rem!important}
@media(max-width:639px){.stat-card{padding:.8rem}
.stat-card span{font-size:.6rem}
.stat-card b{font-size:1.05rem}
.arabic-content,.arabic-content *,.arabic-option,.arabic-option *{font-size:1.1rem!important}
.swal2-popup{border-radius:1.5rem!important}
}
