:root { font: 14px Tahoma, Arial, sans-serif; color: #123047; background: #eff8fe; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-card { width: 100%; max-width: 420px; background: #fff; padding: 32px; border: 1px solid #b6dcf3; border-top: 6px solid #77c4ef; border-radius: 10px; box-shadow: 0 8px 28px #175b8510; }
h1 { font-size: 22px; margin: 25px 0 12px; }
p { color: #5a7485; line-height: 1.7; }
label { display: block; margin: 20px 0 8px; }
input, button { font: inherit; width: 100%; padding: 12px; border-radius: 5px; }
input { border: 1px solid #9ebacb; }
input:focus, button:focus-visible, a:focus-visible { outline: 2px solid #328fc8; outline-offset: 2px; }
button { margin-top: 24px; background: #147eb8; border: 0; color: #fff; cursor: pointer; font-weight: bold; }
button:disabled { opacity: .6; cursor: wait; }
a { display: inline-block; margin-top: 22px; color: #116da2; text-decoration: none; }
#login-message { color: #b32b41; }