:root {
  color-scheme: light;
  font-family: Arial, Helvetica, sans-serif;
  color: #101010;
  background: #f5f5f3;
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-card { width: min(100%, 440px); background: #fff; border: 1px solid #d9d9d6; padding: 42px; box-shadow: 0 18px 60px rgba(0,0,0,.08); }
.login-logo { display: block; width: 164px; height: auto; margin-bottom: 44px; }
.eyebrow { margin: 0 0 8px; color: #626262; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 0 0 14px; font-size: 32px; line-height: 1.12; }
p { color: #555; line-height: 1.55; }
button, .button-link { width: 100%; min-height: 48px; margin-top: 22px; border: 1px solid #101010; background: #101010; color: #fff; font: 700 15px Arial, Helvetica, sans-serif; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
button:focus-visible, .button-link:focus-visible { outline: 3px solid #004c7f; outline-offset: 3px; }
.notice { margin-top: 22px; padding: 14px; border-left: 3px solid #ca7a00; background: #f5f5f3; color: #333; line-height: 1.45; }
small { display: block; margin-top: 28px; color: #737373; }