/* MAT V1.18: reference-matched, fluid login. Other app screens remain unchanged. */
html:has(.mat-login-v118),body:has(.mat-login-v118){height:100%;min-height:0;overflow:hidden}
.mat-login-v118{display:grid!important;grid-template-columns:minmax(0,62.45fr) minmax(0,37.55fr)!important;height:100vh;height:100dvh;min-height:0!important;width:100%;overflow:hidden!important;background:#fff;font-family:Inter,Manrope,'Segoe UI',Arial,sans-serif}
.mat-v118-visual{position:relative;min-width:0;min-height:0;overflow:hidden;background:#0650b8;isolation:isolate}
.mat-v118-image{position:absolute;inset:0;background-image:url('login/login-reference-left.webp');background-position:center;background-size:100% 100%;background-repeat:no-repeat}
.mat-v118-test{position:absolute;left:10.4%;top:38.5%;width:45.7%;min-height:4.2%;display:flex;align-items:center;padding:0 .2em;background:linear-gradient(100deg,#174eae,#235bb6);color:#fff;font-size:clamp(11px,2.3vw,33px);font-weight:850;letter-spacing:-.025em;line-height:1.13;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mat-v118-devbadge{position:absolute;bottom:9.1%;left:6.1%;width:54.5%;height:10.2%;border:1px solid #8fd3ff77;background:linear-gradient(115deg,#0b50b4,#1c6ac0);border-radius:15px;display:flex;align-items:center;gap:3%;padding:1% 2%;box-shadow:0 10px 24px #001d5e33;z-index:2;color:white}
.mat-v118-devbadge img{width:auto;height:90%;aspect-ratio:1;object-fit:cover;object-position:center 22%;border-radius:50%;border:2px solid #c1e7ff;flex:none}
.mat-v118-devbadge small,.mat-v118-devbadge strong{display:block;line-height:1.3}.mat-v118-devbadge small{font-size:clamp(9px,1vw,15px);font-weight:450;color:#d9ecff}.mat-v118-devbadge strong{font-size:clamp(11px,1.35vw,21px);font-weight:850;white-space:nowrap}
.mat-v118-devslide{position:absolute;inset:0;z-index:3;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .8s ease,visibility .8s ease;background:linear-gradient(90deg,#0c3d9c11 0%,#06388b28 44%,#0a52b9df 61%,#0743a5ef 100%)}
.mat-v118-devslide.active{opacity:1;visibility:visible;pointer-events:auto}
.mat-v118-photo-frame{position:absolute;right:5.5%;top:24%;height:59%;width:34%;border:3px solid #c9eaff;border-radius:190px 190px 20px 20px;overflow:hidden;box-shadow:0 25px 70px #00143f8a,0 0 0 11px #ffffff15;background:#fff;transform:translateY(15px) scale(.97);transition:transform .85s ease}
.mat-v118-devslide.active .mat-v118-photo-frame{transform:translateY(0) scale(1)}
.mat-v118-photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center 10%;display:block}
.mat-v118-photo-label{position:absolute;right:4.2%;top:85%;width:37%;padding:13px 10px;text-align:center;background:#073d97e8;border:1px solid #b8e8ff8a;backdrop-filter:blur(10px);border-radius:13px;box-shadow:0 12px 26px #001c5955;color:#fff}
.mat-v118-photo-label small,.mat-v118-photo-label strong{display:block}.mat-v118-photo-label small{font-size:clamp(8px,.8vw,12px);letter-spacing:.12em;color:#c8e9ff}.mat-v118-photo-label strong{font-size:clamp(11px,1.4vw,19px);line-height:1.35;margin-top:4px}
.mat-v118-carousel{position:absolute;bottom:2.5%;left:6.1%;display:flex;align-items:center;gap:9px;z-index:5}.mat-v118-carousel button{border:0;background:#ffffff80;border-radius:20px;width:9px;height:9px;padding:0;cursor:pointer;transition:width .25s,background .25s}.mat-v118-carousel button.active{background:#fff;width:29px}.mat-v118-carousel span{font-size:11px;color:#dbeeff;letter-spacing:.08em;margin-left:8px}
.mat-v118-panel{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;background:linear-gradient(110deg,#fff 55%,#f9fbff);display:flex;align-items:center;justify-content:center;padding:clamp(15px,3.4vw,54px)}
.mat-v118-formwrap{width:100%;max-width:460px;margin:auto;display:flex;flex-direction:column;align-items:stretch;gap:0}
.mat-v118-logo{display:block;width:min(100%,400px);height:clamp(94px,18vh,185px);object-fit:contain;align-self:center;margin:0 auto clamp(15px,3vh,34px)}
.mat-v118-greeting h1{font-size:clamp(25px,2.75vw,43px);font-weight:850;line-height:1.1;letter-spacing:-.045em;color:#0b193d;margin:0 0 6px}.mat-v118-greeting p{font-size:clamp(12px,1.15vw,18px);color:#7182a3;margin:0}
.mat-v118-roles{display:flex;gap:4px;background:#f0f5fd;border:1px solid #e0e8f6;border-radius:12px;padding:4px;margin:clamp(15px,2.7vh,27px) 0 clamp(12px,2.4vh,23px)}.mat-v118-roles button{flex:1;min-width:0;border:0;border-radius:9px;background:transparent;color:#627693;font:700 clamp(11px,.9vw,13px) inherit;padding:10px 5px;cursor:pointer}.mat-v118-roles button.active{background:#fff;color:#075de0;box-shadow:0 3px 12px #16458013}
.mat-v118-form{display:flex;flex-direction:column;gap:clamp(12px,2.1vh,20px)}.mat-v118-input{height:clamp(46px,6.4vh,62px);border:1px solid #cfdcf1;border-radius:11px;display:flex;align-items:center;background:#fff;transition:border-color .2s,box-shadow .2s}.mat-v118-input:focus-within{border-color:#1683ff;box-shadow:0 0 0 3px #1381fc14}.mat-v118-input>span{display:grid;place-items:center;flex:none;width:52px;color:#607394;font-size:23px}.mat-v118-input input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#11254a;font:500 clamp(12px,1.05vw,16px) inherit;height:100%;padding:0 8px 0 0}.mat-v118-input input::placeholder{color:#8e9fba}.mat-v118-eye{border:0;background:none;cursor:pointer;color:#637996;font-size:21px;padding:8px 14px}
.mat-v118-submit{display:flex;align-items:center;justify-content:center;gap:20px;border:0;border-radius:11px;min-height:clamp(47px,6.5vh,64px);margin-top:2px;background:linear-gradient(100deg,#2ca5fa,#0358f4);color:#fff;font-weight:800;font-size:clamp(14px,1.25vw,18px);cursor:pointer;box-shadow:0 12px 22px #1260e624}.mat-v118-submit:hover{filter:brightness(1.04)}.mat-v118-submit span{font-size:23px}
.mat-v118-register{text-align:center;color:#7788a1;font-size:clamp(10px,.8vw,12px);margin:clamp(13px,2.3vh,23px) 0}.mat-v118-register a{color:#0969d7;font-weight:800}
.mat-v118-trust{display:flex;align-items:center;gap:13px;background:#f0f5fc;border-radius:12px;padding:clamp(11px,1.6vh,16px)}.mat-v118-shield{display:grid;place-items:center;flex:none;width:43px;height:43px;background:#e0edff;border-radius:10px;color:#096cf0;font-size:26px}.mat-v118-trust strong,.mat-v118-trust small{display:block}.mat-v118-trust strong{color:#152747;font-size:clamp(11px,.86vw,13px)}.mat-v118-trust small{font-size:clamp(9px,.75vw,11px);color:#7184a1;margin-top:3px;line-height:1.35}.mat-v118-panel footer{text-align:center;color:#9aa7bc;font-size:10px;padding-top:clamp(10px,1.6vh,20px)}
@media (max-height:760px) and (min-width:801px){.mat-v118-panel{padding:14px 32px}.mat-v118-logo{height:clamp(75px,14vh,120px);margin-bottom:12px}.mat-v118-roles{margin:12px 0}.mat-v118-register{margin:11px 0}.mat-v118-panel footer{padding-top:8px}}
@media (max-width:1100px) and (min-width:801px){.mat-login-v118{grid-template-columns:minmax(0,57fr) minmax(0,43fr)!important}.mat-v118-panel{padding:22px}.mat-v118-devbadge strong{font-size:clamp(10px,1.2vw,15px)}.mat-v118-test{font-size:clamp(11px,2vw,24px)}}
@media(max-width:800px){html:has(.mat-login-v118),body:has(.mat-login-v118){height:auto;overflow:auto}.mat-login-v118{display:flex!important;flex-direction:column;height:auto;min-height:100dvh;overflow:visible!important}.mat-v118-visual{height:clamp(260px,49vw,470px);min-height:260px;flex:none}.mat-v118-image{background-size:100% 100%}.mat-v118-panel{flex:1;overflow:visible;padding:26px clamp(18px,5vw,40px)}.mat-v118-formwrap{max-width:490px}.mat-v118-logo{height:110px;margin-bottom:20px}.mat-v118-greeting h1{font-size:30px}.mat-v118-greeting p{font-size:14px}.mat-v118-test{font-size:clamp(10px,3vw,20px)}.mat-v118-devbadge strong{font-size:clamp(9px,2.4vw,17px)}.mat-v118-devbadge small{font-size:clamp(8px,1.9vw,12px)}.mat-v118-photo-label strong{font-size:clamp(9px,2.1vw,15px)}.mat-v118-input input{font-size:14px}}
@media(max-width:460px){.mat-v118-visual{height:270px}.mat-v118-devbadge{border-radius:7px;gap:5px;padding:2px 4px}.mat-v118-devbadge img{border-width:1px}.mat-v118-devbadge strong{font-size:9px}.mat-v118-devbadge small{font-size:8px}.mat-v118-test{font-size:10px}.mat-v118-photo-label{padding:5px 2px;border-radius:7px}.mat-v118-photo-label strong{font-size:9px}.mat-v118-photo-label small{font-size:7px}.mat-v118-carousel{bottom:1.5%}.mat-v118-panel{padding:20px}.mat-v118-logo{height:92px;margin-bottom:14px}.mat-v118-roles{margin:16px 0}.mat-v118-trust{margin-top:3px}}
@media(prefers-reduced-motion:reduce){.mat-v118-devslide,.mat-v118-photo-frame{transition:none!important}}