/* New content preserves the original ASEN artwork and existing navigation. */
.popular-games{min-width:0;margin:0 0 24px;padding:12px 0;border-block:1px solid #d0a86733}
.popular-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 4px}
.popular-heading h2{font-size:18px;margin:0;font-weight:700;color:#f4e4c7}
.popular-heading button{border:0;background:none;color:#d5b47b;font-size:12px;min-height:32px;padding:4px 8px}
.popular-games [role=status]{margin:12px 4px;color:#b5b8c0;font-size:13px;line-height:1.5}
.popular-viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;min-width:0;padding:10px 0 4px;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.popular-viewport::-webkit-scrollbar{display:none}
.popular-track{display:flex;width:auto;will-change:auto}
.popular-group{display:flex;gap:3.975px;padding:0;flex:none;height:82px}
.popular-card{position:relative;isolation:isolate;display:flex;align-items:flex-start;justify-content:center;width:80px;height:82px;flex:0 0 80px;padding:0;border:0;background:none;color:#f4e4c7;text-align:center;overflow:visible}
.popular-card img{position:relative;flex:0 0 60px;width:60px;height:60px;aspect-ratio:1/1;object-fit:contain;border-radius:0;opacity:1;z-index:1;pointer-events:none;filter:none;box-shadow:none}
.popular-slot{position:absolute;inset:0;pointer-events:none}
.popular-slot::before{content:"";position:absolute;left:50%;top:33px;width:78px;height:36px;border-radius:9px 9px 11px 11px;background:rgba(255,255,255,.58);box-shadow:inset 0 1.998px 3px rgba(0,0,0,.32),inset 0 -.999px 0 rgba(255,255,255,.16),0 3.999px 4.998px rgba(0,0,0,.42);transform:translateX(-50%) perspective(61.998px) rotateX(54deg) scaleX(1.04);transform-origin:center bottom;pointer-events:none;z-index:0}
.popular-slot-back{z-index:0;clip-path:inset(-100px -100px calc(100% - 54.6px))}
.popular-slot-front{z-index:2;clip-path:inset(54.6px -100px -100px)}
.popular-card::after{content:"★";position:absolute;left:11px;top:1px;z-index:3;color:#ee1c24;font-size:7px;line-height:1;text-shadow:52px 0 0 #ee1c24,0 52px 0 #ee1c24,52px 52px 0 #ee1c24;pointer-events:none}
.popular-name{display:none}
.popular-card:focus-visible{outline:2px solid #e6bf7a;outline-offset:-2px;border-radius:6px}
.popular-moving .popular-track{animation:none;will-change:auto}
.popular-paused .popular-track,.popular-viewport:hover .popular-track,.popular-viewport:focus-within .popular-track,.popular-viewport:active .popular-track{animation-play-state:paused}
@keyframes popular-drift{to{transform:translate3d(var(--popular-distance),0,0)}}
@media(prefers-reduced-motion:reduce){.popular-moving .popular-track{animation:none;will-change:auto}.popular-group[aria-hidden=true]{display:none}}
/* Title, original art, and the entry arrow occupy three independent rows. */
#homeCategoryGrid>.category-card{display:grid;grid-template-rows:auto minmax(78px,1fr) auto;justify-items:center;align-items:center;gap:7px;padding:12px;min-height:184px;text-align:center}
#homeCategoryGrid>.category-card>strong{grid-row:1;align-self:start;margin:0;width:100%;font-size:16px}
#homeCategoryGrid>.category-card>.category-card-art{position:relative;grid-row:2;inset:auto;width:100%;height:100%;max-height:118px;min-height:0;object-fit:contain;object-position:center;z-index:1}
#homeCategoryGrid>.category-card>small{grid-row:3;align-self:end;width:100%;margin:0;font-size:11px;line-height:1.3}
html.asen-landscape #homeCategoryGrid>.category-card{min-height:174px;grid-template-rows:auto minmax(72px,1fr) auto;padding:10px}
html.asen-landscape #homeCategoryGrid>.category-card>.category-card-art{max-height:100px}

.popular-preview{position:fixed;max-width:min(86vw,360px);padding:36px 24px 20px;border:1px solid #d5b47b;border-radius:16px;background:#141b25;color:#f4e4c7;text-align:center;box-sizing:border-box}
.popular-preview::backdrop{background:#000b}
.popular-preview>img{display:block;width:100%;height:220px;object-fit:contain;margin:auto}
.popular-preview-close{position:absolute;right:6px;top:4px;width:40px;height:40px;background:transparent;border:0;color:inherit;font-size:28px}
.popular-preview h3{font-size:18px;margin:12px 0 8px}.popular-preview p{font-size:13px;color:#b5b8c0}
@media(max-height:450px){.popular-preview{max-width:300px;padding:28px 20px 10px}.popular-preview>img{height:150px}.popular-preview h3{margin:6px 0}}

.popular-viewport:active{cursor:grabbing}

html.asen-touch-guard body .popular-viewport,html.asen-touch-guard body .popular-viewport *{touch-action:pan-y!important}
