:root{--app-primary:#0d6efd;--app-ink:#172033;--app-muted:#6c757d;--app-soft:#eef4ff}
body{color:var(--app-ink)}
.brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--app-primary);color:#fff;font-weight:800}
.hero{border-radius:24px;background:linear-gradient(135deg,#0d6efd 0%,#5f8dff 100%);color:#fff}
.card-soft{border:1px solid rgba(13,110,253,.08);border-radius:18px;box-shadow:0 8px 28px rgba(20,45,85,.06)}
.stat-card{border:1px solid #e9eef5;border-radius:18px;background:#fff}
.stat-number{font-size:clamp(1.5rem,3vw,2rem);font-weight:800}
.quiz-shell{max-width:1500px;margin:auto}
.quiz-top{position:sticky;top:56px;z-index:20;background:#fff;border-bottom:1px solid #e8edf3}
.question-card{border-radius:18px;border:1px solid #e6ebf2;box-shadow:0 8px 30px rgba(12,32,58,.06)}
.option-btn{width:100%;text-align:left;border:1px solid #dce3ec;background:#fff;border-radius:14px;padding:14px 16px;transition:.15s;font-size:1rem}
.option-btn:hover{border-color:#86b7fe;background:#f8fbff}.option-btn.active{border-color:var(--app-primary);background:#eef5ff;box-shadow:0 0 0 3px rgba(13,110,253,.1)}
.option-letter{width:32px;height:32px;border-radius:50%;display:inline-grid;place-items:center;background:#f0f3f7;font-weight:700;margin-right:10px}.option-btn.active .option-letter{background:var(--app-primary);color:#fff}
.palette{display:grid;grid-template-columns:repeat(5,minmax(34px,1fr));gap:8px}.palette button{border:1px solid #dfe5ed;background:#fff;border-radius:10px;min-height:40px;font-weight:700}.palette button.current{border-color:var(--app-primary);box-shadow:0 0 0 2px rgba(13,110,253,.1)}.palette button.answered{background:#d1e7dd;border-color:#badbcc}.palette button.review{background:#fff3cd;border-color:#ffda6a}.palette button.unanswered{background:#fff}
.timer-pill{font-variant-numeric:tabular-nums;font-weight:800}.offline-badge{display:none}.offline .offline-badge{display:inline-flex}
.mobile-bottom{position:sticky;bottom:0;z-index:25;background:#fff;border-top:1px solid #e9ecef;padding:.65rem;box-shadow:0 -5px 20px rgba(0,0,0,.06)}
.table-responsive{border-radius:14px}.form-control,.form-select{min-height:46px}.btn{border-radius:10px}.btn-lg{border-radius:13px}
.login-wrap{min-height:calc(100vh - 150px);display:grid;place-items:center}.auth-card{max-width:520px;width:100%;border-radius:24px}
.progress{height:8px;border-radius:999px}
@media(max-width:991.98px){.quiz-top{top:56px}.palette{grid-template-columns:repeat(6,minmax(32px,1fr))}}
@media(max-width:575.98px){.hero{border-radius:18px}.question-card{border-radius:14px}.mobile-bottom .btn{flex:1}.palette{grid-template-columns:repeat(5,minmax(30px,1fr));gap:6px}.palette button{min-height:36px;font-size:.85rem}}