:root{--ink:#172d41;--muted:#708090;--navy:#102d43;--accent:#087e76;--border:#dce4e9}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Inter,"Segoe UI",Arial,sans-serif;background:#f9fbfc;-webkit-font-smoothing:antialiased}button,input{font:inherit}a{color:inherit}button,a,input{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.login-shell{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:1.05fr 1fr}.brand-panel{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:60px;padding:48px clamp(38px,5.1vw,88px);color:#fff;background:radial-gradient(ellipse at 0% 100%,#164d58 0,transparent 65%),#102d43}.brand-panel:after{content:"";position:absolute;width:600px;height:600px;border:1px solid #ffffff08;border-radius:50%;top:-360px;right:-330px;box-shadow:0 0 0 90px #ffffff02,0 0 0 180px #ffffff02;pointer-events:none}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;align-self:flex-start;position:relative;z-index:1;font-size:22px;font-weight:700}.brand-logo{display:flex;align-items:center;background:#fff;border-radius:10px;padding:10px 16px;min-height:50px}.brand-logo img{display:block;width:auto;max-width:180px;max-height:40px;object-fit:contain}.brand-mark{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:#d6eee8;color:#102d43;font-size:25px}.brand-mark>span{font-size:15px;align-self:flex-start;padding-top:5px}.brand-content{max-width:500px;position:relative;z-index:1;padding:5px 0}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.1px;display:flex;align-items:center;gap:9px;color:#b5d8d5;margin:0 0 25px}.eyebrow>span{width:6px;height:6px;background:#63c8ab;border-radius:50%}.brand-content h1{font-size:clamp(32px,3.2vw,49px);letter-spacing:-1.7px;line-height:1.18;font-weight:650;margin:0 0 22px}.brand-content h1>span{color:#a0d7ca}.brand-description{max-width:375px;font-size:15px;line-height:1.8;color:#b9cbd6;margin:0 0 34px}.flow-illustration{border:1px solid #ffffff1a;border-radius:15px;background:linear-gradient(125deg,#ffffff09,#ffffff02);padding:20px 23px;max-width:430px;box-shadow:0 18px 40px #081e2920}.flow-top{display:flex;align-items:center;gap:8px;color:#c1d2dc;font-size:11px}.flow-dot{width:5px;height:5px;border-radius:50%;background:#6dbba6}.flow-dots{margin-left:auto;letter-spacing:3px;color:#6c8b9c}.flow-path{display:flex;align-items:flex-start;gap:12px;margin:29px 0 24px}.flow-node{display:flex;align-items:center;flex-direction:column;gap:10px;color:#bfd2dc;font-size:11px}.flow-icon{display:grid;place-items:center;width:52px;height:52px;border:1px solid #ffffff1f;background:#ffffff08;border-radius:13px;font-size:26px;color:#d1e7e5}.flow-icon.box-icon{background:#77c7ac1c;border-color:#77c7ac44;color:#a5dec9}.flow-icon svg{width:25px;height:25px}.flow-connector{height:1px;background:linear-gradient(90deg,#ffffff11,#83bdbb77,#ffffff11);flex:1;margin-top:26px;position:relative}.flow-connector:after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;border-top:1px solid #83bdbb;border-right:1px solid #83bdbb;transform:rotate(45deg)}.flow-bottom{border-top:1px solid #ffffff12;padding-top:15px;font-size:11px;color:#a4bbc7;display:flex;align-items:center;gap:8px}.flow-check{color:#8ad5b8}.module-labels{display:flex;align-items:center;gap:12px;margin-top:27px;font-size:11px;font-weight:600;color:#c2d6df;flex-wrap:wrap}.module-labels i{height:11px;width:1px;background:#ffffff35}.module-description{font-weight:400;color:#8eabb9;margin-left:3px}.brand-footnote{font-size:11px;color:#8eabb9;position:relative;margin:0}.access-panel{display:flex;flex-direction:column;justify-content:center;padding:70px clamp(32px,5.6vw,100px) 24px;position:relative}.access-content{width:100%;max-width:380px;margin:auto; padding:20px 0 60px}.welcome-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:13px;background:#e7f2ee;color:var(--accent);margin-bottom:28px}.welcome-icon svg{width:25px;height:25px}.access-eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;color:#6a7d8b;margin:0 0 12px}.access-content h2{font-size:30px;letter-spacing:-.9px;line-height:1.25;margin:0 0 12px;font-weight:650}.access-description{font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 32px}.field{margin-bottom:23px}.field label{display:block;font-size:12px;font-weight:600;margin-bottom:9px}.field input{display:block;width:100%;height:49px;border:1px solid var(--border);border-radius:8px;padding:0 14px;background:#fff;color:var(--ink);font-size:13px;transition:border-color .15s,box-shadow .15s}.field input::placeholder{color:#95a1ab;opacity:1}.field input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #087e7614}.field-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.field-heading a{font-size:11px;color:var(--accent);text-decoration:none;font-weight:600}.field-heading a:hover{text-decoration:underline}.password-field{position:relative}.password-field input{padding-right:52px}.password-toggle{display:grid;place-items:center;position:absolute;right:5px;top:5px;border:0;background:transparent;color:#768997;width:39px;height:39px;border-radius:5px;cursor:pointer}.password-toggle:hover{background:#edf4f3;color:var(--accent)}.password-toggle[aria-pressed=true]{color:var(--accent);background:#edf4f3}.password-toggle svg{width:20px;height:20px}.submit-button{display:flex;align-items:center;justify-content:center;gap:13px;border:0;border-radius:8px;background:var(--navy);width:100%;height:49px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:background .15s,transform .15s;box-shadow:0 4px 8px #102d4310}.submit-button:hover{background:#18475f}.submit-button:active{transform:translateY(1px)}.submit-button:disabled{cursor:wait;background:#315368}.submit-arrow{font-size:19px;font-weight:400}.submit-spinner{width:15px;height:15px;border:2px solid #ffffff44;border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.caps-warning{font-size:11px;color:#946324;margin:8px 0 0}.access-note{display:flex;align-items:flex-start;justify-content:center;gap:9px;border-top:1px solid #e5eaef;margin-top:30px;padding-top:24px}.access-note svg{flex-shrink:0;width:17px;height:17px;color:#8ca19f;margin-top:2px}.access-note p{margin:0;font-size:10px;line-height:1.8;color:#7e8d99}.access-footer{display:flex;justify-content:space-between;gap:16px;max-width:470px;width:100%;margin:0 auto;font-size:10px;color:#8e9ba5;padding-top:20px}.notice{display:flex;gap:9px;align-items:flex-start;border:1px solid transparent;padding:12px;border-radius:8px;margin:0 0 22px;font-size:12px;line-height:1.6}.notice>span{font-weight:bold;flex-shrink:0}.notice p{margin:0}.notice-error{background:#fff3f1;border-color:#f5d9d3;color:#9c463b}.notice-success{background:#edf6f1;border-color:#d5e9df;color:#286a4b}.demo-panel{border:1px dashed #c5d4dc;padding:14px;border-radius:8px;margin-top:24px;font-size:11px;color:#708090}.demo-panel p{margin:0 0 10px}.demo-actions{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.demo-actions button{cursor:pointer;border:1px solid #cedbe3;border-radius:5px;background:white;padding:6px 8px;color:var(--ink);font-size:11px}a:focus-visible,button:focus-visible{outline:3px solid #70b5ab;outline-offset:4px}a:hover{color:inherit}a:focus-visible{border-radius:3px}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1600px){.brand-panel{padding-left:max(88px,calc((100vw - 1400px)/2))}.access-panel{padding-right:max(88px,calc((100vw - 1400px)/2))}}@media(max-width:1050px){.brand-panel{padding:38px 34px;gap:40px}.brand-content h1{font-size:35px}.access-panel{padding:45px 35px 24px}.flow-illustration{padding:18px}.module-description{width:100%;margin:0}}@media(max-width:760px){.login-shell{grid-template-columns:1fr}.brand-panel{padding:25px 28px;gap:0}.brand-content,.brand-footnote{display:none}.brand-logo{padding:7px 12px;min-height:40px}.brand-logo img{max-width:145px;max-height:30px}.brand{font-size:20px}.brand-mark{width:34px;height:34px;font-size:23px}.access-panel{padding:38px 28px 22px;min-height:calc(100svh - 90px)}.access-content{max-width:400px;padding:0 0 38px}.welcome-icon{width:42px;height:42px;margin-bottom:22px}.access-content h2{font-size:28px}.access-description{margin-bottom:28px}.access-footer{max-width:400px}.field input,.submit-button{height:50px;font-size:16px}.password-toggle{top:5px}.access-note p{font-size:11px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
