:root { font-family: Arial, sans-serif; color: #142a4d; background: #edf2f7; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 20px; }
.card { width: min(100%, 480px); padding: clamp(24px, 5vw, 44px); background: #fff; border: 1px solid #d9e3ee; box-shadow: 0 18px 45px #142a4d1a; }
.logo { display: block; width: min(230px, 65%); height: 110px; object-fit: contain; object-position: left center; }
.eyebrow { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #49698e; }
h1 { font-size: 30px; margin: 6px 0 12px; }
.intro { line-height: 1.5; color: #43566d; }
.message { min-height: 44px; padding: 12px; background: #e6eef8; border-left: 4px solid #49698e; line-height: 1.4; }
.message.error { background: #fff0ed; border-color: #b54336; }
section { margin-top: 22px; }
section[hidden] { display: none; }
label { display: block; font-weight: 700; margin-bottom: 8px; }
input { width: 100%; padding: 12px; font: inherit; border: 1px solid #869bb2; border-radius: 4px; }
button { display: block; width: 100%; margin-top: 12px; padding: 14px 16px; border: 0; border-radius: 4px; background: #142a4d; color: white; font: inherit; font-weight: 700; cursor: pointer; }
button:hover { background: #244a7b; }
button:disabled { opacity: .55; cursor: progress; }
button.secondary { background: #e6eef8; color: #142a4d; }
#open-mobile-test { display: block; margin-top: 14px; padding: 14px 16px; border-radius: 4px; background: #2f527f; color: #fff; font-weight: 700; text-align: center; text-decoration: none; }
#open-mobile-test[hidden] { display: none; }
.footnote { margin-top: 32px; font-size: 12px; line-height: 1.5; color: #627188; }