:root{--pl-brand:#1098a2;--pl-brand-dark:#087c85;--pl-ink:#102a43;--pl-text:#52677b;--pl-muted:#8495a5;--pl-line:#dce5eb}
*{box-sizing:border-box}
body{margin:0;font-family:"Outfit",system-ui,sans-serif}
.portal-login{min-height:100svh;color:var(--pl-text);background:radial-gradient(circle at 50% 12%,rgba(16,152,162,.055),transparent 31%),#f8fafb}
.portal-login__stage{position:relative;min-height:100svh;display:grid;place-items:center;padding:32px 20px}
.portal-login__home{position:fixed;left:24px;top:22px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--pl-line);border-radius:9px;background:#fff;color:#778b9c;box-shadow:0 4px 15px rgba(26,54,73,.05)}
.portal-login__home svg{width:16px;height:16px}
.portal-login__card{position:relative;width:min(100%,430px);padding:34px 32px 24px;border:1px solid rgba(215,225,232,.95);border-radius:18px;background:#fff;box-shadow:0 22px 65px rgba(25,53,72,.12);overflow:hidden}
.portal-login__line{position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#0f8f98,#51bac1)}
.portal-login__header{text-align:center}
.portal-login__header img{display:block;width:66px;height:66px;margin:0 auto 9px;object-fit:contain}
.portal-login__badge{display:inline-flex;padding:3px 7px;border-radius:99px;background:#edf8f9;color:#0c8790;font-size:8px;font-weight:800;letter-spacing:.11em}
.portal-login__header h1{margin:10px 0 4px;color:var(--pl-ink);font-size:21px;line-height:1.2}
.portal-login__header p{margin:0 0 22px;color:var(--pl-muted);font-size:11px}
.portal-login__alert{display:flex;align-items:flex-start;gap:8px;margin-bottom:14px;padding:10px 11px;border:1px solid #f1c9cd;border-radius:8px;background:#fff5f6;color:#9e3741;font-size:10.5px}
.portal-login__alert--success{border-color:#bce4d6;background:#f1fbf7;color:#296c58}
.portal-login__alert--info{border-color:#b7d4ef;background:#eff6ff;color:#1e4b7a}
.portal-login__alert svg{width:14px;height:14px;flex:0 0 auto}
.portal-login__remembered{display:flex;align-items:center;gap:10px;margin-bottom:17px;padding:10px 11px;border:1px solid #cce5e7;border-radius:10px;background:#f2fafb}
.portal-login__avatar{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:50%;background:#1098a2;color:#fff;font-size:12px;font-weight:750}
.portal-login__remembered>span:nth-child(2){min-width:0;flex:1}
.portal-login__remembered strong,.portal-login__remembered small{display:block}
.portal-login__remembered strong{color:#234158;font-size:10.5px}
.portal-login__remembered small{margin-top:2px;color:#7e919f;font-size:9px}
.portal-login__remembered a{padding:5px 7px;border:1px solid #b9d9dc;border-radius:6px;color:#0c838c;font-size:9px;font-weight:650;text-decoration:none}
.portal-login__form{display:grid;gap:14px}
.portal-login__form>label,.portal-login__field{display:grid;gap:6px}
.portal-login__form>label>span,.portal-login__label-row b{display:flex;align-items:center;gap:6px;color:#42596d;font-size:10px;font-weight:700}
.portal-login__form>label>span svg,.portal-login__label-row b svg{width:14px;height:14px;color:#8799a8}
.portal-login__label-row{display:flex;align-items:center}
.portal-login__form input[type=email],
.portal-login__form input[type=password],
.portal-login__form input[type=text]{display:block;width:100%;height:45px;padding:0 12px;border:1px solid var(--pl-line);border-radius:9px;background:#fbfcfd;color:var(--pl-ink);font:inherit;font-size:12px;line-height:45px;outline:none;appearance:none;-webkit-appearance:none;transition:border .15s,box-shadow .15s,background .15s}
.portal-login__form input:focus{border-color:#68bcc2;background:#fff;box-shadow:0 0 0 4px rgba(16,152,162,.08)}
.portal-login__form input[data-customer-code]{letter-spacing:.04em;font-weight:600;text-transform:uppercase}
.portal-login__hint{display:block;margin-top:5px;color:#8a9cac;font-size:10px;font-style:normal;line-height:1.4}
.portal-login__password{position:relative}
.portal-login__password input{padding-right:42px!important}
.portal-login__password input::-ms-reveal,
.portal-login__password input::-ms-clear{display:none}
.portal-login__password button{position:absolute;right:7px;top:50%;display:inline-flex;align-items:center;justify-content:center;width:31px;height:31px;border:0;border-radius:7px;background:transparent;color:#8a9cac;transform:translateY(-50%);cursor:pointer}
.portal-login__password button:hover{background:#edf7f8;color:#0d8d96}
.portal-login__password svg{display:block;width:16px;height:16px;pointer-events:none}
.portal-login__assist-link{border:0;padding:0;background:none;color:#6e8496;font:inherit;font-size:10px;font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap}
.portal-login__assist-link:hover{color:#0d8d96;text-decoration:underline}
.portal-login__assist-panel{margin:10px 0 12px;padding:10px 11px;border:1px solid #e3ebf0;border-radius:8px;background:#f7fafb}
.portal-login__assist-panel[hidden]{display:none!important}
.portal-login__assist-panel>p{margin:0 0 8px;color:#627788;font-size:10px;line-height:1.45}
.portal-login__assist-form{display:grid;gap:8px}
.portal-login__assist-note{display:grid;gap:4px}
.portal-login__assist-note span{color:#5f7586;font-size:9.5px;font-weight:650}
.portal-login__assist-note textarea{width:100%;min-height:54px;padding:8px 10px;border:1px solid var(--pl-line);border-radius:7px;background:#fff;color:var(--pl-ink);font:inherit;font-size:11px;line-height:1.4;resize:vertical;outline:none}
.portal-login__assist-note textarea:focus{border-color:#68bcc2;box-shadow:0 0 0 3px rgba(16,152,162,.08)}
.portal-login__assist-submit{height:36px;border:0;border-radius:7px;background:#0a2540;color:#fff;font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.portal-login__assist-submit:hover{background:#123552}
.portal-login__options{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:-2px}
.portal-login__check{display:flex;align-items:center;gap:7px;color:#64798c;font-size:10px;cursor:pointer}
.portal-login__check input{position:absolute;opacity:0}
.portal-login__check span{display:grid;place-items:center;width:16px;height:16px;border:1px solid #cbd7df;border-radius:4px;background:#fff}
.portal-login__check input:checked+span{border-color:var(--pl-brand);background:var(--pl-brand)}
.portal-login__check input:checked+span:after{content:"✓";color:#fff;font-size:10px;font-weight:800}
.portal-login__submit{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;height:45px;margin-top:16px;border:0;border-radius:9px;background:var(--pl-brand);color:#fff;font:inherit;font-size:11.5px;font-weight:750;box-shadow:0 8px 19px rgba(16,152,162,.18);cursor:pointer;transition:background .15s,transform .15s}
.portal-login__submit:hover{background:var(--pl-brand-dark);transform:translateY(-1px)}
.portal-login__submit svg{width:14px;height:14px}
.portal-login__card footer{display:flex;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px solid #e8edf1;color:#a0adb7;font-size:8.5px}
.portal-login--portal .portal-login__card{width:min(100%,448px)}
.portal-login--portal .portal-login__header p{max-width:34ch;margin-inline:auto}
@media(max-width:520px){
  .portal-login__stage{align-items:start;padding:0;background:#fff}
  .portal-login__home{position:absolute;left:16px;top:16px;z-index:2}
  .portal-login__card{min-height:100svh;width:100%;padding:55px 20px 20px;border:0;border-radius:0;box-shadow:none}
  .portal-login__header img{width:58px;height:58px}
  .portal-login__header h1{font-size:19px}
  .portal-login__card footer{margin-top:auto}
  .portal-login__options{flex-direction:column;align-items:flex-start}
  .portal-login__options{flex-wrap:wrap}
}
@media(max-width:350px){
  .portal-login__card{padding-inline:16px}
  .portal-login__header p{margin-bottom:18px}
}