.game-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));display:grid}.game-card{background:var(--card);border:2px solid color-mix(in srgb, var(--game-accent) 35%, var(--border));border-radius:var(--radius-xl);min-width:0;box-shadow:0 5px 0 color-mix(in srgb, var(--game-accent) 28%, var(--background));transition:transform var(--motion-normal), box-shadow var(--motion-normal), border-color var(--motion-normal);flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.game-card:hover{border-color:var(--game-accent);box-shadow:0 8px 0 color-mix(in srgb, var(--game-accent) 45%, var(--background)), var(--shadow-card);transform:translateY(-5px)}.game-card:active{transform:translateY(1px)}.card-loading{height:3px;z-index:var(--z-overlay);pointer-events:none;position:absolute;inset:0 0 auto}.game-card-image{aspect-ratio:1.5;background:var(--game-surface);position:relative;overflow:hidden}.game-card-image img{object-fit:cover;width:100%;height:100%;transition:transform var(--motion-normal)}.game-card:hover img{transform:scale(1.035)}.game-tag{color:var(--on-game-accent);background:var(--game-accent);border-radius:var(--radius-pill);padding:7px 12px;font-size:14px;font-weight:750;position:absolute;top:16px;left:16px}.card-play{border-radius:var(--radius-pill);background:var(--game-accent);width:56px;height:56px;color:var(--on-game-accent);box-shadow:var(--shadow-card);place-items:center;display:grid;position:absolute;bottom:18px;right:18px}.game-card-copy{flex-direction:column;flex:1;padding:20px;display:flex}.game-card-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.game-card-heading h3{letter-spacing:-1px;margin:0;font-size:32px;font-weight:900}.game-category{color:var(--muted-foreground);margin-top:4px;font-size:14px}.game-card-copy p{color:var(--muted-foreground);margin:12px 0 20px;font-size:15px;line-height:1.65}.card-bottom{border-top:1px solid var(--border);color:var(--muted-foreground);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:18px;font-size:12px;display:flex}.card-cta{color:var(--on-game-accent);background:var(--game-accent);border-radius:var(--radius-pill);align-items:center;gap:6px;padding:8px 14px;font-size:14px;font-weight:700;display:flex}.popular-badge{--popular-cycle:5.5s;top:var(--space-3);left:var(--space-3);z-index:1;border-radius:var(--radius-pill);background:var(--game-accent);color:var(--on-game-accent);border:1px solid color-mix(in srgb,var(--on-game-accent) 22%,var(--game-accent));box-shadow:0 2px 0 color-mix(in srgb,var(--on-game-accent) 45%,transparent),var(--shadow-card);pointer-events:none;isolation:isolate;transform-origin:30% 70%;animation:popular-badge-bounce var(--popular-cycle) ease-in-out infinite;align-items:center;gap:7px;padding:8px 12px;font-size:13px;font-weight:850;line-height:1.2;display:inline-flex;position:absolute;overflow:hidden}.popular-badge svg{transform-origin:50% 80%;width:17px;height:17px;animation:popular-star-bounce var(--popular-cycle) ease-in-out infinite;flex-shrink:0}.popular-badge:after{content:"";opacity:0;pointer-events:none;width:45%;animation:popular-badge-shimmer var(--popular-cycle) ease-in-out infinite;background:linear-gradient(100deg,#0000,#ffffff85,#0000);position:absolute;inset:-30% auto -30% -65%;transform:translate(0)skew(-18deg)}@keyframes popular-star-bounce{0%,5%,24%,to{transform:translateY(0)rotate(0)scale(1)}8%{transform:translateY(1px)rotate(-10deg)scale(1.08,.88)}12%{transform:translateY(-4px)rotate(16deg)scale(.95,1.08)}16%{transform:translateY(1px)rotate(-8deg)scale(1.12,.88)}20%{transform:translateY(-2px)rotate(5deg)scale(1)}}@keyframes popular-badge-bounce{0%,23%,42%,to{transform:translateY(0)scale(1)}28%{transform:translateY(-2px)scale(1.035)}33%{transform:translateY(1px)scale(.985)}37%{transform:translateY(-1px)scale(1.01)}}@keyframes popular-badge-shimmer{0%,23%{opacity:0;transform:translate(0)skew(-18deg)}26%{opacity:1}39%{opacity:1;transform:translate(400%)skew(-18deg)}42%,to{opacity:0;transform:translate(400%)skew(-18deg)}}@media (prefers-reduced-motion:reduce){.popular-badge,.popular-badge svg,.popular-badge:after{animation:none}.popular-badge:after{display:none}}