/* Bob & Bobby oyunu (final bölümü). */
.game { width: min(860px, 100%); display: grid; gap: 12px; margin-top: 18px; }
.game-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.game-title { font-family: var(--display); font-size: clamp(24px, 3vw, 34px); line-height: 1; }
.game-score { font-size: 13px; letter-spacing: 0.08em; background: var(--white); border: 2px solid var(--ink); border-radius: 100px; padding: 4px 12px; }
.game-stage {
  position: relative; border: var(--line); border-radius: 24px; overflow: hidden;
  box-shadow: 7px 7px 0 var(--fuchsia); background: var(--cream);
}
.game-canvas { display: block; width: 100%; height: clamp(230px, 34vw, 320px); cursor: pointer; touch-action: manipulation; }
.game-overlay {
  position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 14px;
  background: rgba(255, 246, 224, 0.72); backdrop-filter: blur(2px); text-align: center; padding: 16px;
}
.game-overlay[hidden] { display: none; }
.game-msg { font-size: 16px; }
.game-msg b { color: var(--fuchsia); font-size: 1.25em; }
.game-help { font-size: 12px; color: var(--brown); max-width: 420px; }
.game-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.game-controls .btn { user-select: none; -webkit-user-select: none; touch-action: none; }
/* Masaüstünde klavye var; butonlar yine de dursun ama daha sakin. */
@media (hover: hover) and (pointer: fine) { .game-controls .btn { font-size: 16px; padding: 10px 18px 8px; } }

/* Oyun ekrandayken sayfanın altından geçen dekor kaykaycısı saklanır. */
body[data-game-visible] .skater-lane { opacity: 0; pointer-events: none; }
.skater-lane { transition: opacity 0.3s; }