:root{--ink:#17213d;--paper:#f7f4ee;--sky:#70cfff;--lav:#dcd8ff;--mint:#bfe8cb;--yellow:#ffe082;--line:#252a3d;--muted:#69728a}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:Poppins,Arial,sans-serif}.shell{max-width:1100px;margin:auto;padding:18px clamp(14px,3vw,34px) 56px}a{color:inherit}.topbar{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;border:1.5px solid var(--line);border-radius:20px;background:var(--sky)}.brand{width:180px;height:58px}.brand img{width:100%;height:100%;object-fit:contain}.topbar div{display:flex;align-items:center;gap:12px;font-size:12px}.topbar a:last-child{padding:10px 15px;border:1.5px solid;border-radius:12px;background:#fff;font-weight:700;text-decoration:none}
    .login-layout{display:grid;grid-template-columns:1fr 1fr;min-height:650px;margin-top:18px;border:1.5px solid var(--line);border-radius:30px;overflow:hidden}.login-story{display:flex;flex-direction:column;padding:clamp(32px,6vw,72px);background:var(--mint)}.eyebrow{margin:0 0 26px;font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.login-story h1{margin:0;font-size:clamp(54px,7vw,88px);font-weight:600;letter-spacing:-.07em;line-height:.88}.login-story p:not(.eyebrow){max-width:430px;margin:28px 0 0;color:#4d5670;font-size:14px;line-height:1.7}.story-note{margin-top:auto!important;padding-top:30px;border-top:1px solid #17213d42}.login-card{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,5vw,64px);background:#fff}.login-card h2{margin:0 0 8px;font-size:42px;font-weight:600;letter-spacing:-.05em}.login-card>p{margin:0 0 24px;color:var(--muted);font-size:12px}.role-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:6px;border:1.5px solid var(--line);border-radius:15px;background:#eef1f5}.role-tabs button{cursor:pointer;height:42px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:700 12px Poppins}.role-tabs button.active{background:var(--lav);box-shadow:0 3px 0 #252a3d26}.field{display:grid;gap:7px;margin-top:16px}.field label{font-size:11px;font-weight:700}.field input{height:50px;padding:0 14px;border:1.5px solid #aeb5c5;border-radius:11px;font:400 13px Poppins;outline:none}.field input:focus{border-color:var(--ink);box-shadow:0 0 0 3px #70cfff3d}.form-meta{display:flex;justify-content:space-between;gap:12px;margin:14px 0 20px;font-size:10px}.submit{width:100%;height:50px;cursor:pointer;border:1.5px solid var(--line);border-radius:12px;background:var(--ink);color:#fff;font:700 12px Poppins}.signup{text-align:center;margin-top:18px!important}.status{display:none;margin-top:14px;padding:11px;border:1px solid #317e50;border-radius:10px;background:#dff6e6;font-size:11px}.status.show{display:block}
    footer{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:18px;padding:24px 28px;border:1.5px solid var(--line);border-radius:22px;background:var(--yellow);font-size:11px}.footer-logo{width:145px;height:52px;object-fit:contain;mix-blend-mode:multiply}
    .oauth-button{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:50px;margin-top:16px;cursor:pointer;border:1.5px solid #aeb5c5;border-radius:11px;background:#fff;color:var(--ink);font:600 12px Poppins}.oauth-button:hover{border-color:var(--ink);background:#f8f9fb}.oauth-button svg{width:19px;height:19px}.auth-divider{display:flex;align-items:center;gap:12px;margin:16px 0 0;color:var(--muted);font-size:10px}.auth-divider::before,.auth-divider::after{content:"";height:1px;flex:1;background:#d3d7e0}
    @media(max-width:760px){.login-layout{grid-template-columns:1fr}.login-story{min-height:360px}.login-card{padding-block:45px}.topbar div span{display:none}footer{align-items:flex-start;flex-direction:column}}.demo-access{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0;padding:12px 14px;border:1.5px solid #252a3d;border-radius:14px;background:#dcd8ff}.demo-access strong,.demo-access span{display:block}.demo-access strong{font-size:12px}.demo-access span{margin-top:3px;color:#596379;font-size:11px}.demo-access button{flex:0 0 auto;padding:8px 10px;border:1.5px solid #252a3d;border-radius:10px;background:#fff;color:#17213d;font:inherit;font-size:11px;font-weight:700;cursor:pointer;box-shadow:2px 2px 0 #252a3d}.demo-access button:active{transform:translate(2px,2px);box-shadow:none}@media(max-width:480px){.demo-access{align-items:flex-start;flex-direction:column}.demo-access button{width:100%}}
