body { background: #f5f8fd; color: #253247; font-family: "Avenir Next", Avenir, "Segoe UI", sans-serif; }
.navbar, footer, .main-logo, .main-logo-dark { display: none !important; }
.card, .panel, .jumbotron { border: 1px solid #d7e0ed; border-radius: 16px; box-shadow: 0 12px 40px #172b4d0a; background: #fff; }
.btn { border-radius: 9px; font-weight: 600; }
.btn-primary, .btn-success { background: #315fed; border-color: #315fed; }
.btn-primary:hover, .btn-success:hover { background: #2851d3; border-color: #2851d3; }
.form-control { border-color: #d7e0ed; border-radius: 9px; }
.form-control:focus { border-color: #315fed; box-shadow: 0 0 0 3px #dce8ff; }
a { color: #315fed; }
a:focus-visible, button:focus-visible { outline: 2px solid #315fed; outline-offset: 3px; }
body::before { content: 'Calendar & contacts — sign in with your mailbox'; display: block; margin: 36px auto 16px; padding: 0 20px; text-align: center; color: #172b4d; font-size: 24px; font-weight: 600; letter-spacing: -.5px; }
body::after { content: 'Use the same mailbox email address. Your usual security verification still applies.'; display: block; margin: 20px auto; padding: 0 20px; text-align: center; color: #62718a; font-size: 13px; line-height: 1.6; }
.card form::before { content: 'Mailbox sign-in'; display: block; margin-bottom: 1rem; color: #172b4d; font-size: 18px; font-weight: 600; }
@media (max-width: 600px) {
    body::before { margin-top: 24px; font-size: 21px; }
}