*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#f9fafb;--bg-secondary:#f1f3f5;--bg-card:#fff;--bg-card-hover:#f9fafb;--border:#e5e7eb;--border-light:#d1d5db;--text-primary:#111827;--text-secondary:#374151;--text-muted:#6b7280;--text-disabled:#9ca3af;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-dim:#2563eb14;--secondary:#7c3aed;--secondary-dim:#7c3aed14;--green:#16a34a;--green-dim:#16a34a14;--red:#dc2626;--red-dim:#dc262614;--yellow:#f59e0b;--yellow-dim:#f59e0b14;--blue:#2563eb;--font-display:"Poppins", "Inter", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"JetBrains Mono", "Inter", monospace;--radius:12px;--radius-sm:8px;--radius-lg:20px;--shadow:0 1px 3px #1118270f, 0 4px 16px #1118270a;--shadow-lg:0 4px 12px #11182714, 0 12px 36px #1118270f;--space-page:clamp(16px, 4vw, 40px)}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-secondary);-webkit-font-smoothing:antialiased;min-height:100vh;font-size:16px;line-height:1.65}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-disabled)}.btn{border-radius:var(--radius-sm);font-family:var(--font-body);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:10px 20px;font-size:14px;font-weight:600;text-decoration:none;transition:all .15s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);box-shadow:0 2px 12px #2563eb40}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-secondary);border-color:var(--border-light)}.btn-outline{color:var(--accent);border:1.5px solid var(--accent);background:0 0}.btn-outline:hover{background:var(--accent-dim)}.btn-danger{background:var(--red);color:#fff}.btn-danger:hover{background:#b91c1c}.btn-success{background:var(--green);color:#fff}.btn-success:hover{background:#15803d}.btn-lg{border-radius:var(--radius);min-height:48px;padding:13px 28px;font-size:16px}.btn-sm{min-height:32px;padding:6px 14px;font-size:13px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:active:not(:disabled){transform:scale(.98)}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;transition:all .15s}.card:hover{border-color:var(--border-light)}.card-hover:hover{box-shadow:var(--shadow-lg);cursor:pointer;border-color:var(--accent);transform:translateY(-2px)}input,select,textarea{background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-family:var(--font-body);appearance:none;padding:12px 16px;font-size:15px;transition:border-color .15s,box-shadow .15s}select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236B7280' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;padding-right:40px}input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #2563eb1f}input::placeholder,textarea::placeholder{color:var(--text-disabled)}label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:600;display:block}input[type=checkbox],input[type=radio]{width:auto}.container{max-width:1200px;padding:0 var(--space-page);margin:0 auto}.page{min-height:calc(100vh - 64px);padding:clamp(20px,4vw,40px) 0}.grid-2{grid-template-columns:repeat(2,1fr);gap:clamp(12px,2vw,24px);display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,24px);display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.5vw,20px);display:grid}h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-primary);font-weight:700;line-height:1.25}p{color:var(--text-secondary)}.h1,h1{font-size:clamp(28px,5vw,38px)}.h2,h2{font-size:clamp(22px,3.5vw,28px)}.h3,h3{font-size:clamp(18px,2.5vw,20px)}.text-sm{font-size:14px}.text-muted{color:var(--text-muted)}.gradient-text{background:linear-gradient(135deg, var(--accent), var(--secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.badge{letter-spacing:.4px;text-transform:uppercase;white-space:nowrap;border-radius:100px;align-items:center;gap:4px;padding:3px 10px;font-size:11px;font-weight:700;display:inline-flex}.badge-easy{background:var(--green-dim);color:var(--green);border:1px solid #16a34a40}.badge-medium{background:var(--yellow-dim);color:#b45309;border:1px solid #f59e0b4d}.badge-hard{background:var(--red-dim);color:var(--red);border:1px solid #dc262640}.badge-primary{background:var(--accent-dim);color:var(--accent);border:1px solid #2563eb40}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:36px;height:36px;margin:40px auto;animation:.8s linear infinite spin;display:block}@keyframes spin{to{transform:rotate(360deg)}}.progress-bar{background:var(--border);border-radius:3px;height:6px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:3px;height:100%;transition:width .4s}.option-btn{text-align:left;background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text-primary);font-family:var(--font-body);cursor:pointer;align-items:center;gap:14px;padding:16px 18px;font-size:15px;transition:all .15s;display:flex}.option-btn:hover:not(:disabled),.option-btn.selected{border-color:var(--accent);background:var(--accent-dim)}.option-btn.correct{border-color:var(--green);background:var(--green-dim)}.option-btn.incorrect{border-color:var(--red);background:var(--red-dim)}.option-btn:disabled{cursor:default}.option-label{background:var(--bg-secondary);min-width:32px;height:32px;color:var(--text-secondary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;transition:all .15s;display:flex}.option-btn.selected .option-label{background:var(--accent);color:#fff}.option-btn.correct .option-label{background:var(--green);color:#fff}.option-btn.incorrect .option-label{background:var(--red);color:#fff}.stat-card{text-align:center;padding:24px}.stat-value{font-family:var(--font-display);color:var(--text-primary);font-size:clamp(22px,4vw,36px);font-weight:800}.stat-label{color:var(--text-muted);margin-top:4px;font-size:13px;font-weight:500}.nav{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);background:#ffffffeb;align-items:center;height:64px;display:flex;position:sticky;top:0}.navbar-mobile-panel{z-index:99;position:sticky;top:64px}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.35s forwards fadeIn}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.pulse{animation:2s infinite pulse}.quiz-nav-footer{flex-direction:column;gap:16px;display:flex}.quiz-answered-label,.quiz-finish-label{display:inline}@media (width<=1024px){.grid-4{grid-template-columns:repeat(2,1fr)}}@media (width>=640px){.quiz-answered-label,.lb-pts-label{display:inline!important}}@media (width<=768px){.grid-3{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.nav{height:60px}.navbar-mobile-panel{top:60px}.card{padding:18px}.btn-lg{padding:12px 22px;font-size:15px}.navbar-links,.navbar-actions{display:none!important}.navbar-burger{justify-content:center;align-items:center;display:flex!important}}@media (width<=480px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.stat-card{padding:16px}.card{border-radius:var(--radius-sm);padding:16px}.option-btn{padding:14px;font-size:14px}body{font-size:15px}}@media (hover:none){.card-hover:hover{transform:none}.btn{min-height:44px}}