.play-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.play-tile{background:var(--surface);border:.5px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-md);transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);flex-direction:column;display:flex;overflow:hidden}.play-tile:hover{box-shadow:var(--shadow-lift), 0 24px 48px -24px rgba(var(--shadow-rgb),.2);transform:translateY(-3px)}.play-tile:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.play-tile__art{aspect-ratio:4/5;background-color:#16141f;position:relative}.play-tile__rank{font-family:var(--font-mono);color:#ffffffd9;text-shadow:0 1px 2px #00000080;font-size:12px;font-weight:600;position:absolute;top:10px;left:12px}.play-tile__rtp{position:absolute;top:10px;right:10px}.play-tile__body{justify-content:space-between;align-items:center;gap:10px;padding:12px 14px 14px;display:flex}.play-tile__name{letter-spacing:-.01em;color:var(--ink);font-size:15px;font-weight:600}.play-tile__meta{color:var(--ink-3);margin-top:2px;font-size:12px}.play-tile__cta{background:var(--accent);height:32px;color:var(--on-accent);letter-spacing:-.01em;white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:0 12px;font-size:13px;font-weight:600;display:inline-flex}.play-tile:hover .play-tile__cta .arrow{transform:translate(2px)}.play-tile__cta .arrow{transition:transform var(--dur-fast) var(--ease)}.play-foot{background:var(--surface);border:.5px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-xs);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:28px;padding:16px 20px;display:flex}@media (max-width:1023px){.play-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}@media (max-width:799px){.play-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.play-tile__body{padding:10px 12px 12px}.play-tile__cta{height:28px;padding:0 10px;font-size:12px}}