.landing{position:relative;min-height:95vh;width:100%;max-width:95vw;margin:0 auto;background:#fff;font-family:Courier New,Courier,monospace;overflow:hidden}.overlay-text{position:absolute;top:15%;left:12%;font-size:4rem;font-weight:700;z-index:2}.nav-links{position:absolute;top:85%;right:20%;font-size:.9rem;z-index:2}.nav-links a{color:#000;margin:0 .2rem;text-decoration:none;font-weight:700;font-size:1.2rem;cursor:pointer;transition:color .3s ease}.nav-links a:hover{color:#666}.background-text{position:absolute;color:#0000000f;font-size:2.5rem;line-height:2.9rem;padding-left:10%;padding-right:10%;z-index:1}.form-container{border:solid black 2px;padding:2px;display:flex;flex-direction:column;max-width:500px}.form-wrapper-container{display:flex;flex-direction:column;max-width:500px}.form-wrapper-container h3{text-align:center;width:100%}input{margin:2.5px}.login-signup-page{display:flex;justify-content:center;align-items:center;min-height:100vh;font-family:Courier New,monospace;position:relative;overflow:hidden}.login-signup-page>h1{margin-right:10%;font-size:4rem;margin-left:-15%}.card-slot{position:relative;width:min(400px,90vw);height:min(500px,80vh);perspective:1000px;z-index:2}.card-pocket{position:relative;z-index:3;width:100%;height:100%;background:linear-gradient(145deg,#e3bb7e,#f0e2c4);border-radius:4px;box-shadow:0 4px 8px #0000001a,inset 0 2px 4px #0000001a;padding:20px}.card-header{display:flex;justify-content:space-between;margin-bottom:8px;font-size:12px;color:#3a2f1b;letter-spacing:.05em;font-weight:400;opacity:.85}.card-title{text-align:center;margin:8px 0 12px;border-bottom:1px solid rgba(0,0,0,.2);padding-bottom:6px}.card-title .sub-title{font-size:14px;font-weight:700;color:#4a3b23;letter-spacing:.02em;margin-top:4px;opacity:.9}.login-form input,.signup-form input{background:transparent;border:none;border-bottom:1px solid #3a2f1b;font-family:Courier New,monospace;font-size:14px;padding:4px 2px;margin-bottom:12px;color:#2b2b2b;outline:none}.login-form input::placeholder,.signup-form input::placeholder{color:#3a2f1b80;font-style:italic}.login-button,.signup-button,.signup-toggle,.login-toggle{background:none;border:1px solid #3a2f1b;margin:5px;font-family:Courier New,monospace;font-size:13px;font-weight:700;text-transform:uppercase;color:#2b2b2b;padding:4px 8px;cursor:pointer;transition:all .2s ease}.login-button:hover,.signup-button:hover,.signup-toggle:hover,.login-toggle:hover{background:#3a2f1b0d}.pocket-front{display:flex;justify-content:center;align-items:center;flex-direction:column;position:absolute;color:#3b2d1f;font-weight:700;font-size:larger;bottom:0;left:0;right:0;height:60%;background:linear-gradient(145deg,#e3bb7e,#f0e2c4);border:1px solid rgba(0,0,0,.1);box-shadow:0 4px 8px #0000001a,inset 0 2px 4px #0000001a;border-radius:4px;z-index:4}.login-card,.signup-card{background:#f4e2b8;border:1px solid #c2a96d;border-radius:4px;padding:20px;height:50%;box-shadow:0 2px 4px #00000014;color:#2b2b2b;position:absolute;top:20px;left:20px;right:20px;bottom:20px;transition:all .5s cubic-bezier(.4,0,.2,1);transform-origin:center bottom;z-index:2}.login-card{transform:translateY(-15%) rotateX(0);opacity:1}.signup-card{transform:translateY(100%) rotateX(-10deg);opacity:0}.login-card.sliding-out,.signup-card.sliding-out{transform:translateY(85%) rotateX(-10deg);opacity:0}.signup-card.visible,.login-card.visible{transform:translateY(-15%) rotateX(0);opacity:1;z-index:2}.signup-card.invisible,.login-card.invisible{opacity:0}.background-text{position:absolute;top:0;left:0;right:0;bottom:0;color:#0000000f;font-size:2.5rem;line-height:2.9rem;padding-left:10%;padding-right:10%;z-index:0;pointer-events:none}.error-message{color:#f16b5e;font-size:medium;margin-top:1rem;max-width:60%}.success-message{color:#155724;font-size:medium;margin-top:1rem;max-width:60%}