*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f3f6fb;color:#172033}.hidden{display:none!important}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:76px;background:#102a56;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5%;box-shadow:0 2px 12px #0002}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:42px;height:42px;border-radius:11px;background:#fff;color:#102a56;display:grid;place-items:center;font-weight:900;font-size:23px}.brand h1{font-size:20px;margin:0}.brand span{font-size:12px;color:#cbd8ef}.screen{width:min(1180px,92%);margin:34px auto;flex:1}.login-screen{display:grid;place-items:center}.login-card{width:min(440px,100%);background:#fff;padding:34px;border-radius:20px;box-shadow:0 15px 45px #1b3c6b1c}.login-icon{font-size:44px}.login-card h2{margin:10px 0 4px}.muted{color:#6c778a}.login-card form{display:grid;gap:15px;margin-top:22px}.login-card label{font-weight:700;font-size:14px}.login-card input{width:100%;padding:13px 14px;border:1px solid #d4dbe7;border-radius:10px;margin-top:7px;font-size:15px;outline:none}.login-card input:focus{border-color:#2877f0;box-shadow:0 0 0 3px #2877f018}.demo-hint{margin-top:18px;padding:12px;border-radius:10px;background:#f0f5ff;color:#34527d;font-size:13px;line-height:1.7}.error{color:#c62828;min-height:20px;font-size:13px}.btn{border:0;border-radius:10px;padding:12px 18px;font-weight:800;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:#1769e0;color:#fff}.btn-secondary{background:#e9eef6;color:#21314d}.btn-success{background:#1d9658;color:#fff}.btn-outline{border:1px solid #ffffff66;background:transparent;color:#fff}.btn-full{width:100%}.hero{background:linear-gradient(135deg,#102a56,#1e5eb8);color:#fff;padding:30px;border-radius:20px;display:flex;justify-content:space-between;gap:25px;align-items:center}.hero h2{font-size:31px;margin:5px 0}.hero p{margin:8px 0;color:#dce8fb}.eyebrow{font-size:11px;letter-spacing:1.5px;font-weight:900;color:#6e86aa}.hero .eyebrow{color:#bcd3f7}.stats{display:flex;gap:12px}.stats div{min-width:95px;text-align:center;background:#ffffff14;border:1px solid #ffffff25;border-radius:13px;padding:12px}.stats strong,.stats span{display:block}.stats strong{font-size:22px}.stats span{font-size:11px;color:#d4e1f6;margin-top:4px}.exam-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.exam-card{background:#fff;border:1px solid #e1e6ee;border-radius:16px;padding:22px;box-shadow:0 7px 25px #22385a0a;display:flex;flex-direction:column;min-height:205px}.exam-card .num{font-size:12px;font-weight:900;color:#6d7d96}.exam-card h3{margin:10px 0 7px;font-size:20px}.exam-card p{font-size:13px;color:#69758a;line-height:1.5;flex:1}.exam-meta{display:flex;justify-content:space-between;font-size:12px;color:#53627b;margin-bottom:13px}.exam-card .btn{width:100%}.exam-header{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:16px;padding:20px 24px}.exam-header h2{margin:4px 0}.timer-card{min-width:125px;text-align:center;background:#fff2e8;border:1px solid #ffd9bf;border-radius:12px;padding:10px}.timer-card span{display:block;font-size:10px;font-weight:900;color:#a55a28}.timer-card strong{font-size:23px;color:#c94d18}.progress-bar{height:8px;background:#dfe6f1;border-radius:99px;margin:13px 0 18px;overflow:hidden}.progress-bar div{height:100%;width:0;background:#1769e0;transition:.2s}.exam-layout{display:grid;grid-template-columns:1fr 280px;gap:18px}.question-card,.palette-card{background:#fff;border-radius:16px;padding:25px;box-shadow:0 7px 25px #22385a0a}.question-number{display:inline-block;background:#eaf2ff;color:#1769e0;font-size:12px;font-weight:900;padding:7px 10px;border-radius:8px}.question-card h3{font-size:21px;line-height:1.45;margin:18px 0}.options{display:grid;gap:12px}.option{border:1px solid #dbe2ec;border-radius:11px;padding:14px;cursor:pointer;display:flex;gap:10px;align-items:flex-start}.option:hover{border-color:#8db4ef;background:#f8fbff}.option.selected{border-color:#1769e0;background:#eef5ff}.option input{margin-top:3px;accent-color:#1769e0}.question-actions{display:flex;justify-content:space-between;margin-top:25px}.palette-card h3{margin-top:0}.palette{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.pal-btn{height:36px;border:1px solid #d4dce8;border-radius:8px;background:#fff;cursor:pointer;font-weight:800}.pal-btn.answered{background:#1d9658;color:#fff;border-color:#1d9658}.pal-btn.current{outline:2px solid #1769e0;outline-offset:1px}.palette-help{font-size:12px;color:#77849a;line-height:1.6}.result-card{max-width:650px;margin:20px auto;background:#fff;text-align:center;padding:40px;border-radius:22px;box-shadow:0 15px 50px #233c5c15}.result-icon{font-size:52px}.result-card h2{font-size:30px;margin:5px}.score-circle{width:150px;height:150px;border-radius:50%;border:13px solid #dfeaff;display:grid;place-items:center;margin:25px auto}.score-circle span{font-size:30px;font-weight:900;color:#1769e0}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.result-stats div{padding:15px;border-radius:12px;background:#f5f7fb}.result-stats strong,.result-stats span{display:block}.result-stats strong{font-size:24px}.result-stats span{font-size:12px;color:#748098}.result-actions{display:flex;gap:10px;justify-content:center;margin-top:25px}footer{text-align:center;padding:20px;color:#7b879a;font-size:12px}@media(max-width:850px){.hero{flex-direction:column;align-items:flex-start}.stats{width:100%}.stats div{flex:1}.exam-grid{grid-template-columns:repeat(2,1fr)}.exam-layout{grid-template-columns:1fr}.palette-card{order:-1}.palette{grid-template-columns:repeat(10,1fr)}}@media(max-width:560px){.topbar{padding:0 4%}.brand h1{font-size:16px}.brand span{display:none}.screen{width:94%;margin:20px auto}.hero h2{font-size:25px}.stats{display:grid;grid-template-columns:repeat(3,1fr)}.stats div{min-width:0}.exam-grid{grid-template-columns:1fr}.exam-header{padding:15px}.exam-header h2{font-size:19px}.question-card{padding:18px}.question-card h3{font-size:18px}.palette{grid-template-columns:repeat(10,1fr)}.pal-btn{height:32px;font-size:11px}.result-actions{flex-direction:column}.result-stats{gap:6px}}