:root{--gate-bg: #f6ead8;--gate-ink: #33261d;--gate-muted: #7a6656;--gate-rose: #c96f78;--gate-paper: #fdf6ec;--gate-line: #3b2a20}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{display:grid;place-items:center;min-height:100vh;padding:2rem 1rem;background:var(--gate-bg);color:var(--gate-ink);font-family:Jost,system-ui,-apple-system,sans-serif;font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.gate{width:min(26rem,100%);text-align:center}.gate__door{display:block;width:3.5rem;margin:0 auto 1.25rem;image-rendering:pixelated;shape-rendering:crispEdges}.gate__eyebrow{margin:0;color:var(--gate-muted);font-size:.75rem;letter-spacing:.24em;text-transform:uppercase}.gate__title{margin:.5rem 0 0;font-family:Pixelify Sans,Jost,system-ui,sans-serif;font-size:clamp(1.8rem,7vw,2.6rem);font-weight:600;line-height:1.1}.gate__lede{margin:1rem 0 0;color:var(--gate-muted);text-wrap:balance}.gate__form{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:1.75rem}.gate__input{flex:1 1 10rem;min-width:0;min-height:3rem;padding:.6rem .8rem;border:2px solid var(--gate-line);background:#fff;color:var(--gate-ink);font-family:Pixelify Sans,Jost,system-ui,sans-serif;font-size:1.15rem;letter-spacing:.12em;text-align:center;text-transform:uppercase;box-shadow:inset 2px 2px #3b2a201f}.gate__input:focus-visible{outline:3px solid var(--gate-rose);outline-offset:3px}.gate__input--wrong{border-color:var(--gate-rose);animation:gate-shake .24s ease-out}@keyframes gate-shake{0%,to{transform:translateZ(0)}25%{transform:translate3d(-6px,0,0)}75%{transform:translate3d(6px,0,0)}}.pixel-button{min-height:3rem;padding:.6rem .9rem;border:2px solid var(--gate-line);background:var(--gate-paper);color:var(--gate-ink);font-family:Pixelify Sans,Jost,system-ui,sans-serif;font-size:1rem;line-height:1.2;box-shadow:3px 3px 0 var(--gate-line);cursor:pointer;white-space:nowrap}.pixel-button:hover{background:#fff}.pixel-button:active{transform:translate3d(2px,2px,0);box-shadow:1px 1px 0 var(--gate-line)}.pixel-button:focus-visible{outline:3px solid var(--gate-rose);outline-offset:3px}.gate__note{margin:1rem 0 0;color:var(--gate-rose)}.gate__back{display:inline-block;margin-top:2rem;color:var(--gate-muted);font-size:.9rem;text-decoration:underline;text-decoration-color:var(--gate-rose);text-underline-offset:.2em}.gate__back:hover{color:var(--gate-ink)}.gate__back:focus-visible{outline:3px solid var(--gate-rose);outline-offset:3px}@media(prefers-reduced-motion:reduce){.pixel-button:active{transform:none}.gate__input--wrong{animation:none}}
