img.gi{display:block;object-fit:cover}.th img.gi{width:100%;height:100%;border-radius:inherit}.tile .te img.gi{width:52px;height:52px;border-radius:12px}.gemo img.gi{width:96px;height:96px;border-radius:22px;margin:0 auto}.pb-e img.gi{width:clamp(80px,12vw,140px);height:clamp(80px,12vw,140px);border-radius:26px}.gfr{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;z-index:1}#fsb{z-index:5}
#dnote{display:none;max-width:320px;text-align:center;font-weight:800;line-height:1.4;color:#ffd0d0;background:rgba(0,0,0,.6);padding:12px 16px;border-radius:14px;margin:0 16px;position:relative}
#start.dsk #dnote{display:block}#start.dsk .playbtn{display:none}#gemo.gimg{opacity:1}
#start.hasimg{overflow:hidden}
#start.hasimg::before{content:"";position:absolute;inset:0;background:var(--gimg) center/cover;filter:blur(22px) brightness(.55);transform:scale(1.2);z-index:0}
@media(max-width:900px){
#gemo.gimg{position:absolute!important;inset:0;display:grid;place-items:center;font-size:0!important;opacity:1!important;animation:none!important;filter:none!important;pointer-events:none;z-index:0}
#gemo.gimg img.gi{height:92%!important;width:auto!important;aspect-ratio:1;max-width:92%;border-radius:24px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
}
#start h2{text-shadow:0 2px 6px rgba(0,0,0,.7)}
.tile .te.teimg{left:0;top:0;width:100%;height:100%;transform:none;filter:none}
.tile .te.teimg img.gi{width:100%;height:100%;border-radius:0}
.tile:hover .te.teimg{transform:scale(1.06);animation:none}
@media(max-width:900px){
.pills{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden;justify-content:flex-start!important;gap:8px!important;padding:4px 2px 6px!important;scrollbar-width:none;-webkit-overflow-scrolling:touch;max-width:100%}
.pills::-webkit-scrollbar{display:none}
.pill{flex:none!important;width:62px;min-width:62px!important;height:62px!important;padding:4px!important;border-radius:16px!important;flex-direction:column;gap:3px!important;justify-content:center}
.ptx{display:block!important;font-size:8.5px!important;letter-spacing:0;line-height:1}
.pic{font-size:22px!important}.pic svg{width:22px;height:22px}
}
#shr{display:flex;gap:10px;overflow-x:auto;padding:6px 2px}#shr img{height:170px;width:auto;border-radius:12px;cursor:zoom-in;flex:none}
#lb{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:9999;display:grid;place-items:center;cursor:zoom-out}#lb img{max-width:94vw;max-height:90vh;border-radius:12px}
.plays{display:inline-flex;align-items:center;gap:6px;font-weight:800;margin-right:14px;white-space:nowrap}
#pvb{background:#fff3cd;color:#7a5a00;font-weight:800;padding:10px 14px;border-radius:12px;margin:10px 0;text-align:center}
@media(min-width:901px){
#gemo.gimg{position:relative!important;inset:auto!important;display:block;font-size:0!important;opacity:1!important;animation:none!important;filter:none!important;pointer-events:none;z-index:1}
#gemo.gimg img.gi{width:clamp(96px,13vw,150px)!important;height:auto!important;aspect-ratio:1;border-radius:26px;box-shadow:0 12px 30px rgba(0,0,0,.45)}
#start.hasimg{gap:14px}
}
#start p{display:none!important}
@media(max-width:900px){#start h2{display:none}}
/* hover shine: keeps sweeping while the cursor is on the game */
.card::after,.tile::after{z-index:6;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.7) 50%,transparent 62%)}
@keyframes shineLoop{0%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
@media(hover:hover){.card:hover::after,.tile:hover::after{display:block;animation:shineLoop 1.1s linear infinite;transition:none}}
/* popular banner: real sliding */
.pban{touch-action:pan-y}
.pban .pb-s{opacity:1;transform:translateX(100%);transition:transform .65s cubic-bezier(.22,.8,.2,1);pointer-events:none}
.pban .pb-s.l{transform:translateX(-100%)}
.pban .pb-s.on{transform:none;pointer-events:auto}
/* screenshot viewer */
#lb{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:9999;display:grid;place-items:center;touch-action:pan-y}
#lb img{max-width:92vw;max-height:84vh;border-radius:12px;animation:lbIn .25s ease}
@keyframes lbIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
#lb button{position:absolute;border:0;background:rgba(255,255,255,.18);color:#fff;font:700 34px/1 system-ui,sans-serif;width:46px;height:46px;border-radius:50%;cursor:pointer;display:grid;place-items:center;padding:0}
#lb button:hover{background:rgba(255,255,255,.35)}
#lb .lbx{top:14px;right:14px;font-size:30px}#lb .lbp{left:12px;top:50%;transform:translateY(-50%)}#lb .lbn{right:12px;top:50%;transform:translateY(-50%)}
#lb .lbc{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:#fff;font:700 14px system-ui,sans-serif;background:rgba(0,0,0,.45);padding:4px 12px;border-radius:99px}
/* more from this developer */
#devr{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}

#rot{position:absolute;inset:0;z-index:4;display:grid;place-items:center;text-align:center;padding:24px;background:rgba(5,12,30,.93);color:#fff;font:800 20px/1.45 system-ui,sans-serif}

html.fsmode,html.fsmode body{overflow:hidden!important;overscroll-behavior:none;touch-action:manipulation}
.stage.fs .gfr{width:100%;height:100%}
