*{box-sizing:border-box}
:root{font-family:Segoe UI,Arial,sans-serif;color:#252b33;background:#f1f2f3;font-synthesis:none}
body{margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:40px 24px;background:radial-gradient(ellipse at 12% 8%,#fff 0,transparent 55%),#f1f2f3}
.login-shell{width:100%;max-width:1000px;min-height:620px;display:grid;grid-template-columns:1fr 1fr;border:1px solid #e0e3e6;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 24px 80px #25303c12}
.login-brand{position:relative;isolation:isolate;overflow:hidden;padding:42px;background:#24282d;color:white;display:flex;flex-direction:column}
.brand-logo{width:245px;max-width:100%;height:auto;display:block}
.brand-copy{margin-top:64px;z-index:1}
.eyebrow{font-size:10px;letter-spacing:.15em;color:#aeb6c1;font-weight:600}
h1{font-size:43px;line-height:1.15;letter-spacing:-.04em;font-weight:600;margin:20px 0}
h1 span{color:#fa8b19}
.brand-copy p{font-size:14px;line-height:1.7;color:#b8c0cb;max-width:300px;margin:0}
.brand-footer{font-size:11px;color:#aeb6c1;letter-spacing:.03em;margin-top:auto;padding-top:130px;z-index:1}
.brand-footer span{padding:0 8px;color:#ed8c2b}
.warehouse-art{position:absolute;width:290px;height:170px;right:-10px;bottom:38px;opacity:.34;transform:skewY(-8deg);z-index:-1}
.rack{position:absolute;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:8px;border:1px solid #8492a4;padding:9px;width:180px;height:110px}
.rack i{border:1px solid #8190a1;background:#ffffff05}
.rack-one{left:0;top:0}.rack-two{left:90px;top:58px;border-color:#c1813c}.rack-two i{border-color:#bc7c39}
.art-path{position:absolute;width:140px;height:70px;border-left:1px dashed #c1813c;border-bottom:1px dashed #c1813c;left:-20px;top:105px}
.art-box{position:absolute;width:30px;height:28px;border:1px solid #ff981f;background:#f58b1b25;left:68px;top:126px}
.login-panel{padding:58px 54px 24px;display:flex;flex-direction:column}
.mobile-logo{display:none;width:225px;height:auto}
.panel-label{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:650;letter-spacing:.11em;color:#717b86}
.panel-label>span{height:6px;width:6px;border-radius:50%;background:#ed891f}
h2{font-size:27px;line-height:1.25;font-weight:650;letter-spacing:-.035em;margin:14px 0 9px}
.form-heading>p{font-size:14px;color:#78818b;margin:0 0 32px}
.form-field{margin-bottom:20px}
label{display:block;font-size:13px;font-weight:600;margin-bottom:8px;color:#3e4752}
input{font:14px Segoe UI,Arial,sans-serif;height:47px;width:100%;border:1px solid #d4dae1;border-radius:6px;padding:0 13px;background:#fff;color:#252b33;outline:none;transition:border-color .15s,box-shadow .15s}
input::placeholder{color:#9da5ae}
input:focus{border-color:#dc861f;box-shadow:0 0 0 3px #ee951f1a}
.password-field{position:relative}.password-field input{padding-right:48px}
#show-password{position:absolute;right:4px;top:4px;width:39px;height:39px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;color:#83909e;border-radius:4px}
#show-password:hover{background:#f2f4f6;color:#353f4b}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.submit-button{width:100%;height:47px;margin-top:7px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:#ec891c;color:#231b13;border:1px solid #e58418;border-radius:6px;font:600 14px Segoe UI,Arial,sans-serif;cursor:pointer;transition:background .15s,transform .15s}
.submit-button:hover{background:#fa981f}.submit-button:active{transform:translateY(1px)}
button:focus-visible{outline:3px solid #b66e20;outline-offset:3px}
.login-help{display:flex;gap:10px;border-top:1px solid #edf0f3;margin-top:30px;padding-top:22px;color:#87919c}
.login-help svg{width:16px;height:18px;flex-shrink:0;margin-top:2px}
.login-help p{font-size:11px;line-height:1.7;margin:0;color:#818a95}
footer{font-size:10px;color:#a3aab2;margin-top:auto;padding-top:32px}
.login-error{border:1px solid #ecc3b9;background:#fff4f0;border-radius:6px;padding:11px 13px;font-size:13px;line-height:1.5;color:#963e2c;margin-bottom:22px}
@media(max-width:820px){body{padding:28px 20px}.login-shell{max-width:460px;display:block;min-height:0}.login-brand{display:none}.login-panel{padding:36px 36px 24px}.mobile-logo{display:block;margin:0 0 40px}.form-heading>p{margin-bottom:28px}footer{padding-top:30px}}
@media(max-width:400px){body{padding:15px 12px}.login-panel{padding:28px 24px 22px}h2{font-size:25px}.mobile-logo{width:205px;margin-bottom:32px}}
@media(max-height:650px) and (min-width:821px){body{padding:20px}.login-shell{min-height:570px}.login-panel{padding-top:34px}.brand-copy{margin-top:40px}}
.remove-token-form{margin-top:8px;text-align:center}
.remove-token-form button{background:transparent;color:#465569;border:0;padding:5px 8px;font:inherit;font-size:.9rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.remove-token-form button:hover{text-decoration-thickness:2px}
