styles.css

 *{margin:0;padding:0;box-sizing:border-box;scrollbar-width:none}*::-webkit-scrollbar{display:none}#whiteScreen{z-index:1001;position:fixed;width:100%;height:100%;top:0;left:0;background-color:var(--white);opacity:1}#loading{position:fixed;width:100%;height:100%;top:0;left:0;z-index:1080;overflow:hidden}#blackRectangle{position:absolute;width:100%;height:0;bottom:0;left:0;background-color:var(--black);transition:all .5s}#glitchText{position:absolute;color:var(--white);font-size:5vw;font-family:'Krona One',sans-serif;top:50%;left:50%;transform:translate(-50%,-50%);opacity:1;transition:all .1s;max-height:100%;max-width:100%;overflow:hidden;text-align:center}@keyframes shrink{0%{transform:scale(1)}100%{transform:scale(.5)}}.shrink-animation{animation:shrink 2s forwards;opacity:0}.h1{color:var(--white);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:1}:root{--black:rgb(0,0,0);--white:rgb(255,255,255);--blue:rgb(20,33,61);--yellow:rgb(252,163,17);--gray:rgb(229,229,229);--glass:rgba(229,229,229,.6);--blurredGlass:rgba(229,229,229,.3);--transparent:rgba(255,255,255,.1);--shadow:var(0,0,0,.2)}#ending{position:fixed;top:0;left:0;width:100%;height:100vh;overflow:hidden;z-index:9999;pointer-events:none}.overlay-rectangle{position:absolute;width:100%;top:-100vh;background:var(--black);pointer-events:all}#overlay-rectangle-1{height:100vh;z-index:9998}#overlay-rectangle-2{height:30vh;z-index:9997}#overlay-rectangle-3{height:15vh;z-index:9996}#overlay-rectangle-4{height:100vh;background:var(--white);z-index:9995}body{margin:0;padding:0;min-height:100vh;background:var(--white);font-family:'Krona One',sans-serif}#page-content{height:100%;width:100%;overflow-y:scroll;z-index:1}h2{font-family:'Krona One',sans-serif;color:var(--black);font-size:2.8rem;text-shadow:0 0 5px var(--shadow)}#secret-guest{font-family:'Mrs Saint Delafield',cursive;font-size:2.8rem;color:var(--blue);text-decoration:none;transition:color .3s}#secret-guest:hover{color:var(--blue)}label,p{font-size:.9rem;color:var(--black);text-shadow:0 0 5px var(--shadow)}input[type="text"]{background-color:var(--white);width:100%;padding:.5rem 1rem;margin-bottom:1rem;border:1px solid var(--glass);border-radius:4px;font-size:1rem;color:var(--black);transition:border-color .3s}input[type="text"]:focus{border-color:var(--blue);outline:none}input[type="checkbox"]{margin-right:.5rem}#intro360{position:fixed;top:0;left:0;z-index:-5}.centerBtn{display:flex;justify-content:center;align-items:center}.SFcontainer{display:flex;justify-content:center;align-items:center}.SFbtn{text-decoration:none;font-size:1rem;text-transform:uppercase;letter-spacing:2px;padding:8px 4px;color:var(--white);position:relative;z-index:0;border-radius:50px;transition:color .5s ease-in-out,transform .5s ease-in-out}.SFbtn:before{content:'';position:absolute;top:0;left:0;width:calc(100%);height:calc(100%);background:var(--blue);z-index:-1;border-radius:50px;transform:scaleX(1);transition:transform .5s ease-in-out,border-radius .5s ease-in-out}.SFbtn:after{content:"";position:absolute;width:100%;height:100%;top:0;left:0;border-radius:50px;box-shadow:0 8px 15px var(--shadow);transition:box-shadow .5s ease-in-out,border-radius .5s ease-in-out}.SFbtn:hover{color:var(--shadow)}.SFbtn:hover:before{transform:scaleX(0);border-radius:8px}.SFbtn:hover:after{box-shadow:0 0 0 var(--shadow);border-radius:8px}@media (max-width:570px){h2{font-size:1.8rem}#secret-guest{font-size:1.8rem}#secret-guest:hover{color:var(--blue)}label,p{font-size:.9rem}}#customPointer{width:28px;height:28px;position:fixed;z-index:777;top:-10%;pointer-events:none;border-radius:50%;transition:width .1s,height .1s,border-radius .1s cubic-bezier(.19,1,.22,1);background-color:var(--white);mix-blend-mode:difference}#customPointer.mouRectangle{border-radius:0!important;background-color:var(--white)!important;transition:border-radius .3s cubic-bezier(.19,1,.22,1),width .3s,height .3s,transform .3s;opacity:1}button,a{cursor:pointer}.pocketCard{perspective:1000px;transform-style:preserve-3d;animation:out .1s ease-out forwards}.pocketCard:hover{animation:in .3s ease-in forwards}@keyframes in{0%{transform:scale(1)}100%{transform:scale(1.02)}}@keyframes out{0%{transform:scale(1.02)}100%{transform:scale(1)}}.card{perspective:800px;transform-style:preserve-3d}.card-content{width:100%;height:100%;overflow:hidden;background:var(--blurredGlass);border-radius:2%;border-left:1px solid var(--blurredGlass);border-top:1px solid var(--blurredGlass);backdrop-filter:blur(10px);box-shadow:20px 20px 40px -6px var(--shadow);transition:all .3s ease-in-out;padding:2%}.posiCard{margin-top:15%;margin-left:15%;margin-right:15%;margin-bottom:15%}.glowMou::after{content:'';position:absolute;pointer-events:none;top:var(--mouse-y);left:var(--mouse-x);width:100%;height:100%;border-radius:50%;transform:translate(-50%,-50%);opacity:0;transition:opacity .3s;filter:blur(28px) brightness(1.1);background:radial-gradient(circle at center,rgba(255,255,255,.4) 0%,rgba(213,216,225,.2) 28%,rgba(158,173,194,0) 50%);box-shadow:0 0 28px rgba(208,212,219,.4)}.glowMou.glowing::after{opacity:1}#images-container{margin:2%;padding:2%}#qr-code-container img,#barcode-container img{transition:transform .3s ease-in-out}#qr-code-container img:hover,#barcode-container img:hover{transform:scale(1.05)}label{margin-right:1rem}input[type="checkbox"],#generate-btn{vertical-align:middle}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}body,h1,label,input,#folder-label{animation:fade-in .5s}