:root {
    --navy: #0b2f5b;
    --navy-2: #071f3d;
    --red: #ef233c;
    --yellow: #ffc928;
    --green: #16a34a;
    --ink: #13233a;
    --muted: #718096;
    --line: #dfe6ef;
    --soft: #f5f8fc;
    --white: #fff;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#f7f9fc}
button,input{font:inherit}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(420px,47%) 1fr}
.brand-panel{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:clamp(48px,7vw,110px);color:#fff;background:radial-gradient(circle at 18% 14%,rgba(255,201,40,.24),transparent 27%),radial-gradient(circle at 80% 82%,rgba(239,35,60,.2),transparent 30%),linear-gradient(145deg,var(--navy),var(--navy-2));isolation:isolate}
.brand-panel::before{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:-260px;top:-120px;box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.018);z-index:-1}
.brand-copy{max-width:620px}
.eyebrow{display:inline-flex;padding:9px 13px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.14em;color:#dbe7f6}
.brand-copy h1{font-size:clamp(42px,5.2vw,76px);line-height:1.02;letter-spacing:-.055em;margin:24px 0 22px;font-weight:700}
.brand-copy h1 strong{color:var(--yellow);font-weight:800}
.brand-copy p{max-width:560px;margin:0;color:#bfd0e4;font-size:17px;line-height:1.75}
.exam-card{margin-top:55px;width:min(440px,92%);padding:22px 24px;border:1px solid rgba(255,255,255,.14);border-radius:24px;background:rgba(255,255,255,.09);backdrop-filter:blur(12px);transform:rotate(-2deg);box-shadow:0 26px 60px rgba(0,0,0,.18)}
.exam-card__top{display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:13px;letter-spacing:.09em}.badge{color:#0c4c29;background:#bff3cf;border-radius:999px;padding:6px 9px;font-size:10px}.question-line{height:9px;width:65%;background:rgba(255,255,255,.18);border-radius:20px;margin-top:18px}.question-line--wide{width:88%;margin-top:26px}.answers{display:flex;gap:13px;margin-top:24px}.answers span{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.22);border-radius:50%;font-size:12px;font-weight:800;color:#d6e3f2}.answers .selected{background:var(--green);color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(22,163,74,.35)}
.brand-footer{position:absolute;left:clamp(48px,7vw,110px);bottom:34px;color:#8fa8c3;font-size:13px;letter-spacing:.04em}
.login-panel{display:grid;place-items:center;padding:40px;background:linear-gradient(180deg,#fff 0%,#f7f9fc 100%)}
.login-card{width:min(470px,100%);background:#fff;border:1px solid #e9eef5;border-radius:28px;padding:38px 42px 30px;box-shadow:0 25px 70px rgba(12,34,63,.1)}
.logo{display:block;width:136px;height:136px;object-fit:contain;margin:0 auto 22px;border-radius:50%}
.login-heading{text-align:center;margin-bottom:26px}.secure-pill{display:inline-block;color:#17643b;background:#edf9f1;border:1px solid #d7f0df;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:800}.login-heading h2{margin:14px 0 8px;font-size:31px;letter-spacing:-.035em;color:#10233d}.login-heading p{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.alert{margin:0 0 18px;padding:12px 14px;border:1px solid #ffd3d7;background:#fff3f4;color:#a31525;border-radius:12px;font-size:13px;line-height:1.5}
label{display:block;margin:16px 0 8px;font-size:13px;font-weight:700;color:#293b53}.input-wrap{position:relative}.input-wrap input{width:100%;height:54px;border:1px solid var(--line);border-radius:14px;background:#fbfcfe;color:#10233d;padding:0 78px 0 46px;outline:none;transition:.2s ease}.input-wrap input:focus{border-color:#97aac1;background:#fff;box-shadow:0 0 0 4px rgba(11,47,91,.07)}.input-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:20px;height:20px;color:#8ea0b5;font-weight:800;font-size:12px}.toggle-password{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--navy);font-size:12px;font-weight:800;cursor:pointer;padding:8px}.password-row{display:flex;justify-content:space-between;align-items:center}.submit-btn{width:100%;height:56px;margin-top:24px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--red),#d60d27);color:#fff;display:flex;align-items:center;justify-content:center;gap:13px;font-weight:800;cursor:pointer;box-shadow:0 14px 30px rgba(239,35,60,.24);transition:transform .15s ease,box-shadow .15s ease}.submit-btn:hover{transform:translateY(-1px);box-shadow:0 18px 34px rgba(239,35,60,.3)}.submit-btn:active{transform:translateY(0)}
.login-meta{display:flex;justify-content:center;gap:8px;margin-top:24px;color:#9aa9ba;font-size:11px;font-weight:600}
@media (max-width:980px){.auth-shell{grid-template-columns:1fr}.brand-panel{min-height:330px;padding:48px 32px}.brand-copy h1{font-size:44px}.brand-copy p{font-size:15px}.exam-card{display:none}.brand-footer{left:32px;bottom:22px}.login-panel{padding:32px 20px}.login-card{margin-top:-70px;position:relative;z-index:2}}
@media (max-width:560px){.brand-panel{min-height:285px;padding:38px 22px}.brand-copy h1{font-size:36px;margin-top:18px}.brand-copy p{display:none}.brand-footer{left:22px}.login-panel{padding:20px 14px 34px}.login-card{padding:28px 22px 24px;border-radius:24px;margin-top:-54px}.logo{width:114px;height:114px}.login-heading h2{font-size:27px}.login-meta{flex-wrap:wrap}}