/* Login design v11. Does not modify authentication behavior. */
.auth{min-height:100svh;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);background:#f7f9f8;isolation:isolate;overflow:hidden}
.auth .auth-hero{position:relative;min-height:100svh;padding:clamp(27px,4.5vw,74px);display:flex;flex-direction:column;justify-content:space-between;background:#0c2f35;color:white;overflow:hidden}
.auth .auth-hero:after{display:none}
.auth-photo{position:absolute;inset:0;background:linear-gradient(105deg,rgba(5,33,40,.94),rgba(7,43,48,.66) 55%,rgba(5,33,40,.34)),url('school-campus-art.jpg') center 43% / cover no-repeat;transform:scale(1.08);animation:campusFloat 20s ease-in-out infinite alternate;z-index:-1}
.auth .auth-hero-mark{margin:0;gap:13px;animation:riseIn .8s both}
.auth .auth-hero-mark .brandmark{width:80px;height:80px;border:1px solid #ffffff70;box-shadow:0 15px 25px #061c2225;background:#fff;border-radius:20px;animation:logoBreathe 5.2s ease-in-out infinite}
.auth .auth-hero-mark strong{font-size:clamp(15px,1.25vw,20px);line-height:1.7}
.auth .auth-hero-mark small{color:#d9ebe8;font-size:12px}
.auth-hero-content{position:relative;max-width:650px;margin:70px 0 50px;animation:riseIn 1.2s .15s both}
.auth-hero-kicker{display:flex;align-items:center;gap:11px;font-size:14px;color:#ecdbbb;font-weight:700}
.auth-hero-kicker i{width:34px;height:2px;background:#dcb976;display:inline-block}
.auth .auth-hero h1{font-size:clamp(34px,3.45vw,59px);line-height:1.65;letter-spacing:-.8px;margin:25px 0 16px;font-weight:800}
.auth .auth-hero h1 em{color:#efd4a2;font-style:normal}
.auth .auth-hero p{font-size:clamp(14px,1.08vw,17px);color:#edf6f3;line-height:2.1;max-width:570px}
.auth-feature-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:32px}
.auth-feature-list>div{display:flex;align-items:center;gap:8px;padding:11px 13px;border:1px solid #ffffff53;background:#ffffff16;backdrop-filter:blur(12px);border-radius:13px;font-size:12px;font-weight:700}
.auth-feature-list span{color:#e1bc72;font-size:11px}
.auth-photo-caption{position:relative;display:flex;align-items:center;gap:10px;font-size:12px;color:#e3f0ea;background:#09262b80;backdrop-filter:blur(8px);padding:11px 14px;border-radius:13px;align-self:start;animation:riseIn .9s .3s both}
.auth-photo-caption small{color:#cddfdb;border-right:1px solid #ffffff60;padding-right:10px}
.auth-dot{background:#debd77;width:7px;height:7px;border-radius:50%;box-shadow:0 0 0 4px #d6bb6b35}
.auth .auth-panel{background:radial-gradient(circle at 50% 0%,#f8f0e2 0%,#f8faf9 35%,#ecf4f1 100%);padding:40px clamp(22px,4vw,70px) 30px;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:100svh;position:relative}
.auth .auth-panel:before{content:'';position:absolute;width:400px;height:400px;border-radius:50%;border:1px solid #bdd3c750;bottom:-220px;left:-170px;pointer-events:none}
.auth .login-card{position:relative;width:min(100%,520px);max-width:520px;background:rgba(255,255,255,.94);padding:clamp(26px,3vw,48px);border:1px solid #ffffff;box-shadow:0 30px 90px #1b454523,0 5px 25px #1b454514;border-radius:28px;animation:cardEnter .9s .1s both}
.auth-card-header{display:flex;align-items:center;gap:16px}
.auth .login-card .brandmark{width:76px;height:76px;border-radius:17px;background:white;border:1px solid #dae8e1;box-shadow:0 4px 14px #164d4a10;flex-shrink:0;animation:logoBreathe 6s ease-in-out infinite}
.auth .login-card .brandmark img{padding:5px}
.auth-card-wordmark{display:flex;flex-direction:column;gap:5px}
.auth-card-wordmark strong{font-size:15px;color:#113b37;line-height:1.6}
.auth-card-wordmark small{color:#72817c;font-size:12px}
.auth-card-rule{border-top:1px solid #e8efeb;margin:24px 0}
.auth-badge{font-size:11px;font-weight:700;letter-spacing:.2px;color:#956f34;background:#f9f3e7;border:1px solid #f0dfbc;padding:7px 12px;border-radius:50px;display:inline-flex}
.auth .login-card h2{font-size:clamp(23px,2.1vw,32px);margin:15px 0 6px;color:#123e39}
.auth-intro{font-size:13px;line-height:1.9;color:#70807b;margin:0 0 20px}
.auth .login-card label{color:#314f48;margin:16px 0 8px;font-size:13px}
.auth-input-wrap{position:relative;display:flex;align-items:center}
.auth-input-wrap>svg{position:absolute;right:14px;width:18px;height:18px;fill:none;stroke:#87a59b;stroke-width:1.7;pointer-events:none}
.auth-input-wrap input{height:53px;border-radius:12px;padding:12px 43px 12px 58px;background:#f9fcfa;border:1px solid #d8e7e0;font-size:13px;transition:box-shadow .2s,border-color .2s}
.auth-input-wrap input:focus{background:white;border-color:#4d9487;box-shadow:0 0 0 4px #387c6a18}
.auth-eye{position:absolute;left:11px;background:transparent;border:0;color:#4a756b;font-size:11px;font-weight:700;padding:7px;cursor:pointer}
.auth .login-card .error{min-height:17px;margin:8px 0 0}
.auth .auth-submit{background:linear-gradient(115deg,#145b54,#113d3a);height:53px;width:100%;border-radius:12px;margin-top:14px;box-shadow:0 8px 20px #155c5430;transition:transform .2s,box-shadow .2s;display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px}
.auth .auth-submit:hover{transform:translateY(-2px);box-shadow:0 12px 27px #155c5448}
.auth-help{display:flex;gap:8px;align-items:start;margin-top:22px;padding:13px 14px;background:#f1f7f4;border:1px solid #e0eee7;border-radius:12px;color:#537066;font-size:12px;line-height:1.9}
.auth-card-footer{text-align:center;color:#9eaaa5;font-size:11px;margin-top:20px}
.auth-panel-footer{font-size:11px;color:#82928c;margin-top:26px;text-align:center}
@keyframes campusFloat{from{transform:scale(1.08) translate(0,0)}to{transform:scale(1.18) translate(-1%,1%)}}
@keyframes cardEnter{from{opacity:0;transform:translateY(25px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes riseIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes logoBreathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:1000px){.auth{grid-template-columns:1fr 1fr}.auth .auth-hero{padding:28px}.auth .auth-panel{padding:25px}.auth-photo-caption small{display:none}}
@media(max-width:760px){.auth{display:flex;flex-direction:column}.auth .auth-hero{min-height:300px;padding:22px 22px 30px}.auth .auth-hero-mark .brandmark{width:60px;height:60px}.auth-hero-content{margin:23px 0 12px}.auth .auth-hero h1{font-size:29px;line-height:1.35;margin:10px 0}.auth .auth-hero p{font-size:13px;line-height:1.7;margin:8px 0}.auth-feature-list{margin-top:15px}.auth-feature-list>div{padding:7px 9px;font-size:10px}.auth-photo-caption{display:none}.auth .auth-panel{min-height:unset;padding:24px 15px 36px}.auth .login-card{max-width:520px;padding:24px;border-radius:20px}}
@media(max-width:420px){.auth .auth-hero h1{font-size:26px}.auth .auth-hero-mark strong{font-size:12px}.auth-feature-list>div{font-size:10px;gap:3px}}
@media(prefers-reduced-motion:reduce){.auth .auth-photo,.auth .brandmark,.auth .auth-hero-mark,.auth .auth-hero-content,.auth .auth-photo-caption,.auth .login-card{animation:none!important}.auth .auth-submit{transition:none}}

.auth-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(5,33,40,.89),rgba(7,43,48,.63)),url("school-campus-detail.jpg") center / cover no-repeat;animation:campusCrossfade 24s ease-in-out infinite;opacity:0}
@keyframes campusCrossfade{0%,42%,100%{opacity:0}57%,86%{opacity:.85}}
@media(prefers-reduced-motion:reduce){.auth-photo:after{animation:none;opacity:0}}
