:root{color-scheme:light;--bg:#181038;--surface:#fff;--surface-soft:#f3f2f9;--text:#211b3e;--muted:#706983;--line:#e5e1ef;--brand:#b48a20;--brand-strong:#795a0b;--brand-soft:#f7efd4;--gold:#ffcf48;--danger:#b42318;--danger-soft:#fef3f2;--focus:#e6b83b55}
html[data-theme=dark]{color-scheme:dark;--surface:#0d0d2c;--surface-soft:#1a1d43;--text:#f7f6ff;--muted:#a3a1ba;--line:#30274c;--brand:#ffcf48;--brand-strong:#ffcf48;--brand-soft:#27213c;--danger:#ffb4ab;--danger-soft:#3b1f1d;--focus:#ffcf4840}
*,*::before,*::after{box-sizing:border-box}html{min-width:320px;background:var(--bg)}body{margin:0;font:15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.skip-link{position:fixed;left:1rem;top:-4rem;z-index:50;padding:.7rem 1rem;background:#ffcf48;color:#17122e;border-radius:8px}.skip-link:focus{top:1rem}
.page-shell{min-height:100vh;min-height:100svh}.auth-shell{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(390px,1fr);background:#171038}.campus-panel{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:center;color:#fff;padding:clamp(2rem,5vw,6rem);background:#1c1249 url('../img/login-campus-dusk.png') center right/cover no-repeat}.campus-panel::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(24,5,75,.96) 0%,rgba(25,7,75,.87) 34%,rgba(25,7,75,.4) 72%,rgba(13,13,41,.12) 100%)}.campus-panel::after{content:"";position:absolute;width:125%;height:140%;left:-38%;top:-82%;border:38px solid #7144be55;box-shadow:0 0 0 28px #5825a044,0 0 0 75px #33107455;border-radius:50%;z-index:-1;transform:rotate(-26deg);pointer-events:none}
.campus-header{display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem);position:relative;margin-bottom:2rem}.unipar-wordmark{display:inline-flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0}.brand-emblem{display:block;width:46px;height:46px;overflow:hidden;position:relative;flex:0 0 46px}.brand-emblem img{position:absolute;top:0;left:0;width:46px;height:auto}.wordmark-copy strong{display:block;font-size:23px;font-weight:800;line-height:1.1;letter-spacing:.01em}.wordmark-copy small{display:block;font-size:6.5px;line-height:1.35;letter-spacing:.04em;max-width:140px}.campus-brand{display:flex;align-items:center;gap:12px;font-size:9px;font-weight:750;letter-spacing:.09em;white-space:nowrap;text-transform:uppercase}.campus-brand::before{content:"";width:34px;height:2px;background:#ffcf48}.campus-copy{position:relative;max-width:620px}.campus-copy h1{font-size:clamp(2.35rem,4.2vw,4rem);font-weight:800;line-height:1.02;letter-spacing:-.035em;margin:0}.campus-copy h1 span{color:#ffd447}.campus-copy>p{max-width:30rem;color:#e2dfee;font-size:14px;line-height:1.5;margin:1rem 0 0}.service-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:1.5rem;max-width:610px}.service-point{position:relative;min-height:110px;padding:16px 28px 16px 16px;border:1px solid #7958b76b;border-radius:10px;background:linear-gradient(125deg,#3b1479a6,#251747bb);backdrop-filter:blur(12px);box-shadow:0 7px 18px #08041d25;animation:service-float 5s ease-in-out infinite;transition:background .2s,border-color .2s}.service-point:nth-child(2){animation-delay:.7s}.service-point:nth-child(3){animation-delay:1.4s}.service-point::after{content:'→';position:absolute;right:12px;top:53%;font-size:15px;color:#d7cdeb}.service-point svg{display:block;width:23px;height:23px;color:#ffcf48;margin-bottom:10px}.service-point span{display:block;color:#f1eaff;font-size:11px;font-weight:650;line-height:1.45}.service-point:hover{background:#452578d9;border-color:#c29ae6}.campus-footer{position:relative;display:flex;align-items:center;gap:8px;margin-top:1.6rem;font-size:10px;color:#d2c8e6}.campus-footer svg{width:13px;height:13px;flex:0 0 auto}
.login-panel{display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate;padding:clamp(1.5rem,3.3vw,4rem);background:radial-gradient(ellipse at 100% 100%,#351348 0,transparent 60%),linear-gradient(140deg,#211b50,#110d30 75%);overflow:hidden}.login-panel::before{content:"";position:absolute;right:-25%;bottom:-30%;width:110%;height:85%;border-radius:48%;transform:rotate(-32deg);background:repeating-radial-gradient(ellipse at 0 0,transparent 0 15px,#a2783733 16px,transparent 17px);z-index:-1;pointer-events:none}.login-content{width:min(100%,430px);position:relative;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:clamp(1.5rem,3vw,2.7rem);box-shadow:0 20px 55px #07051c33}.login-wordmark{margin:0 0 1.5rem;color:var(--text)}.login-wordmark .wordmark-copy strong{font-size:26px}.login-wordmark .wordmark-copy small{font-size:7px;max-width:220px}.login-wordmark .brand-emblem{width:48px;height:48px;flex-basis:48px}.login-wordmark .brand-emblem img{width:48px}.brand-logo-dark{display:none}html[data-theme=dark] .brand-logo-light{display:none}html[data-theme=dark] .brand-logo-dark{display:block}.theme-switcher{position:absolute;right:14px;top:12px;display:flex;gap:2px;padding:4px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);z-index:3}.theme-button{width:27px;height:27px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;color:var(--muted);background:transparent;cursor:pointer}.theme-button[aria-pressed=true]{color:var(--brand-strong);background:var(--surface)}.theme-button svg{width:13px;height:13px}.login-heading h2{font-size:26px;font-weight:750;line-height:1.2;letter-spacing:-.03em;margin:0}.login-heading p{font-size:12px;line-height:1.55;color:var(--muted);margin:9px 0 0}.login-form{margin-top:22px}.form-group+.form-group{margin-top:15px}.form-label{display:block;margin-bottom:6px;color:var(--text);font-size:12px;font-weight:650}.input-wrap{position:relative}.form-control{width:100%;min-height:43px;padding:10px 40px 10px 37px;border:1px solid var(--line);border-radius:7px;color:var(--text);background:var(--surface-soft);font-size:12px;outline:0}.form-control:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--focus)}.form-control::placeholder{color:var(--muted)}.input-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--muted);pointer-events:none}.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:5px;background:transparent;color:var(--muted);cursor:pointer}.password-toggle svg{width:14px;height:14px}.eye-off{display:none}.password-toggle.is-visible .eye-off{display:block}.password-toggle.is-visible .eye-on{display:none}.field-error{display:none;margin:5px 0 0;font-size:11px;color:var(--danger)}.input-wrap.has-error+.field-error{display:block}.form-control[aria-invalid=true]{border-color:var(--danger)}.form-link{display:block;width:fit-content;margin:10px 0 0 auto;color:var(--brand-strong);font-size:10px;font-weight:750;text-decoration:none}.form-link:hover{text-decoration:underline}.form-link--back{margin:1rem auto 0}.submit-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:44px;margin-top:18px;padding:10px 15px;border:1px solid #f5ca54;border-radius:9px;background:linear-gradient(100deg,#ffda50,#ffb545);box-shadow:0 3px 14px #ffcc3c20;color:#201c31;font-size:12px;font-weight:800;cursor:pointer}.submit-button:hover{filter:brightness(1.05)}.submit-button:disabled{opacity:.65;cursor:wait}.submit-button svg{width:16px;height:16px}.secure-note{display:flex;align-items:center;justify-content:center;gap:5px;margin:13px 0 0;color:var(--muted);font-size:8.5px;line-height:1.5}.secure-note svg{width:12px;height:12px;flex:0 0 auto;color:var(--brand-strong)}.copyright{margin-top:19px;padding-top:13px;border-top:1px solid var(--line);text-align:center;color:var(--muted);font-size:8px}.mobile-contact{display:none}.alert{padding:10px 12px;margin-top:15px;border:1px solid var(--danger);border-radius:7px;background:var(--danger-soft);color:var(--danger);font-size:12px;display:flex;gap:8px}.alert svg{width:17px;height:17px;flex-shrink:0}.alert--success{color:#236340;background:#ecf8f0;border-color:#a8dbc0}
@keyframes service-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(min-width:1400px){.campus-panel{padding-left:8vw;padding-right:5vw}.login-panel{padding:4vw}.login-content{width:min(100%,460px)}}
@media(max-width:1100px) and (min-width:801px){.campus-panel{padding:2rem}.campus-header{gap:15px}.campus-brand{font-size:7px;gap:7px}.campus-brand::before{width:20px}.wordmark-copy strong{font-size:20px}.service-points{gap:9px}.service-point{padding:12px 23px 12px 12px}.service-point span{font-size:10px}.login-panel{padding:22px}.login-content{padding:28px}.campus-copy h1{font-size:clamp(2.2rem,4.2vw,3rem)}}
@media(max-width:800px){.auth-shell{grid-template-columns:1fr;min-height:100svh}.campus-panel{min-height:420px;padding:2rem clamp(1.25rem,7vw,3.5rem);background-position:70% center}.campus-header{margin-bottom:1.5rem;justify-content:space-between}.campus-copy h1{font-size:clamp(2.2rem,7vw,3.2rem)}.campus-copy>p{font-size:12px;max-width:26rem}.service-points{max-width:510px;margin-top:20px;gap:10px}.service-point{min-height:96px;padding:12px 24px 12px 12px}.service-point span{font-size:10px}.campus-footer{font-size:9px;margin-top:18px}.login-panel{padding:26px 18px 34px}.login-content{width:min(100%,460px);padding:30px}.login-wordmark{margin-top:10px}.theme-switcher{right:10px;top:10px}.login-heading h2{font-size:25px}.form-control{min-height:46px;font-size:14px}.submit-button{min-height:46px;font-size:13px}.form-label{font-size:12px}.form-link{font-size:11px}.secure-note{font-size:9px}.copyright{font-size:9px}}
@media(max-width:400px){.campus-brand{font-size:6.5px;gap:6px}.campus-brand::before{width:18px}.campus-header .wordmark-copy strong{font-size:19px}.campus-header .wordmark-copy small{font-size:5px}.campus-header .brand-emblem{width:35px;height:35px;flex-basis:35px}.campus-header .brand-emblem img{width:35px}.service-points{gap:7px}.service-point{padding:10px 18px 10px 9px;border-radius:8px}.service-point::after{right:6px;font-size:12px}.service-point span{font-size:9px}.login-content{padding:24px}}
@media(prefers-reduced-motion:reduce){.service-point{animation:none;transition:none}}


/* Decorative atmosphere stays behind the content and never intercepts input. */
.login-atmosphere{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;user-select:none;contain:paint}
.campus-header,.campus-copy,.campus-footer,.login-content{z-index:1}
.ambient-lights,.snow-particles{position:absolute;inset:0;pointer-events:none}
.ambient-lights::before,.ambient-lights::after{content:"";position:absolute;pointer-events:none}

/* A warm pool of light on the campus approach, with a slower violet glow. */
.campus-panel .ambient-lights::before{
  left:48%;bottom:-12%;width:64%;height:53%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,201,110,.32),rgba(255,172,79,.09) 43%,transparent 72%);
  filter:blur(18px);transform-origin:70% 90%;animation:campus-light-drift 16s ease-in-out infinite alternate;
}
.campus-panel .ambient-lights::after{
  right:-10%;top:3%;width:60%;height:65%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(164,133,248,.22),transparent 68%);
  filter:blur(22px);animation:campus-sky-glow 21s ease-in-out infinite alternate;
}
.login-panel .ambient-lights::before{
  left:-28%;top:-18%;width:115%;height:80%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(132,88,219,.24),transparent 67%);
  filter:blur(20px);animation:campus-sky-glow 19s -8s ease-in-out infinite alternate;
}
.login-panel .ambient-lights::after{
  right:-30%;bottom:-22%;width:100%;height:75%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(240,187,89,.20),rgba(182,108,107,.08) 45%,transparent 70%);
  filter:blur(22px);animation:campus-light-drift 18s -5s ease-in-out infinite alternate;
}

/* Each full-height track moves one small speck; no canvas or animation library. */
.snow-particles i{
  position:absolute;top:-12px;left:var(--snow-x);height:100%;width:var(--snow-size,3px);
  opacity:0;animation:login-snowfall var(--snow-time,22s) var(--snow-delay,-7s) linear infinite;
}
.snow-particles i::before{
  content:"";position:absolute;top:0;left:0;width:100%;aspect-ratio:1;border-radius:50%;
  background:#fff1d5;box-shadow:0 0 7px 1px rgba(255,222,166,.32);
}
.snow-particles i:nth-child(3n)::before{background:#f9f5ff;box-shadow:0 0 7px rgba(211,194,255,.4)}
.login-panel .snow-particles{opacity:.65}
.login-panel .snow-particles i{animation-direction:reverse}
.snow-particles i:nth-child(1){--snow-x:4%;--snow-size:2px;--snow-time:26s;--snow-delay:-12s}
.snow-particles i:nth-child(2){--snow-x:11%;--snow-size:3px;--snow-time:33s;--snow-delay:-23s}
.snow-particles i:nth-child(3){--snow-x:17%;--snow-size:2px;--snow-time:23s;--snow-delay:-3s}
.snow-particles i:nth-child(4){--snow-x:23%;--snow-size:4px;--snow-time:30s;--snow-delay:-14s}
.snow-particles i:nth-child(5){--snow-x:29%;--snow-size:2px;--snow-time:20s;--snow-delay:-25s}
.snow-particles i:nth-child(6){--snow-x:35%;--snow-size:3px;--snow-time:27s;--snow-delay:-5s}
.snow-particles i:nth-child(7){--snow-x:41%;--snow-size:2px;--snow-time:34s;--snow-delay:-16s}
.snow-particles i:nth-child(8){--snow-x:48%;--snow-size:3px;--snow-time:24s;--snow-delay:-27s}
.snow-particles i:nth-child(9){--snow-x:54%;--snow-size:2px;--snow-time:31s;--snow-delay:-7s}
.snow-particles i:nth-child(10){--snow-x:61%;--snow-size:4px;--snow-time:21s;--snow-delay:-18s}
.snow-particles i:nth-child(11){--snow-x:67%;--snow-size:2px;--snow-time:28s;--snow-delay:-29s}
.snow-particles i:nth-child(12){--snow-x:73%;--snow-size:3px;--snow-time:35s;--snow-delay:-9s}
.snow-particles i:nth-child(13){--snow-x:79%;--snow-size:2px;--snow-time:25s;--snow-delay:-20s}
.snow-particles i:nth-child(14){--snow-x:85%;--snow-size:3px;--snow-time:32s;--snow-delay:-31s}
.snow-particles i:nth-child(15){--snow-x:90%;--snow-size:2px;--snow-time:22s;--snow-delay:-11s}
.snow-particles i:nth-child(16){--snow-x:94%;--snow-size:4px;--snow-time:29s;--snow-delay:-22s}
.snow-particles i:nth-child(17){--snow-x:8%;--snow-size:2px;--snow-time:19s;--snow-delay:-2s}
.snow-particles i:nth-child(18){--snow-x:57%;--snow-size:3px;--snow-time:26s;--snow-delay:-13s}

@keyframes login-snowfall{
  0%{opacity:0;transform:translate3d(-12px,0,0)}
  12%{opacity:.6}75%{opacity:.4}
  100%{opacity:0;transform:translate3d(24px,calc(100% + 24px),0)}
}
@keyframes campus-light-drift{
  from{opacity:.55;transform:translate3d(-4%,0,0) scale(.94)}
  to{opacity:1;transform:translate3d(5%,-5%,0) scale(1.07)}
}
@keyframes campus-sky-glow{
  from{opacity:.5;transform:translate3d(0,-3%,0) scale(.96)}
  to{opacity:.9;transform:translate3d(-5%,4%,0) scale(1.04)}
}
@media(max-width:800px){
  .snow-particles i:nth-child(n+11){display:none}
  .campus-panel .ambient-lights::before{left:42%;width:75%;height:60%}
}
@media(prefers-reduced-motion:reduce){
  .login-atmosphere{display:none}
  .login-atmosphere *,.login-atmosphere *::before,.login-atmosphere *::after{animation:none!important}
}

/* Campus tagline: twice the original desktop and mobile text size. */
.campus-copy{width:100%;max-width:none}
.campus-copy>p{width:100%;max-width:none;font-size:28px;text-wrap:wrap}
@media(max-width:800px){.campus-copy>p{max-width:none;font-size:24px}}