@charset "UTF-8";
body{--spacing:2em;display:block;}


/* Home slider */
#HomeCover{position:relative;}
#HomeCover>.inner{max-width:var(--MaxContentWidth);margin-inline:auto;padding:calc(var(--spacing) * 1.5) var(--spacing);box-sizing:border-box;display:flex;flex-direction:column;gap:var(--spacing);}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){
	#HomeCover{--spacing:1.5em;}
	#HomeCover>.inner{padding-block:var(--spacing);}
}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#HomeCover{--spacing:1em;}
}

#home_slider{touch-action:pan-y;border-radius:1em;overflow:hidden;position:relative;}
#home_slider .list{display:flex;}
#home_slider .slide{flex:none;display:block;width:100%;max-width:1000px;aspect-ratio:1000/360;border-radius:1em;color:inherit;background:var(--background-color-L3,#fff);overflow:hidden;transition:filter 300ms,opacity 300ms;}
#home_slider .slide img{display:block;width:100%;height:100%;aspect-ratio:inherit;object-fit:cover;border-radius:inherit;transition:transform 300ms;}
#home_slider .slide:hover img{transform:scale(102.4%)}
#home_slider .slide:not(.active){opacity:.25;filter:grayscale(1);pointer-events:none;}

#home_slider .nav{position:absolute;inset-block:0;z-index:1;width:calc((100% - 1000px) / 2 - 2em);display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity 300ms;}
#home_slider .nav::before{content:attr(icon);display:block;font-size:3em;width:1em;height:1em;line-height:1;overflow:hidden;color:#fff;}
#home_slider .nav:hover{opacity:1;}
#home_slider .prev{inset-inline-start:0}
#home_slider .next{inset-inline-end:0}

#home_slider_bg{position:absolute;inset:0;z-index:-1;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,rgba(0 0 0 / 100%),rgba(0 0 0 / 0));mask-image:linear-gradient(180deg,rgba(0 0 0 / 100%),rgba(0 0 0 / 0));}
#home_slider_bg .list{width:100%;height:100%;}
#home_slider_bg .bg{position:absolute;inset:0;z-index:1;background-color:var(--background-color);background-image:linear-gradient(135deg,hsl(var(--offset-h1) var(--offset-s1) var(--offset-l1)),hsl(var(--offset-h2) var(--offset-s2) var(--offset-l2)));background-size:cover;transition:opacity 1000ms;}
#home_slider_bg .bg:not(.show){z-index:0;opacity:0;transition-delay:1000ms;}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){
	#home_slider .nav{display:none;}
}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#home_slider{max-width:35em;margin-inline:auto;}
	#home_slider .slide{aspect-ratio:16/9;}
}


/* Popular Games & New Games */
#HomeGames{margin-block:var(--spacing);}
#HomeGames>.inner{max-width:var(--MaxContentWidth);margin-inline:auto;padding-inline:var(--spacing);box-sizing:border-box;display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing) calc(var(--spacing) * 2);}

