html,body{min-height:100%;margin:0}
body:has(#illustratedLogin){padding:0!important;background:#e8f7ff!important;display:block!important}
body:has(#illustratedLogin)::before,body:has(#illustratedLogin)::after{display:none!important}
#illustratedLogin{width:100%;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#d9f3ff}
#illustratedLogin .artboard{width:min(100vw,calc(100dvh * 1672 / 941));aspect-ratio:1672/941;position:relative;overflow:hidden;flex:none}
#illustratedLogin .artwork{display:block;width:100%;height:100%;object-fit:contain}
#illustratedLogin .overlay-form{position:absolute;top:0;width:24%;height:100%;margin:0}
#illustratedLogin .teacher{left:22.7%}#illustratedLogin .admin{left:52.7%}
#illustratedLogin input{position:absolute;left:0;width:100%;height:5.85%;border:0!important;border-radius:14px!important;padding:0 4% 0 12%;background:rgba(255,255,255,.94);font-size:clamp(12px,1.3vw,20px);box-shadow:0 2px 8px #365a6520}
#illustratedLogin input[type=email]{top:62.9%}#illustratedLogin input[type=password]{top:69.9%}
#illustratedLogin .overlay-form button{position:absolute;left:0;top:77.0%;width:100%;height:8.5%;border:0!important;border-radius:32px!important;background:transparent!important;color:transparent!important;cursor:pointer}
#illustratedLogin .overlay-form button:focus-visible{outline:5px solid #003c8d;outline-offset:3px}
#illustratedLogin .login-tools{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;padding:10px 14px;background:#e9f8ff;width:100%}
#illustratedLogin .login-tools button{background:#fff;border:2px solid #8eb5d9;border-radius:18px;padding:9px 15px;font-size:15px;color:#154b80;cursor:pointer}
#illustratedLogin .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
body:has(#illustratedLogin)>.legacy-login-overlay.legacy-visible{display:block!important;margin:20px auto}
@media(max-width:720px){#illustratedLogin{justify-content:flex-start}#illustratedLogin .artboard{width:100vw}#illustratedLogin input{font-size:11px;height:7%;padding-left:4%}#illustratedLogin input[type=email]{top:62%}#illustratedLogin input[type=password]{top:70%}#illustratedLogin .overlay-form button{top:78%}#illustratedLogin .login-tools button{font-size:13px}}

#illustratedLogin .overlay-form select{position:absolute;left:0;top:62.9%;width:100%;height:5.85%;border:0;border-radius:14px;background:rgba(255,255,255,.97);color:#205276;font-size:clamp(12px,1.3vw,20px);padding:0 4%}
#illustratedLogin #teacherPin{top:69.9%}
#illustratedLogin .class-remember{position:absolute;top:86%;left:0;width:100%;display:flex;gap:8px;justify-content:center;align-items:center;font-size:clamp(11px,1vw,15px);color:#165d35;font-weight:bold;white-space:nowrap}
#illustratedLogin .class-remember input{position:static;width:18px;height:18px;flex:none;box-shadow:none;accent-color:#28a54d}