/* Shared handwritten lettering: existing Kalam Bold asset, SIL OFL 1.1.
   License: https://github.com/google/fonts/blob/main/ofl/kalam/OFL.txt */
@font-face{font-family:'Oiza Lettering';src:url('/client/login/asset?name=font-kalam-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#eef4f7}body{display:flex;justify-content:center;align-items:flex-start;font-family:Arial,Helvetica,sans-serif}.oiza-login-page{width:100%;display:flex;justify-content:center;height:100dvh;min-height:0}.oiza-login20__server-error{margin:0 0 10px;padding:10px 12px;border-radius:12px;background:#fff1f2;color:#9f1239;border:1px solid #fecdd3;font-size:13px;line-height:1.4}.oiza-login20__google-link{text-decoration:none}.oiza-login20__google-disabled{opacity:.55;cursor:not-allowed}.oiza-login20__footer-note{margin:4px 0 0;text-align:center;color:#7890a8;font-size:11px;line-height:1.45}@media(max-width:390px){body{background:#f4fcff}.oiza-login20{box-shadow:none}}

/* Login V20. The approved layout is measured on a 941px artboard.
   Only brand illustrations are raster layers. All text and controls are HTML.
   Outer motion wrappers translate; the inner slogan retains its own rotation. */
.oiza-login20{
 --login-lettering:'Oiza Lettering',Arial,sans-serif;--login-ink:#0d2d50;--login-muted:#5c7695;--login-brand:#008b9c;--login-line:#cbdfee;
 display:grid;grid-template-rows:minmax(0,min(82vw,319.8px)) minmax(max-content,1fr);container-type:inline-size;position:relative;padding:0;width:min(100%,390px);height:100dvh;min-height:0;
 overflow:visible;background:#f4fcff;color:var(--login-ink);box-shadow:0 18px 55px rgba(13,45,80,.10);
 font-family:Arial,Helvetica,sans-serif;scrollbar-width:none;isolation:isolate;
}
.oiza-login20,.oiza-login20 *,.oiza-login20 *::before,.oiza-login20 *::after{box-sizing:border-box}
.oiza-login20 [hidden]{display:none!important}
.oiza-login20 button,.oiza-login20 input{font:inherit;letter-spacing:normal;color:inherit}
.oiza-login20 button{cursor:pointer;-webkit-tap-highlight-color:transparent}
.oiza-login20__hero{position:relative;width:auto;height:100%;aspect-ratio:100/82;max-width:100%;justify-self:center;container-type:inline-size;overflow:visible;z-index:2;pointer-events:none}
.oiza-login20__background{position:absolute;inset:0;z-index:0;overflow:hidden}
.oiza-login20__background svg{display:block;width:100%;height:100%;overflow:visible}
.oiza-login20__logo{position:absolute;left:6.6%;top:5.5%;width:27%;height:auto;z-index:3;display:block}
/* The 555px-wide artwork has 17px of transparent/antialiased bottom padding. */
.oiza-login20__character{position:absolute;left:39.32%;bottom:calc(-60.4cqw * 17 / 555);width:60.4%;z-index:2}
.oiza-login20__character img{display:block;width:100%;height:auto;max-width:none}
.oiza-login20__slogan{position:absolute;left:6.45%;top:calc(24% + 5.13cqw);width:35.8%;height:26%;z-index:3}
.oiza-login20__slogan-inner{position:relative;width:100%;height:100%;border-radius:3.7cqw;transform:rotate(-9deg);
 background:linear-gradient(140deg,#f3fcfeeb,#f8fdffdf);box-shadow:0 2cqw 4cqw #a6d7df14;
 display:flex;align-items:center;justify-content:center;padding:1.3cqw 1.4cqw 3.6cqw}
.oiza-login20__slogan p{margin:0;color:#008699;font-family:var(--login-lettering);font-size:4.45cqw;line-height:1.13;font-weight:700;font-style:normal;letter-spacing:-.13cqw;text-align:center;transform:translateY(1.2cqw) skewX(-2deg)}
.oiza-login20__slogan p span{display:block;white-space:nowrap}
.oiza-login20__slogan-heart{position:absolute;width:9cqw;height:6.2cqw;bottom:-.6cqw;right:-1cqw;transform:rotate(9deg);overflow:visible;color:#008b9c}
.oiza-login20__slogan-heart path{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
/* V27: resize the complete mascot (art + HTML text) through layout, not
   transform: the existing entry animation owns transform. 34.3 = 49 * .70. */
.oiza-login20__mascot{position:absolute;left:4.5%;top:auto;bottom:-3cqw;width:34.3%;z-index:7;filter:drop-shadow(0 2cqw 2.4cqw #123d5520)}
.oiza-login20__mascot img{display:block;width:100%;height:auto;aspect-ratio:604/652}
.oiza-login20__mascot-list{position:absolute;inset:0;margin:0;padding:0;list-style:none;color:#164d6e;font-family:var(--login-lettering);font-size:3.57cqw;font-weight:700;font-style:normal;line-height:1.06;text-align:left;letter-spacing:-.056cqw}
.oiza-login20__mascot-list span{position:absolute;display:block;white-space:nowrap;transform:rotate(-12deg);transform-origin:0 50%}
.oiza-login20__mascot-list span:nth-child(1){left:38%;top:47%}
.oiza-login20__mascot-list span:nth-child(2){left:41%;top:59%}
.oiza-login20__mascot-list span:nth-child(3){left:46%;top:71%}
.oiza-login20__rays{position:absolute;left:89.1%;top:8%;width:8%;height:15%;z-index:4}
.oiza-login20__rays svg,.oiza-login20__mascot-rays svg{width:100%;height:100%;overflow:visible;display:block}
.oiza-login20__rays path{stroke:#00899b;stroke-width:9;stroke-linecap:round;fill:none}
.oiza-login20__mascot-rays{position:absolute;left:2.3%;top:66%;width:3.2%;height:6.2%;z-index:1}
.oiza-login20__mascot-rays path{stroke:#00899b;stroke-width:5;stroke-linecap:round;fill:none}
.oiza-login20__card{position:relative;z-index:1;margin:-10px 2.85cqw 0;padding:clamp(12px,calc(100dvh - 650px),29px) 4.45cqw max(8px,env(safe-area-inset-bottom));min-height:0;background:transparent}
.oiza-login20__card::before{content:'';position:absolute;inset:0;z-index:-1;background:#fff;border-radius:7.2cqw 7.2cqw 0 0}
.oiza-login20__heading{text-align:center;margin:0;padding:0}
.oiza-login20__heading h1{font-family:Arial,Helvetica,sans-serif;font-size:5.7cqw;line-height:1.2;font-weight:700;letter-spacing:-.19cqw;color:#0c2d50;margin:0;white-space:nowrap}
.oiza-login20__heading p{font-size:3.34cqw;line-height:1.22;font-weight:400;letter-spacing:-.015cqw;color:var(--login-muted);margin:1.7cqw auto 0;max-width:100%}
.oiza-login20__copy-break{display:block}
.oiza-login20__form{display:flex;flex-direction:column;margin:2cqw 0 0;gap:0;min-width:0}
.oiza-login20__field{display:block;margin:0 0 2.2cqw;min-width:0}
.oiza-login20__control{display:flex;align-items:center;gap:2.6cqw;width:100%;height:10.7cqw;min-height:42px;padding:0 1cqw 0 3.1cqw;border:1px solid var(--login-line);border-radius:2.5cqw;background:#fff;transition:border-color .16s,box-shadow .16s}
.oiza-login20__control input{display:block;flex:1 1 auto;min-width:0;width:100%;height:100%;min-height:40px;padding:0;border:0;border-radius:0;outline:0!important;box-shadow:none!important;background:transparent;font-size:16px;line-height:1.4;font-weight:400;color:var(--login-ink)}
.oiza-login20__control input::placeholder{color:#627f9f;opacity:1}
.oiza-login20__control>svg{flex:0 0 5.2cqw;display:block;width:5.2cqw;height:5.2cqw;stroke:#536f91;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;fill:none}
.oiza-login20__field:focus-within .oiza-login20__control{border-color:#078f9e;box-shadow:0 0 0 3px #078f9e22}
.oiza-login20__field:has(input[aria-invalid='true']) .oiza-login20__control{border-color:#b33731}
.oiza-login20__control input:-webkit-autofill{-webkit-text-fill-color:var(--login-ink);transition:background-color 99999s}
.oiza-login20__error{margin:5px 1px 0;color:#a63830;font-size:12px;line-height:1.4}
.oiza-login20__eye{display:grid;place-items:center;flex:0 0 44px;height:44px;width:44px;min-height:44px;padding:10px;border:0;border-radius:10px;background:none;color:#536f91}
.oiza-login20__eye svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.oiza-login20__eye .o15-eye-open{display:none}.oiza-login20__eye[aria-pressed='true'] .o15-eye-off{display:none}.oiza-login20__eye[aria-pressed='true'] .o15-eye-open{display:block}
.oiza-login20__options{display:flex;align-items:center;justify-content:space-between;gap:2cqw;min-height:44px;margin:-.7cqw 0 0;min-width:0}
.oiza-login20__remember{display:inline-flex;align-items:center;gap:2cqw;min-height:44px;padding:0;border:0;background:none;white-space:nowrap;font-size:3.02cqw!important;font-weight:400;text-align:left;flex:0 1 auto}
.oiza-login20__track{display:block;position:relative;flex:0 0 45px;width:45px;height:28px;border-radius:99px;background:#cad6df;transition:background .2s}
.oiza-login20__thumb{position:absolute;left:2px;top:2px;display:block;width:24px;height:24px;border-radius:50%;background:white;box-shadow:0 1px 3px #13434d22;transform:translateX(0);transition:transform .2s}
.oiza-login20__remember[aria-checked='true'] .oiza-login20__track{background:#008e9d}
.oiza-login20__remember[aria-checked='true'] .oiza-login20__thumb{transform:translateX(17px)}
.oiza-login20__forgot{display:block;min-height:44px;padding:0;border:0;background:none;color:#0671ef!important;white-space:nowrap;font-size:3.02cqw!important;font-weight:400}
.oiza-login20__submit{display:flex;align-items:center;justify-content:center;gap:3cqw;min-height:44px;height:10.9cqw;width:100%;padding:8px 16px;border:0;border-radius:2.5cqw;background:#008b9c;color:#fff!important;font-size:4.8cqw!important;font-weight:400;line-height:1.2;box-shadow:0 1cqw 1.6cqw #15778510}
.oiza-login20__submit svg{width:6cqw;height:6cqw;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.oiza-login20__submit:hover{background:#007d8d}
.oiza-login20__divider{display:flex;align-items:center;gap:4cqw;margin:1.4cqw 0;color:#647e9a;font-size:3.2cqw;line-height:1.3;min-height:14px}
.oiza-login20__divider::before,.oiza-login20__divider::after{content:'';height:1px;flex:1;background:#cbdfea}
.oiza-login20__google{display:flex;align-items:center;justify-content:center;gap:3.2cqw;width:100%;min-height:44px;height:10.5cqw;border:1px solid var(--login-line);border-radius:2.5cqw;padding:8px 12px;background:#fff;color:#0d2d50;font-size:3.8cqw!important;line-height:1.3;font-weight:400;box-shadow:0 1cqw 1.8cqw #17476108}
.oiza-login20__google svg{display:block;flex:0 0 5.2cqw;width:5.2cqw;height:5.2cqw}
.oiza-login20__google:hover{background:#f8fcff}
.oiza-login20__signup{display:flex;align-items:center;justify-content:center;gap:1cqw;flex-wrap:wrap;min-height:44px;margin:0;color:var(--login-muted);font-size:3.07cqw;font-weight:400;line-height:1.4;text-align:center}
.oiza-login20__signup a{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:#0671ef;font-size:inherit;font-weight:400;text-decoration:none}
.oiza-login20__message{font-size:12px;line-height:1.5;text-align:center;margin:8px 0 0;color:var(--login-muted)}.oiza-login20__message:empty{display:none}
.oiza-login20__sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.oiza-login20 button:focus-visible{outline:3px solid #58b2c2;outline-offset:3px}.oiza-login20 button:disabled{opacity:.5;cursor:not-allowed}
/* Exactly one animated node per visual block; tilt belongs to nested children. */
.oiza-login20 [data-login-motion]{animation:oiza20-rise .52s cubic-bezier(.2,.72,.2,1) backwards;animation-delay:var(--enter-delay,.3s)}
.oiza-login20 [data-login-motion='down']{animation-name:oiza20-drop}
/* Form blocks follow the heading; backwards fill releases transform after entry. */
.oiza-login20__form > :is(.oiza-login20__field,.oiza-login20__options,.oiza-login20__submit,.oiza-login20__divider,.oiza-login20__google,.oiza-login20__signup,.oiza-login20__server-error,.oiza-login20__message){animation:oiza20-rise .52s cubic-bezier(.2,.72,.2,1) .60s backwards}
.oiza-login20__form > .oiza-login20__field + .oiza-login20__field{animation-delay:.64s}
.oiza-login20__form > .oiza-login20__options{animation-delay:.68s}
.oiza-login20__form > .oiza-login20__submit{animation-delay:.72s}
.oiza-login20__form > .oiza-login20__divider{animation-delay:.76s}
.oiza-login20__form > .oiza-login20__google{animation-delay:.80s}
.oiza-login20__form > .oiza-login20__signup{animation-delay:.84s}
.oiza-login20__card::before{animation:oiza20-rise .52s cubic-bezier(.2,.72,.2,1) .46s backwards}
@keyframes oiza20-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes oiza20-drop{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.oiza-login20 *, .oiza-login20 *::before,.oiza-login20 *::after{animation:none!important;transition:none!important}}
/* Narrow screens wrap the account options without shrinking their touch targets. */
@media(max-width:339px){.oiza-login20__options{flex-wrap:wrap;gap:0 8px}.oiza-login20__forgot{margin-left:auto}.oiza-login20__remember,.oiza-login20__forgot{font-size:12px!important}.oiza-login20__signup{font-size:12px}}



/* Fit the artwork above the full form. Dynamic viewport units follow browser chrome.
   On very short windows, prioritize login controls; allow internal scrolling for keyboards/zoom. */
@media(max-height:480px){
 .oiza-login20{grid-template-rows:minmax(0,1fr)}
 .oiza-login20__hero{display:none}
 .oiza-login20__card{margin-top:0;padding-top:8px;overflow:auto}
 .oiza-login20__heading p{display:none}
}
