.auth-stage {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 28px 0 52px;
    background:
        radial-gradient(ellipse at 3% 22%, rgba(15,127,255,.10), transparent 33%),
        radial-gradient(ellipse at 96% 85%, rgba(42,182,255,.10), transparent 30%),
        linear-gradient(145deg, #f1f7ff 0%, #f9fbff 52%, #edf5ff 100%);
}
.auth-stage::before,
.auth-stage::after {
    position: absolute;
    z-index: -1;
    width: 310px;
    height: 310px;
    border: 1px solid rgba(19,112,222,.08);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}
.auth-stage::before { top: -210px; left: -160px; box-shadow: 0 0 0 35px rgba(20,110,225,.025),0 0 0 75px rgba(20,110,225,.02); }
.auth-stage::after { right: -230px; bottom: -190px; box-shadow: 0 0 0 42px rgba(20,110,225,.025),0 0 0 85px rgba(20,110,225,.02); }
.auth-shell { display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; align-items: stretch; }
.auth-card {
    position: relative;
    z-index: 1;
    min-width: 0;
    padding: 23px 20px 20px;
    border: 1px solid rgba(218,230,246,.95);
    border-radius: 25px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 52px rgba(12,49,97,.09),0 2px 5px rgba(12,49,97,.035);
    animation: auth-card-in .55s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes auth-card-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.auth-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:24px; }
.auth-mark { display:grid; place-items:center; flex:0 0 50px; width:50px; height:50px; border-radius:17px; background:linear-gradient(145deg,#e8f3ff,#d7eaff); color:#0969e8; font-size:24px; }
.auth-trust { display:flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid #e3ecf8; border-radius:999px; background:#f7faff; color:#526a88; font-size:10px; font-weight:750; line-height:1.2; }
.auth-trust .material-symbols-outlined { color:#0872ed; font-size:15px; }
.auth-card > .eyebrow { margin:0 0 8px; font-size:.69rem; letter-spacing:.16em; }
.auth-card h1 { margin:0; color:#0b2d5a; font-size:clamp(2rem,8vw,2.8rem); line-height:1.08; letter-spacing:-.055em; text-wrap:balance; }
.auth-lead { max-width:44ch; margin:11px 0 23px; color:#62758e; font-size:.91rem; line-height:1.65; }
.auth-form { display:grid; gap:17px; }
.auth-field { display:grid; min-width:0; gap:7px; }
.auth-field > label,.auth-label-row label { color:#233d60; font-size:.79rem; font-weight:750; }
.auth-label-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.auth-label-row > a { font-size:.75rem; font-weight:750; }
.auth-input { display:flex; align-items:center; min-width:0; min-height:55px; padding:0 12px; border:1px solid #d4e0ef; border-radius:15px; background:#fbfdff; box-shadow:0 1px 2px rgba(11,45,90,.02); transition:border-color .18s,background .18s,box-shadow .18s,transform .18s; }
.auth-input:hover { border-color:#a9c5e8; background:#fff; }
.auth-input:focus-within { transform:translateY(-1px); border-color:#2682f2; background:#fff; box-shadow:0 0 0 4px rgba(16,112,232,.11),0 5px 16px rgba(16,86,167,.06); }
.auth-input > .material-symbols-outlined { flex:0 0 auto; margin-right:9px; color:#7890ad; font-size:20px; }
.auth-input input { display:block; width:100%; min-width:0; height:52px; padding:0 2px; border:0!important; outline:0!important; background:transparent!important; box-shadow:none!important; color:#172f50; font:500 .88rem/1.3 'DM Sans',Arial,sans-serif; }
.auth-input input::placeholder { color:#98a8bb; font-weight:400; opacity:1; }
.auth-input input:focus { box-shadow:none!important; }
.auth-password-toggle { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; margin-left:4px; border:0; border-radius:12px; background:transparent; color:#70839c; transition:background .15s,color .15s; }
.auth-password-toggle:hover { background:#edf4ff; color:#0969e8; }
.auth-password-toggle .material-symbols-outlined { font-size:19px; }
.auth-help { color:#7a8ca3; font-size:.71rem; line-height:1.45; }
.auth-submit { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:56px; margin-top:3px; padding:0 17px 0 20px; border:0; border-radius:16px; background:linear-gradient(105deg,#0878fa,#0759d6); color:#fff; box-shadow:0 10px 22px rgba(6,100,222,.19); font-size:.88rem; font-weight:800; transition:transform .18s,box-shadow .18s,filter .18s; }
.auth-submit:hover { transform:translateY(-2px); box-shadow:0 14px 28px rgba(6,100,222,.26); color:#fff; filter:saturate(1.08); }
.auth-submit:active { transform:translateY(0); }
.auth-submit .material-symbols-outlined { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(255,255,255,.22); border-radius:12px; background:rgba(255,255,255,.12); font-size:19px; }
.auth-alert { display:flex; align-items:flex-start; gap:10px; margin:-5px 0 18px; padding:12px 13px; border:1px solid #f3c7c5; border-radius:14px; background:#fff6f5; color:#9a302c; font-size:.8rem; line-height:1.5; animation:auth-card-in .24s ease both; }
.auth-alert .material-symbols-outlined { flex:0 0 auto; font-size:19px; }
.auth-switch { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:4px; margin:20px 0 0; color:#657890; font-size:.82rem; }
.auth-switch a { display:inline-flex; align-items:center; gap:3px; color:#075fdb; font-weight:800; }
.auth-switch a .material-symbols-outlined { font-size:16px; transition:transform .16s; }
.auth-switch a:hover .material-symbols-outlined { transform:translateX(3px); }
.auth-privacy { display:flex; align-items:flex-start; justify-content:center; gap:6px; margin:14px 0 0; color:#8392a6; font-size:.68rem; line-height:1.5; text-align:center; }
.auth-privacy .material-symbols-outlined { flex:0 0 auto; color:#3282dc; font-size:15px; }
.auth-visual { position:relative; isolation:isolate; display:flex; min-height:230px; overflow:hidden; align-items:flex-end; padding:24px 21px; border:1px solid rgba(255,255,255,.5); border-radius:25px; background:#092d62; color:#fff; box-shadow:0 18px 45px rgba(9,43,92,.17); }
.auth-visual::before { position:absolute; z-index:-2; inset:0; background:url('../images/homepage-students-classroom.jpg') center 40%/cover; content:""; transition:transform .65s cubic-bezier(.2,.8,.2,1); }
.auth-visual::after { position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(4,24,54,.08) 0%,rgba(4,28,67,.42) 40%,rgba(4,28,67,.96) 100%); content:""; }
.auth-visual:hover::before { transform:scale(1.035); }
.auth-visual-content { position:relative; z-index:1; width:min(100%,520px); }
.auth-visual-label { display:inline-flex; align-items:center; gap:7px; margin-bottom:13px; padding:7px 10px; border:1px solid rgba(255,255,255,.24); border-radius:999px; background:rgba(7,49,104,.42); color:#d7edff; font-size:.62rem; font-weight:850; letter-spacing:.14em; backdrop-filter:blur(8px); }
.auth-visual-label .material-symbols-outlined { color:#56b9ff; font-size:16px; }
.auth-visual h2 { max-width:540px; margin:0 0 9px; color:#fff; font-size:clamp(1.6rem,5vw,2.35rem); line-height:1.1; letter-spacing:-.045em; text-wrap:balance; }
.auth-visual-content > p { max-width:48ch; margin:0; color:#e1edfa; font-size:.84rem; line-height:1.65; }
.auth-visual-points { display:grid; gap:9px; margin-top:18px; }
.auth-visual-points > div { display:flex; align-items:center; gap:9px; color:#edf5ff; font-size:.77rem; font-weight:650; }
.auth-visual-points .material-symbols-outlined { color:#69c1ff; font-size:18px; }
.auth-visual-orb { position:absolute; top:22px; right:22px; display:grid; place-items:center; width:47px; height:47px; border:1px solid rgba(255,255,255,.21); border-radius:16px; background:rgba(7,48,104,.34); color:#a8dfff; backdrop-filter:blur(8px); animation:auth-orb-float 4.5s ease-in-out infinite; }
.auth-visual-orb .material-symbols-outlined { font-size:24px; }
@keyframes auth-orb-float { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-7px) rotate(3deg); } }
.auth-optional { margin-left:5px; color:#8494a9; font-size:.67rem; font-weight:600; white-space:nowrap; }
.auth-register-form { grid-template-columns:minmax(0,1fr); }
.auth-field-wide,.auth-consent,.auth-register-form > .auth-submit { grid-column:1/-1; }
.auth-consent { display:flex; align-items:flex-start; gap:10px; color:#60738d; font-size:.74rem; line-height:1.55; }
.auth-consent input { flex:0 0 auto; width:18px; height:18px; margin:2px 0 0; accent-color:#0875ef; }
.auth-consent a { color:#075fdb; font-weight:750; text-decoration:underline; text-underline-offset:2px; }
.auth-strength { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }
.auth-strength span { height:4px; border-radius:99px; background:#e6ebf3; transition:background .2s; }
.auth-strength[data-level="1"] span:nth-child(-n+1) { background:#f17a64; }
.auth-strength[data-level="2"] span:nth-child(-n+2) { background:#f1b64e; }
.auth-strength[data-level="3"] span:nth-child(-n+3) { background:#48a7e8; }
.auth-strength[data-level="4"] span:nth-child(-n+4) { background:#28ad7a; }
@media (min-width:620px) {
    .auth-stage { padding:42px 0 64px; }
    .auth-shell { width:min(100% - 48px,1060px); grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:22px; }
    .auth-card { padding:30px 27px 25px; }
    .auth-visual { min-height:100%; padding:28px 24px; }
    .auth-visual-points { gap:11px; }
    .auth-register-form { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:13px; row-gap:16px; }
}
@media (min-width:980px) {
    .auth-stage { padding-block:58px 74px; }
    .auth-shell { width:min(100% - 64px,1090px); grid-template-columns:minmax(0,1.02fr) minmax(400px,.98fr); gap:30px; }
    .auth-card { padding:38px 40px 32px; border-radius:28px; }
    .auth-card-top { margin-bottom:29px; }
    .auth-visual { min-height:610px; padding:38px 34px; border-radius:28px; }
    .auth-visual-orb { top:29px; right:29px; width:54px; height:54px; }
}
@media (max-width:370px) {
    .auth-card { padding:20px 16px 18px; }
    .auth-trust { max-width:190px; font-size:9px; }
    .auth-card-top { gap:7px; }
}
@media (max-width:619px) {
    .auth-form-page .neom-ai { display:none; }
}
@media (prefers-reduced-motion:reduce) {
    .auth-card,.auth-visual-orb { animation:none; }
    .auth-input,.auth-submit,.auth-password-toggle,.auth-visual::before { transition:none; }
}