.game-panel {
  width: min(94vw, 720px);
  max-height: 88dvh;
  overflow-y: auto;
  padding: 22px;
  border: 1px solid #b58b51;
  border-radius: 20px;
  color: var(--color-text);
  background: linear-gradient(145deg, #36291e, #171512);
  box-shadow: 0 24px 80px #0009;
}
.game-panel::backdrop { background: #08090cbd; backdrop-filter: blur(4px); }
.game-panel > .button { margin: 12px 8px 0 0; }
.panel-note { color: var(--color-muted); font-size: .85rem; line-height: 1.6; }
.collection-grid, .confirmation-preview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.collection-card { min-width: 0; padding: 10px; border: 1px solid #b58b5155; border-radius: 12px; background: #ffffff07; }
.collection-card .button { width: 100%; }
.confirmation-preview > :only-child { grid-column: 1 / -1; max-width: 320px; width: 100%; margin: auto; }
.adventure-nav {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr));
  align-items: center;
  gap: 6px;
  width: 100%;
}
.adventure-nav--with-music {
  grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr)) 36px;
}
.adventure-nav__button {
  min-width: 0;
  min-height: 36px;
  padding: 6px 3px;
  border: 1px solid rgb(242 197 92 / 24%);
  border-radius: 9px;
  color: var(--color-sand-light);
  background: rgb(37 26 19 / 85%);
  font-size: .76rem;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
}
.adventure-nav__button:hover { border-color: var(--color-sand-light); background: #4b3522; }
.adventure-nav .music-toggle { width: 36px; height: 36px; }
.battle-header { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
.battle-header__summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dialogue-scene .scene-header { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
.dialogue-scene .scene-header > span { font-size: .72rem; }
.simple-scene { justify-content: flex-start; }
.simple-scene > .adventure-nav { flex-shrink: 0; margin-bottom: 26px; }
.route-nodes { list-style: none; padding: 0 0 0 12px; margin: 20px 0; text-align: left; max-height: 42dvh; overflow-y: auto; }
.route-node { padding: 10px 14px; border-left: 2px solid #836543; color: #b1a393; font-size: .85rem; }
.route-node[data-state="done"] { color: #9dc3a6; }
.route-node[data-state="current"] { border-left: 4px solid #f7ce79; color: #ffe4aa; background: #d5a94c1c; font-weight: 800; }
#route-continue, #route-backpack { width: 100%; }
.player-health-bar { grid-column: 1 / -1; width: 100%; min-width: 100px; height: 29px; margin: 0 0 4px; }
.player-health-bar .health-bar__text { font-size: .82rem; color: #fff !important; }
.player-vitals { min-width: 0; }
@media (max-width: 390px) {
  .adventure-nav { gap: 4px; }
  .adventure-nav__button { font-size: .72rem; }
  .game-panel { padding: 14px; }
  .collection-grid { gap: 8px; }
  .collection-card { padding: 7px; }
  .player-summary { gap: 6px; }
  .player-avatar { flex-basis: 42px; width: 42px; height: 42px; }
}
.music-settings { display: grid; gap: 10px; }
.music-track { margin: 0; color: var(--color-muted); font-size: .8rem; }
.music-volume { display: flex; justify-content: space-between; gap: 16px; font-size: .85rem; }
#music-volume { width: 100%; margin: 0 0 8px; accent-color: var(--color-sand-light); }
