:root { color-scheme: light; --orange:#f36b21; --orange-dark:#d94d0a; --ink:#151515; --muted:#666; --line:#e8dfd8; --wash:#f7f2ed; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:#fffdfb; color:var(--ink); font-family:Tahoma,Arial,sans-serif; }
button,input { font:inherit; }
.login-shell { width:min(1120px,calc(100% - 36px)); margin:0 auto; padding:30px 0 64px; }
.back { display:inline-block; color:#713313; font-size:13px; font-weight:800; text-decoration:none; }
.login-grid { min-height:calc(100vh - 100px); display:grid; grid-template-columns:1.05fr .8fr; gap:72px; align-items:center; }
.eyebrow,.kicker { margin:0 0 13px; color:var(--orange-dark); font-size:11px; font-weight:900; letter-spacing:1.5px; text-transform:uppercase; }
.intro h1 { margin:0; max-width:650px; font-size:clamp(48px,6.4vw,78px); line-height:.96; letter-spacing:-4px; }
.intro h1 em { color:var(--orange); font-style:normal; }
.lead { max-width:650px; margin:25px 0 0; color:var(--muted); font-size:17px; line-height:1.7; }
.intro dl { margin:36px 0 0; display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); }
.intro dl div { padding:19px 13px 19px 0; }
.intro dt { color:#8b8078; font-size:10px; font-weight:800; text-transform:uppercase; }
.intro dd { margin:7px 0 0; font-size:13px; font-weight:900; }
.login-card { border-top:6px solid var(--orange); background:white; padding:34px; box-shadow:0 22px 70px rgba(45,28,17,.12); }
.mark { width:54px; height:54px; display:grid; place-items:center; margin-bottom:23px; background:var(--ink); color:white; font-size:18px; font-weight:900; }
.login-card h2 { margin:0; font-size:30px; line-height:1.12; letter-spacing:-1.2px; }
.login-card > p:not(.kicker):not(.security-note) { margin:13px 0 24px; color:var(--muted); font-size:14px; line-height:1.6; }
.credential-login-form { display:grid; gap:18px; }
.credential-login-form label { display:grid; gap:8px; color:#403b37; font-size:12px; font-weight:800; }
.credential-login-form input { width:100%; min-height:48px; padding:0 13px; border:1px solid #cfc3ba; background:#fff; color:var(--ink); outline:none; }
.credential-login-form input:focus { border-color:var(--orange); box-shadow:0 0 0 3px rgba(243,107,33,.14); }
.credential-password { position:relative; display:block; }
.credential-password input { padding-right:68px; }
.credential-password button { position:absolute; inset:6px 6px 6px auto; border:0; background:var(--wash); color:#693215; padding:0 12px; cursor:pointer; font-size:11px; font-weight:900; }
.primary { min-height:50px; border:0; background:var(--orange); color:white; cursor:pointer; font-weight:900; }
.primary:disabled { opacity:.55; cursor:wait; }
.credential-login-message { margin:0; padding:12px; font-size:12px; line-height:1.45; }
.credential-login-message.status { background:#f1f6f3; color:#155f3c; }
.credential-login-message.error { background:#fff0ed; color:#9b2918; }
.hidden-response-frame { display:none; }
.security-note { margin:19px 0 0; padding:13px 14px; background:var(--wash); color:#655d57; font-size:11px; line-height:1.5; }
@media (max-width:800px) { .login-grid { grid-template-columns:1fr; gap:38px; padding-top:55px; } .intro h1 { letter-spacing:-3px; } }
@media (max-width:520px) { .login-shell { width:calc(100% - 24px); } .login-grid { padding-top:38px; } .intro h1 { font-size:47px; } .intro dl { grid-template-columns:1fr; } .intro dl div { border-bottom:1px solid var(--line); } .intro dl div:last-child { border-bottom:0; } .login-card { padding:25px 20px; } }