.gate{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;background:var(--grafite-950);font-family:var(--font-sans);color:var(--ink);padding:24px}
.gate.is-hidden{display:none}
.gate__bg{position:absolute;inset:0;background-image:url("../img/grade-de-pontos-ouro.svg");background-repeat:no-repeat;background-position:center;opacity:.12;pointer-events:none}
.gate__box{position:relative;width:100%;max-width:400px;text-align:center;padding:56px 40px;background:var(--surface);border:1px solid var(--line)}
.gate__logo{height:44px;margin:0 auto 32px;display:block}
.gate__eyebrow{margin:0 0 8px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--accent-text)}
.gate__title{margin:0 0 12px;font-size:26px;line-height:32px;font-weight:600}
.gate__lead{margin:0 0 32px;font-size:14px;line-height:22px;font-weight:300;color:var(--ink-muted)}
.gate__form{display:grid;gap:8px;text-align:left}
.gate__form label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--ink-muted)}
.gate__form input{font:inherit;font-size:16px;letter-spacing:0;text-transform:none;font-weight:400;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line-strong);padding:10px 0;border-radius:0;outline:none;width:100%;box-sizing:border-box}
.gate__form input:focus{border-bottom:2px solid var(--focus)}
.gate__submit{margin-top:24px;width:100%;padding:16px 24px;font-family:inherit;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--on-accent);background:var(--accent);border:0;border-radius:0;cursor:pointer}
.gate__submit:hover{background:var(--accent-soft)}
.gate__error{margin:14px 0 0;min-height:16px;font-size:12px;color:#e07a6b;visibility:hidden}
.gate__error.is-visible{visibility:visible}
.gate.is-shake .gate__box{animation:gate-shake .3s}
@keyframes gate-shake{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}