:root{--brand: #2563eb;--brand-dark: #1e40af;--text: #111827;--muted: #6b7280;--bg: #f9fafb;--radius: 10px;--shadow: 0 4px 16px rgba(0,0,0,.08)}html{scroll-behavior:smooth}.landing-page{font-family:Inter,sans-serif;background:var(--bg);color:var(--text)}.header{display:flex;align-items:center;justify-content:space-between;padding:20px 60px;background:#fff;box-shadow:var(--shadow)}.logo{display:flex;align-items:center;gap:10px}.logo img{height:80px;width:auto;margin-right:10px}.btn-login{background:transparent;border:2px solid var(--brand);color:var(--brand);padding:8px 18px;border-radius:var(--radius);font-weight:600;cursor:pointer}.btn-login:hover{background:var(--brand);color:#fff}.hero{display:flex;align-items:center;justify-content:space-between;padding:80px 60px;flex-wrap:wrap}.hero-text{max-width:480px}.hero-text h1{font-size:2.8rem;margin-bottom:16px}.hero-text p{color:var(--muted);margin-bottom:24px;line-height:1.6}.hero-img img{max-width:440px;border-radius:16px;box-shadow:var(--shadow)}.btn-primary{background:var(--brand);color:#fff;padding:12px 24px;border-radius:var(--radius);text-decoration:none;font-weight:600;transition:background .2s ease}.btn-primary:hover{background:var(--brand-dark)}.how-it-works{text-align:center;padding:80px 20px;background:#fff}.steps{display:flex;justify-content:center;flex-wrap:wrap;gap:40px;margin-top:40px}.step{width:220px}.step span{font-size:1.8rem}.step h3{margin-top:10px}.why{padding:80px 20px;background:var(--bg);text-align:center}.features{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:40px}.feature{background:#fff;padding:20px 30px;border-radius:var(--radius);box-shadow:var(--shadow);font-weight:600}.cta{text-align:center;padding:100px 20px;background:var(--brand);color:#fff}.cta button{background:#fff;color:var(--brand);border:none;padding:12px 24px;border-radius:var(--radius);font-weight:600;cursor:pointer;margin-top:20px}.cta button:hover{background:var(--brand-dark);color:#fff}.footer{background:#fff;padding:20px;text-align:center;color:var(--muted)}.auth-shell{min-height:100vh;display:grid;place-items:center;background:#f6f8fb}.auth-card{width:100%;max-width:360px;background:#fff;border-radius:18px;padding:48px 40px 52px;box-shadow:0 30px 60px #11182714,0 6px 18px #1118270f;border:1px solid #eef2f7}.auth-brand{display:flex;justify-content:center;margin-bottom:20px}.auth-logo{width:70px;height:70px;object-fit:contain}.auth-title{text-align:center;font-weight:700;color:#374151;margin:8px 0 28px;font-size:1.2rem}.auth-form{display:grid;gap:18px;margin-bottom:20px}.auth-label input{width:100%;border:1px solid #d1d5db;border-radius:10px;background:#fff;padding:14px 16px;font-size:1rem;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.auth-label input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb2e}.auth-submit{width:100%;background:#2563eb;color:#fff;font-weight:800;border:0;padding:14px 16px;border-radius:10px;cursor:pointer;letter-spacing:.3px;transition:background .15s ease,transform .02s ease}.auth-submit:hover{background:#1d4ed8}.auth-submit:active{transform:translateY(1px)}.auth-switch{display:flex;justify-content:center;gap:6px;margin-top:16px;color:#6b7280;font-size:.95rem}.auth-link{background:none;border:none;color:#2563eb;font-weight:700;cursor:pointer;padding:0}.auth-error{color:#dc2626;background:#fee2e2;padding:10px;border-radius:8px;margin-top:12px;font-size:.9rem}.auth-success{color:#166534;background:#dcfce7;padding:10px;border-radius:8px;margin-top:12px;font-size:.9rem}.dashboard-header{display:flex;justify-content:space-between;align-items:center;padding:14px 32px;background-color:#fff;border-bottom:1px solid #eee;box-shadow:0 1px 4px #0000000d;position:sticky;top:0;z-index:50}.header-left{display:flex;align-items:center;gap:10px}.header-logo{width:34px;height:34px;border-radius:8px}.header-title{font-weight:600;font-size:1.1rem;color:#222}.header-right{position:relative;display:flex;align-items:center;gap:12px;cursor:pointer}.user-menu{display:flex;align-items:center;gap:8px}.user-avatar{background-color:#2563eb;color:#fff;border-radius:50%;width:32px;height:32px;display:flex;justify-content:center;align-items:center;font-weight:600;font-size:14px}.user-email{font-size:.9rem;color:#333}.chevron{font-size:.8rem;color:#777}.dropdown-menu{position:absolute;right:0;top:48px;background-color:#fff;border:1px solid #eee;box-shadow:0 4px 16px #00000014;border-radius:8px;overflow:hidden;z-index:100}.dropdown-menu button{display:block;width:100%;padding:10px 16px;border:none;background:#fff;text-align:left;font-size:.9rem;cursor:pointer}.dropdown-menu button:hover{background-color:#f8f9fa}.dashboard-page{background-color:#f9fafb;min-height:100vh;padding:40px 20px}.dashboard-container{max-width:900px;margin:0 auto;text-align:center}.dashboard-container h2{font-size:1.8rem;font-weight:700;color:#1e293b;margin-bottom:10px}.dashboard-container p{color:#64748b;margin-bottom:32px;font-size:1rem}.site-footer{text-align:center;padding:20px 0;color:#94a3b8;font-size:.9rem;border-top:1px solid #e2e8f0;background-color:#fff;position:fixed;bottom:0;left:0;width:100%}.subject-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.subject-card{background:#fff;border:1px solid #eee;border-radius:12px;padding:22px 16px;font-weight:600;color:#334155;font-size:1rem;cursor:pointer;transition:all .25s ease;box-shadow:0 2px 5px #00000008}.subject-card:hover{background-color:#2563eb;color:#fff;transform:translateY(-3px);box-shadow:0 6px 12px #2563eb33}:root{--bg: #f9fafb;--surface: #ffffff;--surface-2: #f3f4f6;--text: #111827;--muted: #6b7280;--brand: #2563eb;--brand-strong: #1d4ed8;--success: #16a34a;--danger: #dc2626;--radius: 12px;--shadow: 0 6px 18px rgba(0,0,0,.08)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);background:var(--bg)}.page{min-height:100vh;display:flex;flex-direction:column}.site-header,.site-footer{text-align:center;padding:20px 16px;background:var(--surface-2)}.title{margin:0;font-weight:800;font-size:1.8rem}.container{width:100%;max-width:1100px;margin:0 auto;padding:32px 20px 48px;display:grid;gap:20px}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid #e5e7eb;overflow:clip;display:grid}.card__head,.card__body,.card__foot{padding:20px}.card__head{background:var(--surface-2);border-bottom:1px solid #e5e7eb}.card__foot{border-top:1px solid #e5e7eb;display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.card--lg{width:90%;max-width:980px;min-height:65vh;margin:24px auto;padding:32px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:16px}.card--lg .card__head,.card--lg .card__body,.card--lg .card__foot{padding:28px}.card--lg .card__body.scrollable{max-height:60vh;overflow-y:auto}.question{font-size:1.35rem;font-weight:700;margin:6px 0 16px}.answers{display:grid;gap:12px;width:100%}.btn{appearance:none;border:none;padding:14px 18px;border-radius:10px;font-weight:600;cursor:pointer;transition:background-color .2s ease,transform .05s ease}.btn:active{transform:translateY(1px) scale(.99)}.btn[disabled]{opacity:.6;pointer-events:none}.btn[data-variant=primary]{background:var(--brand);color:#fff}.btn[data-variant=primary]:hover{background:var(--brand-strong)}.btn[data-variant=secondary]{background:var(--surface-2);color:var(--text)}.btn[data-variant=secondary]:hover{background:#e5e7eb}.btn[data-variant=ghost]{background:transparent;color:var(--muted);border:1px solid #d1d5db}.btn[data-variant=ghost]:hover{color:var(--text);border-color:#9ca3af}.answer{text-align:left;background:var(--surface-2);color:var(--text)}.answer[data-state=correct]{outline:2px solid var(--success)}.answer[data-state=wrong]{outline:2px solid var(--danger)}.subject-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:100%;max-width:980px;margin:0 auto}.subject-btn{padding:16px 12px;border-radius:12px;text-align:center;background:var(--surface-2);color:var(--text);font-weight:700;border:1px solid #e5e7eb;cursor:pointer;transition:background-color .2s ease,transform .05s ease;min-height:56px}.subject-btn:hover{background:#e5e7eb}.subject-btn:active{transform:translateY(1px) scale(.99)}@media (max-width: 900px){.subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 520px){.subject-grid{grid-template-columns:1fr}}input[type=text],input[type=password],input[type=number]{width:100%;max-width:420px;background:var(--surface-2);color:var(--text);border:1px solid #d1d5db;border-radius:10px;padding:12px 14px;font-size:1rem;outline:none}input[type=text]:focus,input[type=password]:focus,input[type=number]:focus{border-color:var(--brand);box-shadow:0 0 0 2px #2563eb33}.wizara__title{font-weight:800;font-size:1.2rem;margin:0 0 6px}.wizara__subtitle{margin:0;color:var(--muted)}.intro{margin:10px 0 14px;color:var(--muted)}.result-title{font-size:2rem;line-height:1.2;margin:0 0 10px}.result-intro,.result-score{font-size:1.1rem}