@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&family=WDXL+Lubrifont+TC&display=swap");:root{--text-50:#f2f2f2;--text-100:#e6e6e6;--text-200:#cccccc;--text-300:#b3b3b3;--text-400:#999999;--text-500:#808080;--text-600:#666666;--text-700:#4d4d4d;--text-800:#333333;--text-900:#1a1a1a;--text-950:#0d0d0d;--background-50:#f2f2f2;--background-100:#e6e6e6;--background-200:#cccccc;--background-300:#b3b3b3;--background-400:#999999;--background-500:#808080;--background-600:#666666;--background-700:#4d4d4d;--background-800:#333333;--background-900:#1a1a1a;--background-950:#0d0d0d;--primary-50:#e5f4ff;--primary-100:#cce9ff;--primary-200:#99d3ff;--primary-300:#66bdff;--primary-400:#33a7ff;--primary-500:#0091ff;--primary-600:#0074cc;--primary-700:#005799;--primary-800:#003a66;--primary-900:#001d33;--primary-950:#000e1a;--secondary-50:#fbe9e9;--secondary-100:#f8d3d3;--secondary-200:#f0a8a8;--secondary-300:#e97c7c;--secondary-400:#e15151;--secondary-500:#da2525;--secondary-600:#ae1e1e;--secondary-700:#831616;--secondary-800:#570f0f;--secondary-900:#2c0707;--secondary-950:#160404;--accent-50:#fee6e6;--accent-100:#fdcece;--accent-200:#fb9d9d;--accent-300:#fa6b6b;--accent-400:#f83a3a;--accent-500:#f60909;--accent-600:#c50707;--accent-700:#940505;--accent-800:#620404;--accent-900:#310202;--accent-950:#190101}html{margin:0;padding:0;scroll-behavior:smooth;font-family:Roboto,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;font-variation-settings:"wdth" 100;color:var(--text-100);color-scheme:dark}:focus{outline:2px solid var(--primary-500)}body,html{max-width:100vw;overflow-x:hidden}body{margin:0;padding:0;background-color:var(--background-950);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.roboto{font-family:Roboto,sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;font-variation-settings:"wdth" 100}.wdxl-lubrifont-tc-regular{font-family:WDXL Lubrifont TC,sans-serif;font-weight:400;font-style:normal}a{color:inherit;text-decoration:none}::-webkit-scrollbar{display:none}.no-scroll{overflow:hidden;height:100vh}nav{justify-content:space-between;z-index:111;position:fixed;width:100%;top:0;height:70px}nav,nav div{display:flex;align-items:center}nav div{gap:1rem;margin-left:1rem}nav div:first-of-type{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:0 1rem;border-radius:.5rem;overflow:hidden}nav div h1{font-family:WDXL Lubrifont TC,sans-serif;font-weight:400;font-size:2rem;color:var(--text-50)}nav #shelfLink{background-color:var(--primary-950);width:100px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:1rem;color:var(--primary-600);margin-right:1rem}nav #shelfLink:hover{background-color:var(--primary-900)}nav button{background-color:var(--primary-950);width:100px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:1rem;font-size:1.2rem;border:none;outline:none;color:var(--primary-600);cursor:pointer;margin-right:1rem}nav button:hover{background-color:var(--primary-900)}.searchContainer{width:100%;height:100%;position:fixed;top:0;left:0;z-index:1000}.searchContainer,.searchPopUp{display:flex;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.searchPopUp{width:90%;max-width:1000px;max-height:800px;height:85%;background-color:var(--background-950);border-radius:1rem;flex-direction:column;gap:1rem;padding:1rem}.searchPopUp .searchResults{width:100%;height:90%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;overflow-y:scroll;border-radius:.5rem}.searchPopUp .searchPopUpHeader{width:95%;display:flex;justify-content:center;align-items:center;gap:2rem;padding:.5rem}.searchPopUp input{width:100%;height:20px;padding:.5rem;border:none;outline:none;border-radius:.5rem;font-size:1.2rem;background-color:var(--background-900);color:var(--text-100)}.searchPopUp .searchPopUpCloseBtn{width:40px;height:40px;border:none;outline:none;display:flex;justify-content:center;align-items:center;font-size:xx-large;background-color:var(--accent-950);color:var(--secondary-700);border-radius:.5rem;cursor:pointer}.searchPopUp .searchPopUpCloseBtn:hover{background-color:var(--secondary-900)}.searchResults #noResults,.searchResults #searchForResults{color:var(--text-700)}.searchResults #errorResult,.searchResults #loadingResult,.searchResults #noResults,.searchResults #searchForResults{width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-size:1.5rem}.searchResults #errorResult{color:var(--secondary-500)}.searchResults #loadingResult{color:var(--primary-500)}.heroSection{--dot-bg:var(--background-950);--dot-color:var(--text-400);--dot-size:1px;--dot-space:50px;width:100%;height:100vh;color:var(--text-100);background:linear-gradient(90deg,var(--dot-bg) calc(var(--dot-space) - var(--dot-size)),transparent 1%) 50% /var(--dot-space) var(--dot-space),linear-gradient(var(--dot-bg) calc(var(--dot-space) - var(--dot-size)),transparent 1%) 50% /var(--dot-space) var(--dot-space),var(--dot-color)}.heroContent,.heroSection{display:flex;justify-content:center;align-items:center;overflow:hidden}.heroContent{text-align:center;border-radius:50%;max-width:600px;width:95%;aspect-ratio:1;z-index:1;flex-direction:column;position:relative;background:radial-gradient(circle at center,var(--primary-700),var(--primary-950));box-shadow:0 0 60px 20px var(--primary-800),0 0 120px 80px rgba(0,0,0,.3) inset;animation:floatUp 2s ease-in-out infinite alternate}@keyframes floatUp{0%{transform:translateY(0)}to{transform:translateY(-10px)}}.heroLogo{display:flex;flex-direction:column;align-items:center;gap:1.2rem}.heroLogo h1{font-size:4rem;font-weight:800;margin:0;text-shadow:0 0 15px rgba(255,255,255,.1)}.heroLogo p{font-size:1.25rem;color:var(--text-300);margin-top:-1rem;margin-bottom:4rem}.heroCtaBtn{position:relative;font-weight:600;letter-spacing:.5px;font-size:1rem;padding:.8rem 1.6rem;border:none;border-radius:8px;cursor:pointer;color:white;z-index:0;overflow:hidden;bottom:20px;background:linear-gradient(145deg,var(--secondary-700),var(--secondary-500));box-shadow:0 0 15px var(--secondary-600)}.gameStackContainer{width:100%;margin-top:70px;padding:1rem 0;min-height:50vh;display:flex;align-items:start;justify-content:center;flex-wrap:wrap;gap:1rem}.resultItem{width:calc(50% - 2rem);min-width:330px;aspect-ratio:16/22;min-height:600px;background-color:var(--background-800);border-radius:.5rem;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:1rem;position:relative}.inGameStack{max-width:450px;width:95%;min-width:unset!important;margin:0;padding:0}.resultItem .storeList{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.5rem;margin-top:.5rem;width:90%}.resultItem .storeBadge{padding:.5rem;background-color:var(--background-950);border-radius:.5rem}#steam{background-color:#1e6b97;color:white}#epicgames{background-color:#000;color:white}#playstationstore{background-color:#003791;color:white}#xboxstore{background-color:#107c10;color:white}#xbox360store{background-color:#9bc848;color:black}#appstore{background-color:#0d96f6;color:white}#googleplay{background-color:#ffffff;color:#5f6368;border:1px solid #dadce0}#nintendostore{background-color:#e60012;color:white}.resultItem button{font-family:WDXL Lubrifont TC,sans-serif;font-weight:400;font-style:normal;font-size:larger;border:none;outline:none;padding:1rem 2rem;border-radius:.5rem;position:absolute;bottom:10px;width:90%;max-width:300px;cursor:pointer}.resultItem #addGameBtn{background-color:var(--primary-950);color:var(--primary-500)}.resultItem #addGameBtn:hover{background-color:var(--primary-900)}.resultItem #removeGameBtn{background-color:var(--secondary-950);color:var(--secondary-500)}.resultItem #removeGameBtn:hover{background-color:var(--secondary-900)}footer{width:100%;min-height:300px;display:flex;justify-content:space-evenly;align-items:center;flex-wrap:wrap;background-color:var(--background-900);color:var(--text-200);font-size:1rem;margin-top:2rem}footer div,footer div:nth-of-type(2){display:flex;justify-content:center;align-items:center}footer div:nth-of-type(2){background-color:var(--background-950);padding:1rem;gap:1rem;border-radius:1rem;color:var(--text-500)}footer div ul{list-style-type:none;padding:0}footer div ul li{margin:.5rem 0;height:35px;width:150px;display:flex;align-items:center}footer div ul li button{border:0;outline:0;width:150px;height:35px;border-radius:.5rem;cursor:pointer}footer div ul li:first-of-type button{background-color:var(--primary-950);color:var(--primary-500)}footer div ul li:first-of-type button:hover{background-color:var(--primary-900)}footer div ul li:nth-of-type(2) button{background-color:var(--accent-950);color:var(--accent-500)}footer div ul li:nth-of-type(2) button:hover{background-color:var(--accent-900)}footer div ul li a:hover{color:var(--text-300)}footer div h2{margin-left:.5rem;font-family:WDXL Lubrifont TC,sans-serif;font-weight:400;font-style:normal;font-size:xx-large}footer p{width:100%;text-align:center;color:var(--text-500)}.skeletonCard span{width:50%;height:20px;background-color:var(--text-600);border-radius:.5rem}.skeletonCard .storeList span{width:100px}.skeletonCard .skeletonImg{width:100%;aspect-ratio:16/9;background-color:var(--text-600)}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeletonCard .skeletonImg,.skeletonCard .storeList span,.skeletonCard span{background:linear-gradient(240deg,var(--text-600) 25%,var(--text-500) 50%,var(--text-600) 75%);background-size:200% 100%;animation:shimmer 3s linear infinite}.featuresSection{padding:6rem 2rem;color:var(--text-100);text-align:center}.featuresTitle{font-size:2.5rem;font-weight:800;margin-bottom:1rem;text-shadow:0 0 10px rgba(255,255,255,.05)}.featuresSubtitle{color:var(--text-400);font-size:1.2rem;max-width:600px;margin:0 auto 3rem}.featuresGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-gap:2rem;gap:2rem;max-width:1200px;margin:0 auto}.featureCard{background:radial-gradient(circle at top left,var(--primary-800),var(--primary-900));padding:2rem;border-radius:1rem;box-shadow:0 0 20px rgba(0,0,0,.25);transition:box-shadow .3s ease;border:1px solid var(--primary-700)}.featureCard:hover{box-shadow:0 0 30px var(--primary-700)}.featureCard h3{font-size:1.4rem;margin-bottom:.75rem;color:var(--primary-100)}.featureCard p{font-size:1rem;color:var(--text-300)}