/* UI v4 P3 — game / gift-card tile and the catalogue grids (ui-contract-v4 §3, §4).
   Markup: layout/catalog-tile.php. Tokens: assets/css/nx-tokens.css. Logical properties only. */
.nxt-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (min-width:768px){.nxt-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
@media (min-width:1024px){.nxt-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
  .nxt-grid--gift{grid-template-columns:repeat(5,minmax(0,1fr))}}
.nxt{min-width:0}
.nxt[hidden]{display:none}
.nxt-link{display:flex;flex-direction:column;gap:6px;height:100%;color:var(--nx-text);text-decoration:none;border-radius:var(--nx-r-control);outline:0}
.nxt-link:focus-visible{box-shadow:var(--nx-ring)}
.nxt-art{position:relative;display:grid;place-items:center;aspect-ratio:1/1;overflow:hidden;border-radius:var(--nx-r-control);background:var(--nx-s1);border:1px solid var(--nx-line);transition:border-color var(--nx-t-state,150ms) var(--nx-ease-out,ease)}
.nxt-art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--nx-t-state,150ms) var(--nx-ease-out,ease)}
.nxt-initials{font-size:var(--nx-fs-20);line-height:1;font-weight:700;color:var(--nx-text-2)}
.nxt-name{font-size:14px;line-height:20px;font-weight:600;color:var(--nx-text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;hyphens:auto}
.nxt-meta{font-size:12px;line-height:16px;color:var(--nx-text-2);overflow-wrap:anywhere}
.nxt-from{font-size:12px;line-height:16px;color:var(--nx-text);font-variant-numeric:tabular-nums}
@media (hover:hover) and (pointer:fine){
  .nxt-link:hover .nxt-art{border-color:var(--nx-line-strong)}
  .nxt-link:hover .nxt-art img{transform:scale(1.04)}
}
@media (prefers-reduced-motion:reduce){.nxt-art,.nxt-art img{transition:none}}
[lang="ar"] .nxt-name{line-height:22px}
/* Horizontal rail (home gift cards): 140px cards, native scroll, snap. */
.nxt-rail{list-style:none;margin:0;padding:0 0 4px;display:grid;grid-auto-flow:column;grid-auto-columns:140px;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin}
.nxt-rail>.nxt{scroll-snap-align:start}
@media (min-width:1024px){.nxt-rail{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;overflow:visible}
  .nxt-rail>.nxt:nth-child(n+7){display:none}}
/* Long lists (games.php): tiles past the first 36 wait for "Show all"; search/filter see all. */
.nxt-grid[data-collapsed]:not(.is-filtering) .nxt--more{display:none}
.nxc-more{display:flex;justify-content:center;margin-block-start:var(--nx-sp-6)}
.nxc-more button{min-height:var(--nx-touch);padding-inline:var(--nx-sp-6);border:1px solid var(--nx-line-strong);border-radius:var(--nx-r-control);background:var(--nx-s1);color:var(--nx-text);font:inherit;font-size:var(--nx-fs-14);font-weight:600;cursor:pointer}
.nxc-more button:hover{background:var(--nx-s2)}
.nxc-more button:focus-visible{outline:0;box-shadow:var(--nx-ring)}