#root{overflow-y:hidden}.card-container{width:120px;height:180px;perspective:1000px;cursor:pointer;border-radius:10px;position:relative}.card-exit{transform:scale(.5);opacity:0;transition:transform .5s ease,opacity .5s ease}@media (max-width: 360px){.card-container{width:60px;height:90px}}@media (max-width: 500px) and (min-width: 361px){.card-container{width:90px;height:125px}}.card{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .6s;border-radius:10px;box-shadow:0 4px 6px #0000001a}.card-front,.card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:10px;overflow:hidden}.card-front img,.card-back img{width:100%;height:100%;object-fit:cover}.card-back{transform:rotateY(180deg)}html,body{margin:0;padding:0;overflow:hidden;height:100%}.App{width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;position:fixed;background:#1a2b3c;overflow:hidden}.background-image{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);min-width:105%;min-height:105%;background:url(/images/background3.jpg) center center no-repeat;background-size:cover;z-index:1}.background-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0003;z-index:2}.content{position:relative;z-index:3;width:100%;height:100%;display:flex;flex-direction:column;align-items:center}h1{margin-top:100px;margin-bottom:40px;font-size:28px;color:#ffea9b;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.5),-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;z-index:4;font-weight:700;letter-spacing:1px}.h1-div{position:relative;width:100%;height:10%;top:-45%}.cards-container{flex:1;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-height:60vh;margin:0;padding:0}.selected-cards-wrapper{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%;display:flex;flex-direction:row;justify-content:center;align-items:center}.card-grid{display:flex;flex-wrap:wrap;justify-content:center;top:-5%;align-items:center;gap:45px;position:relative;z-index:4;width:fit-content;margin:0}.button-container{position:fixed;bottom:15%;left:0;right:0;width:100%;display:flex;justify-content:center;align-items:center;z-index:5;will-change:opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden;perspective:1000px}.continue-button{padding:12px 40px;font-size:18px;color:#ffea9b;border:none;border-radius:6px;cursor:pointer;box-shadow:0 4px 6px #0003;text-transform:none;font-weight:400;white-space:nowrap;background-size:cover;background-position:center;background-repeat:no-repeat;-webkit-font-smoothing:antialiased;transform:translateZ(0);margin:0 auto;position:relative}.continue-button:hover{box-shadow:0 6px 8px #0000004d}@media (max-width: 800px){.h1-div{top:-50%}}@media (max-width: 500px){.background-image{min-width:130%;min-height:130%}h1{margin-top:40px;font-size:24px;margin-bottom:30px}.h1-div{top:-35%}.cards-container{min-height:50vh}.card-grid{display:flex;grid-template-columns:repeat(4,90px);grid-template-rows:repeat(2,90px);row-gap:30px;gap:25px}.card{width:90px;height:135px}.continue-button{padding:10px 30px;font-size:16px}}@media (max-width: 360px){h1{font-size:22px;margin-top:30px}.card-grid{grid-template-columns:repeat(4,60px);gap:10px}.card{width:60px;height:90px}}@media (orientation: landscape) and (max-height: 500px){.cards-container{min-height:40vh}.h1-div{top:-68%}.card-grid{top:-5%;grid-template-columns:repeat(4,90px);gap:10px}.button-container{bottom:5%}}@media (min-width: 1600px){.background-image{min-width:102%;min-height:102%}}