/* Calm depth, crisp typography, and one dedicated password control. */
.school-auth-panel{isolation:isolate;perspective:1200px;overflow:hidden}
.school-auth-panel:before{content:"";position:absolute;z-index:-1;width:360px;height:360px;right:-180px;top:10%;border-radius:50%;background:radial-gradient(circle,#c5e9ff88,transparent 70%);animation:auth-drift 12s ease-in-out infinite alternate;pointer-events:none}
.school-auth-form{animation:auth-arrive .65s cubic-bezier(.2,.75,.25,1) both}
.school-auth-logo{transform:perspective(800px) rotateY(-5deg);transition:transform .4s,box-shadow .4s}
.school-auth-logo:hover{transform:perspective(800px) rotateY(0) translateY(-3px);box-shadow:0 18px 36px #021f3b30}
.school-auth-visual:after{animation:auth-orbit 14s ease-in-out infinite alternate}
.premium-auth .school-auth-form label>div:focus-within{border-color:#198bd4!important;box-shadow:0 0 0 4px #118fe314!important}
.school-auth-form label>div>svg{flex-shrink:0}
.premium-auth .school-auth-form .password-field{position:relative!important;display:flex!important;align-items:center;min-height:52px}
.premium-auth .school-auth-form .password-field input{min-width:0;padding-right:62px!important;letter-spacing:normal}
.premium-auth .school-auth-form .password-field:not(:has(.password-leading-icon)) input{padding-left:16px!important}
.premium-auth .school-auth-form .password-field .password-toggle{display:grid!important;place-items:center;right:8px!important;padding:0!important;border:0!important;border-radius:9px;background:transparent!important;color:#53748f;cursor:pointer;line-height:1}
.premium-auth .school-auth-form .password-toggle svg{position:static!important;width:20px!important;height:20px!important;margin:0!important;transform:none!important;stroke-width:1.8}
.premium-auth .school-auth-form .password-toggle:hover{background:#eaf4fc!important;color:#0877c0}
.password-toggle:focus-visible,.school-auth-forgot:focus-visible{outline:2px solid #118fe3;outline-offset:3px}
.premium-auth .password-field input::-ms-reveal,.premium-auth .password-field input::-ms-clear{display:none}
.school-auth-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px}
.school-auth-forgot{color:#0868ae;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.school-auth-forgot:hover{text-decoration:underline;text-underline-offset:4px}
.school-auth-submit{position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s,background .25s}
.school-auth-submit:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff20 48%,transparent 65%);transform:translateX(-120%);transition:transform .7s;pointer-events:none}
.school-auth-submit:hover:after{transform:translateX(120%)}
.school-auth-submit:hover{box-shadow:0 16px 30px #053d6f35}
.school-auth-submit:active{transform:translateY(1px)}
.auth-recovery-symbol{width:60px;height:60px;display:grid;place-items:center;margin-bottom:24px;border:1px solid #d9ebf9;border-radius:18px;background:linear-gradient(145deg,#fff,#dcedfa);box-shadow:6px 8px 0 #e8f2fa,0 16px 30px #0b589815;transform:perspective(700px) rotateY(-12deg) rotateX(8deg)}
.auth-recovery-symbol svg{width:27px;height:27px;color:#0879cc}
.auth-notice{position:fixed;z-index:30;top:16px;left:50%;transform:translateX(-50%);width:max-content;max-width:min(580px,calc(100% - 28px));padding:16px 20px;border:1px solid #a6d4bf;border-radius:12px;background:#effaf4;color:#235840;box-shadow:0 10px 32px #062f5920;font-size:14px;line-height:1.5}
@keyframes auth-arrive{from{opacity:0;transform:translateY(18px) rotateX(3deg)}to{opacity:1;transform:none}}
@keyframes auth-drift{to{transform:translate(-45px,65px) scale(1.2)}}
@keyframes auth-orbit{to{transform:translate(-20px,-25px) scale(1.06)}}
@media(max-width:560px){.school-auth-options{gap:8px}.school-auth-forgot{font-size:12px}.premium-auth .school-auth-options .school-auth-check{font-size:12px!important}.auth-recovery-symbol{margin:0 auto 24px}.recovery-form .school-auth-heading h1{font-size:34px!important}}
@media(prefers-reduced-motion:reduce){.school-auth-form,.school-auth-panel:before,.school-auth-visual:after{animation:none}.school-auth-logo,.school-auth-submit,.school-auth-submit:after{transition:none}.auth-recovery-symbol{transform:none}}
.password-toggle::before,.password-toggle::after{content:none!important;display:none!important}
.dual-otp-form.email-only-otp{grid-template-columns:1fr}.google-otp-guide a{color:#0879cc;text-decoration:underline;text-underline-offset:3px}
/* Chrome autofill otherwise paints a blue rectangle inside the white field. */
.premium-auth .school-auth-form input:-webkit-autofill,
.premium-auth .school-auth-form input:-webkit-autofill:hover,
.premium-auth .school-auth-form input:-webkit-autofill:focus,
.premium-auth .school-auth-form input:-webkit-autofill:active{
    -webkit-box-shadow:0 0 0 1000px #fff inset!important;
    box-shadow:0 0 0 1000px #fff inset!important;
    -webkit-text-fill-color:#0c3154!important;
    caret-color:#0c3154;
    transition:background-color 9999s ease-out 0s;
}

/* Premium OTP verification screen */
.school-verify-page{display:grid;place-items:center;min-height:100vh;padding:28px 16px;background:linear-gradient(160deg,#eef7ff 0%,#f8fbff 45%,#e3f0fb 100%);font-family:"DM Sans",Arial,sans-serif}
.school-verify-page>section{width:min(100%,460px);padding:34px clamp(20px,5vw,38px) 30px;border:1px solid #cfe3f3;border-radius:22px;background:#fff;box-shadow:0 26px 60px rgba(6,47,89,.14);text-align:center}
.school-verify-page .verify-logo{display:block;margin:0 auto 22px}
.school-verify-page .verify-logo img{display:block;width:min(190px,62%);margin:0 auto}
.school-verify-page .verify-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 18px;border-radius:50%;background:#eaf5ff;color:#0877c4;box-shadow:0 0 0 6px rgba(234,245,255,.65)}
.school-verify-page .verify-icon svg{width:28px;height:28px}
.school-verify-page>section>span{display:block;color:#0877c4;font:800 10px/1 "DM Sans",Arial,sans-serif;letter-spacing:.2em}
.school-verify-page h1{margin:12px 0 8px;font:800 clamp(25px,5vw,31px)/1.15 "DM Sans",Arial,sans-serif;letter-spacing:-.035em;color:#062f59}
.school-verify-page>section>p{max-width:330px;margin:0 auto;color:#5b7a93;font-size:14px;line-height:1.6}
.school-verify-page .dev-otp-note{margin:20px 0 0;padding:12px 14px;border:1px dashed #e8c766;border-radius:12px;background:#fffaec;color:#8a6516;font-size:12px}
.school-verify-page .dev-otp-note b{display:block;font-size:12px}
.school-verify-page .dual-otp-form{display:grid;gap:14px;margin-top:22px;text-align:left}
.school-verify-page .dual-otp-form label{display:grid;gap:4px;padding:16px;border:1px solid #d7e7f2;border-radius:15px;background:#f8fbfe}
.school-verify-page .dual-otp-form label b{display:flex;align-items:center;gap:8px;color:#062f59;font:700 14px "DM Sans",Arial,sans-serif}
.school-verify-page .dual-otp-form label b svg{width:18px;height:18px;color:#0877c4}
.school-verify-page .dual-otp-form label small{color:#6d8ba6;font-size:12px;overflow-wrap:anywhere}
.school-verify-page .dual-otp-form input{width:100%;height:58px;margin-top:8px;padding:0 14px;border:1px solid #cfe2ef;border-radius:12px;background:#fff;color:#062f59;font:800 24px/1 ui-monospace,"DM Sans",monospace;letter-spacing:.42em;text-align:center;text-indent:.42em}
.school-verify-page .dual-otp-form input::placeholder{color:#c3d6e5;letter-spacing:.42em}
.school-verify-page .dual-otp-form input:focus{border-color:#0877c4;outline:0;box-shadow:0 0 0 4px rgba(8,127,229,.14)}
.school-verify-page .dual-otp-form>button{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:54px;margin-top:4px;border:0;border-radius:13px;background:#ffd229;color:#062f59;font:800 15px "DM Sans",Arial,sans-serif;cursor:pointer;box-shadow:0 14px 28px rgba(4,30,56,.18);transition:background .2s,transform .2s}
.school-verify-page .dual-otp-form>button:hover{background:#f4c516;transform:translateY(-1px)}
.school-verify-page .dual-otp-form>button svg{width:18px;height:18px}
.school-verify-page .verify-resends{display:grid;gap:10px;margin-top:16px}
.school-verify-page .verify-resends button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;border:1px solid #d7e7f2;border-radius:12px;background:#fff;color:#075889;font:700 13px "DM Sans",Arial,sans-serif;cursor:pointer}
.school-verify-page .verify-resends button:hover{border-color:#9fcdea;background:#f3f9ff}
.school-verify-page .verify-resends svg{width:16px;height:16px}
.school-verify-page .verify-change{display:inline-block;margin-top:18px;color:#6d8ba6;font-size:13px;text-decoration:none}
.school-verify-page .verify-change:hover{color:#0877c4}
