/* あそびかたページ（rakko-games.com/games/<id>/）の 見た目。土台は 恐竜ずかんの zukan.css（同じ フォント・色・枠）。ここは あそびかた だけの 部品 */
.hero { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 12px; }
.hero img { width: 120px; height: 120px; border-radius: 28px; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
/* h1 は「ゲーム名｜ジャンル」。せまい 画面では ｜の あとで 折れるように ジャンルを span に */
.hero h1 span { display: inline-block; }
.steps { margin: 0; padding-left: 1.6em; }
.steps li { margin-bottom: 6px; }
ul { margin: 0; padding-left: 1.4em; }
.age { margin: 8px 0 0; }
.free { margin: 20px 0 0; padding: 10px 14px; border-radius: 12px; background: #eef8f2; color: #2f5f50; font-weight: 700; }
/* 大きな「あそぶ」（トップの カードの ボタンと 同じ 色） */
.play {
  display: block; width: fit-content; max-width: 100%; margin: 20px auto 4px; padding: 14px 56px; border-radius: 999px; text-align: center; text-decoration: none;
  font-family: var(--fd); font-size: 1.5rem; font-weight: 800; background: #e9853a; color: #fff; box-shadow: 0 4px 0 #b5602a;
}
.play:active { transform: translateY(3px); box-shadow: 0 1px 0 #b5602a; }