/* Super Chase — game window styling. Canvas scales to the window; on-screen
   D-pad + jump work on touch and desktop alike. */
.sc-wrap { position: relative; background: #14081e; line-height: 0; }
#scGame {
  display: block; width: 100%; height: auto; background: #14081e;
  image-rendering: auto; touch-action: none; cursor: default;
}

/* on-screen controls */
.sc-controls {
  position: absolute; left: 0; right: 0; bottom: 0; height: 0; line-height: 1;
  display: flex; justify-content: space-between; align-items: flex-end;
  padding: 10px 12px; pointer-events: none;
}
.sc-controls .sc-pad { display: flex; gap: 10px; }
.sc-btn {
  pointer-events: auto; -webkit-user-select: none; user-select: none;
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center; font-size: 1.4rem; font-weight: bold;
  color: #fff; background: rgba(20,8,30,0.5); border: 2px solid rgba(255,255,255,0.6);
  box-shadow: 0 2px 8px rgba(0,0,0,0.4); touch-action: none;
}
.sc-btn:active { background: rgba(255,122,198,0.7); transform: translateY(1px); }
.sc-btn.sc-jump { width: 68px; height: 68px; font-size: 1rem; }

.sc-hint { font-family: var(--ui); font-size: 0.74rem; color: #585858; padding: 6px 8px 0; }

/* desktop: give the game a comfortable fixed footprint */
@media (min-width: 641px) {
  #win-game { width: 760px; }
  #win-game .window-body { padding: 4px; }
}

/* phone: controls grow, hint hides */
@media (max-width: 640px) {
  .sc-btn { width: 64px; height: 64px; background: rgba(24,35,15,0.55); border-color: var(--edge, #2a3320); color: var(--lcd, #aebc9f); }
  .sc-btn.sc-jump { width: 76px; height: 76px; }
  .sc-hint { display: none; }
  .sc-wrap { flex: 1 1 auto; display: flex; align-items: center; }
  #scGame { width: 100%; }
}