body.login { min-height: 100vh; display: grid; place-items: center; padding: 28px 18px; }
.gate { width: min(483px, 100%); }
.gate-brand { display: flex; align-items: center; gap: 21px; border-bottom: var(--rule); padding-bottom: 21px; margin-bottom: 32px; }
.gate-ring { width: 74px; height: 74px; image-rendering: pixelated; }
.gate-brand h1 { margin: 0; font: 800 51px/0.9 var(--f-display); font-stretch: 125%; letter-spacing: -0.03em; text-transform: uppercase; }
.gate-box { display: grid; gap: 16px; }
.gate-main { justify-content: center; padding: 21px; font-size: 16px; }
.gate-note, .gate-lead { margin: 0; font: 400 15px/1.5 var(--f-data); color: var(--mute); }
.gate-lead { color: var(--ink); font-size: 17px; }
.gate-alt { border-top: var(--hairline); padding-top: 16px; margin-top: 12px; }
.gate-alt summary { cursor: pointer; font: 500 14px/1 var(--f-data); text-transform: uppercase; }
.gate-form { display: grid; gap: 14px; margin-top: 16px; }
.gate-form .btn { justify-content: center; }
.gate-msg { min-height: 1.5em; margin-top: 21px; font: 500 15px/1.5 var(--f-data); }