.home_games{display: grid;grid:"title" auto "list" 1fr;gap:var(--spacing);}
.home_games .title{grid-area:title;}
.home_games .list{grid-area:list;}
.home_games .title{}
.home_games .title h3{font-size:var(--SiteFS-XL);font-weight:var(--CPT-FW-EB);text-transform:uppercase;}
.home_games .list{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-size,12em),1fr));align-items:start;gap:var(--gap,var(--spacing));--w:10em;}
.home_games .game{display:flex;flex-direction:column;gap:.75em;color:inherit;}
.home_games .game:hover .img img{transform:scale(105%);}
.home_games .img{width:var(--w);height:calc(var(--w) * 4 / 3);border-radius:calc(var(--w) / 10);overflow:hidden;background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 0 0 1px;}
.home_games .img>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 300ms;}
.home_games .info{}
.home_games .name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;height:3em;text-overflow:ellipsis;overflow:hidden;}
.home_games .nav{display:none;}
@media only screen and (max-width:1440px){
	.home_games .list{--column-size:10em;}
}
@media only screen and (max-width:1280px){
	#HomeGames>.inner{gap:var(--spacing);}
	.home_games .list{--column-size:9em;--gap:1em;--w:8.5em;}
}
@media only screen and (min-width:1001px){
	.home_games .list{transform: unset !important;}
}
@media only screen and (max-width:1000px){
	#HomeGames>.inner{grid-template-columns:auto;}

	.home_games .title h3{font-size:var(--SiteFS-L);}
	.home_games{position:relative;overflow:hidden;margin-inline:calc(var(--spacing) * -1);padding-inline:var(--spacing);}
	.home_games .list{--column-size:8em;--gap:0;--w:8em;display:flex;margin-inline:calc(var(--spacing) * -1);padding-inline:var(--spacing);touch-action:pan-y;}
	.home_games .game{flex:none;width:calc(var(--column-size) + var(--spacing) - 12px);}

	.home_games .nav{position:absolute;inset-block:0;z-index:1;margin-block:auto;width:fit-content;height:fit-content;border-radius:var(--CPT-BDR);cursor:pointer;color:#fff;background:var(--SiteTHM);}
	.home_games .nav::before{content:attr(icon);font-size:1.5em;margin:.5em;}
	.home_games .prev{inset-inline-start:0;}
	.home_games .next{inset-inline-end:0;}

	/* @media (any-pointer: coarse) {} */
	@media (any-hover) {
		.home_games:hover .nav:not(.disabled),
		.home_games:active .nav:not(.disabled),
		.home_games:focus-within .nav:not(.disabled){display:block;}
	}
}
@media only screen and (max-width:800px){
	#HomeGames{--spacing:1.5em;}
}
@media only screen and (max-width:480px){}


/* Hot items */
#HomeItems{margin-block:var(--spacing);}
#HomeItems>.inner{max-width:var(--MaxContentWidth);margin-inline:auto;padding-inline:var(--spacing);box-sizing:border-box;}

.home_items{display:flex;flex-direction:column;gap:var(--spacing);padding:var(--spacing);border-radius:1em;background:var(--background-color-L3,#fff);overflow:hidden;--CPT-US:2em;}
.home_items .title{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing);}
.home_items .title h3{font-size:var(--SiteFS-L);font-weight:var(--CPT-FW-B);}
.home_items .title .refresh{--icon-order:9;--font-weight:var(--CPT-FW);}
.home_items .list{display:grid;grid-template-columns:repeat(var(--column-count,8),1fr);gap:var(--gap,var(--spacing));min-width: 100%;}
.home_items .item{display:flex;flex-direction:column;gap:.75em;color:inherit;border-radius:.25em;transition:color 300ms;}
.home_items .item:hover{color:var(--SiteTHM);}
.home_items .img{width:var(--w,100%);aspect-ratio:1/1;border-radius:.5em;background-color:var(--background-color-L3,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 0 0 1px;overflow:hidden;}
.home_items .img>img{display:block;width:100%;height:100%;object-fit:cover;}
.home_items .name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:3em;text-overflow:ellipsis;overflow:hidden;margin-block-end:auto;}
.home_items .nav{display:none;}
@media only screen and (max-width:1280px){
	.home_items{--column-count:7;--gap:1.5em;}
}
@media only screen and (min-width:1001px){
	.home_items .list{transform: unset !important;}
}
@media only screen and (max-width:1000px){
	#HomeItems>.inner{padding:unset;}
	.home_items{position:relative;--gap:0;--w:10em;}
	.home_items .list{touch-action:pan-y;display:flex;flex-direction:column;flex-wrap:wrap;max-height:calc((var(--w) + .75em * 2 + 3em + 1.5em) * 2 + 12px);}
	.home_items .item{flex:none;width:calc(var(--w) + var(--spacing) - 12px);}
	.home_items .name{height:3em;}

	.home_items .nav{position:absolute;inset-block-start:0;z-index:1;margin-block-start:calc(var(--spacing) * 2 + var(--CPT-US) + var(--w) / 2 - 1.5em);width:fit-content;height:fit-content;border-radius:var(--CPT-BDR);cursor:pointer;color:#fff;background:var(--SiteTHM);}
	.home_items .nav::before{content:attr(icon);font-size:1.5em;margin:.5em;}
	.home_items .prev{inset-inline-start:0;}
	.home_items .next{inset-inline-end:0;}

	/* @media (any-pointer: coarse) {} */
	@media (any-hover) {
		.home_items:hover .nav:not(.disabled),
		.home_items:active .nav:not(.disabled),
		.home_items:focus-within .nav:not(.disabled){display:block;}
	}
}
@media only screen and (max-width:800px){
	#HomeItems{--spacing:1.5em;}
	.home_items .title h3{font-size:var(--SiteFS);}
}
@media only screen and (max-width:480px){
	.home_items{--w:9em;}
	.home_items .title .refresh>span{display:block;padding:0;width:var(--icon-size);height:var(--icon-size);margin:calc((var(--CPT-US) - var(--icon-size)) / 2);}
}


#HomeNews{margin-block:var(--spacing);}
#HomeNews>.inner{width:100%;max-width:var(--MaxContentWidth);margin-inline:auto;padding-inline:var(--spacing);box-sizing:border-box;}

.home_news{display:flex;flex-direction:column;gap:var(--spacing);padding:var(--spacing);border-radius:1em;background:var(--background-color-L3,#fff);overflow:hidden;--CPT-US:2em;}
.home_news .title{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing);}
.home_news .title h3{font-size:var(--SiteFS-L);font-weight:var(--CPT-FW-B);}
.home_news .title .more{--icon-order:9;--font-weight:var(--CPT-FW);}
.home_news .list{display:grid;grid-template-columns:repeat(4,1fr);align-items:start;gap:var(--gap,var(--spacing));}
.home_news .news{display:flex;flex-direction:column;gap:.75em;color:inherit;transition:color 300ms;}
.home_news .news:hover{color:var(--SiteTHM)}
.home_news .img{width:var(--w,100%);aspect-ratio:16/9;border-radius:.5em;overflow:hidden;background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 0 0 1px;}
.home_news .img>img{display:block;width:100%;height:100%;object-fit:cover;}
.home_news .headline{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:3em;text-overflow:ellipsis;overflow:hidden;}
.home_news .nav{display:none;}
@media only screen and (max-width:1280px){}
@media only screen and (min-width:1001px){
	.home_news .list{transform: unset !important;}
}
@media only screen and (max-width:1000px){
	#HomeNews>.inner{padding:unset;}
	.home_news{position:relative;--gap:0;--w:22em;}
	.home_news .list{touch-action:pan-y;display:flex;}
	.home_news .news{flex:none;width:calc(var(--w) + var(--spacing) - 12px);}

	.home_news .nav{position:absolute;inset-block-start:0;z-index:1;margin-block-start:calc(var(--spacing) * 2 + var(--CPT-US) + var(--w) / 16 * 9 / 2 - 1.5em);width:fit-content;height:fit-content;border-radius:var(--CPT-BDR);cursor:pointer;color:#fff;background:var(--SiteTHM);}
	.home_news .nav::before{content:attr(icon);font-size:1.5em;margin:.5em;}
	.home_news .prev{inset-inline-start:0;}
	.home_news .next{inset-inline-end:0;}

	/* @media (any-pointer: coarse) {} */
	@media (any-hover) {
		.home_news:hover .nav:not(.disabled),
		.home_news:active .nav:not(.disabled),
		.home_news:focus-within .nav:not(.disabled){display:block;}
	}
}
@media only screen and (max-width:800px){
	#HomeNews{--spacing:1.5em;}
	.home_news .title h3{font-size:var(--SiteFS);}
}
@media only screen and (max-width:480px){
	.home_news{--w:19.5em;}
	.home_news .title .more>span{display:block;padding:0;width:var(--icon-size);height:var(--icon-size);margin:calc((var(--CPT-US) - var(--icon-size)) / 2);}
}


#HomeGuide{margin-block:var(--spacing);}
#HomeGuide>.inner{width:100%;max-width:var(--MaxContentWidth);margin-inline:auto;padding-inline:var(--spacing);box-sizing:border-box;}

.home_guide{display:flex;flex-direction:column;gap:var(--spacing);padding:var(--spacing);border-radius:1em;background:var(--background-color-L3,#fff);overflow:hidden;--CPT-US:2em;}
.home_guide .title{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing);}
.home_guide .title h3{font-size:var(--SiteFS-L);font-weight:var(--CPT-FW-B);}
.home_guide .title .more{--icon-order:9;--font-weight:var(--CPT-FW);}
.home_guide .list{display:grid;grid-template-columns:repeat(4,1fr);align-items:start;gap:var(--gap,var(--spacing));}
.home_guide .article{display:flex;flex-direction:column;gap:1em;color:inherit;padding:1.5em;border-radius:.5em;background-color:var(--CPT-BGC,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0 / 5%)) 0 0 0 1px inset;overflow:hidden;transition:color 300ms,box-shadow 300ms;}
.home_guide .article:hover{color:var(--SiteTHM);box-shadow:var(--SiteTHM) 0 0 0 var(--CPT-BDW) inset;}
.home_guide .article_title{font-size:var(--SiteFS-L);font-weight:var(--CPT-FW-B);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;hyphens:auto;}
.home_guide .article_description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;max-height:6em;text-overflow:ellipsis;overflow:hidden;}
@media only screen and (max-width:1280px){
	.home_guide .list{grid-template-columns:repeat(2,1fr);}
}
@media only screen and (max-width:1000px){
	#HomeGuide>.inner{padding:unset;}
}
@media only screen and (max-width:800px){
	#HomeGuide{--spacing:1.5em;}
}
@media only screen and (max-width:480px){
	.home_guide .list{display:flex;flex-direction:column;}
}