/* ゲーム一覧ページ(サイト本体の style.css に重ねるスタイル) */
.games-lead { margin: -14px 0 0; font-size: 15px; color: var(--ink-soft); }
.games-section { padding-top: 24px; }
.game-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; }
.game-card { display: flex; flex-direction: column; text-decoration: none; color: var(--ink); background: rgba(255, 255, 255, .78); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; box-shadow: var(--soft-shadow); transition: transform .2s, box-shadow .2s; }
a.game-card:hover { transform: translateY(-4px); box-shadow: 0 30px 56px -26px rgba(110, 90, 200, .65); }
.game-thumb { position: relative; display: block; aspect-ratio: 1200 / 630; background: linear-gradient(135deg, #1a1170, #6a45f0); overflow: hidden; }
.game-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.game-new { position: absolute; left: 12px; top: 12px; padding: 2px 12px; border-radius: 99px; background: var(--pink); color: #fff; font-family: var(--en); font-weight: 600; font-size: 13px; letter-spacing: .08em; box-shadow: 0 4px 12px rgba(209, 53, 127, .5); }
.game-body { display: flex; flex-direction: column; gap: 6px; padding: 18px 22px 22px; }
.game-catch { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; color: var(--pink); }
.game-title { font-family: var(--jp); font-weight: 700; font-size: 21px; line-height: 1.4; }
.game-desc { font-size: 14px; line-height: 1.8; color: var(--ink-soft); }
.game-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.game-tags i { font-style: normal; font-size: 12px; padding: 1px 10px; border-radius: 99px; background: var(--lav); color: var(--ink); }
.game-play { margin-top: 8px; align-self: flex-start; padding: 8px 22px; border-radius: 99px; background: var(--grad); color: #fff; font-weight: 700; font-size: 14px; letter-spacing: .08em; }
.game-card.soon { background: rgba(255, 255, 255, .4); border-style: dashed; box-shadow: none; }
.game-card.soon .game-thumb { background: repeating-linear-gradient(135deg, #efe9ff, #efe9ff 12px, #f7f3ff 12px, #f7f3ff 24px); display: grid; place-items: center; }
.game-soon-mark { font-family: var(--en); font-weight: 600; font-size: 64px; color: #cbbcf5; }
.game-card.soon .game-title { color: var(--muted); }
@media (max-width: 820px) { .game-list { grid-template-columns: 1fr; gap: 22px; } }

.games-by { margin: 6px 0 0; font-size: 13.5px; color: var(--ink-soft); }
.games-by a { color: var(--pink); text-underline-offset: 3px; }
.games-by b { font-weight: 700; }