.container { max-width: 1040px; margin: 0 auto; padding: 24px 16px; }

/* 検索バー（位置のみ。見た目は components.searchbar.css） */
.searchbar { position: sticky; top: 0; background: var(--bg); padding-bottom: 8px; z-index: 10; }
.search-row { display: grid; grid-template-columns: 1fr auto auto auto; gap: 8px; }

/* 結果グリッド */
.result-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }

/* ギャラリー（“おまかせ”も共通） */
.gallery { display: grid; gap: 12px; grid-template-columns: repeat(4, 1fr); }
.gallery .item { aspect-ratio: 1/1; border-radius: 12px; overflow: hidden; background: #f8f8f8; }
.gallery .item img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (min-width: 768px) { .gallery { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); } }



/* 旧: grid-template-columns: 1fr auto auto auto; */
.search-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }


/* ==== Xアプリ内ブラウザのときだけ固定解除 ==== */
body.x-app .site-header,
body.x-app .site-footer,
body.x-app .searchbar {
  position: static !important;  /* sticky / fixed を殺す */
  top: auto !important;
  bottom: auto !important;
  z-index: auto !important;
}


html.x-app * {
  position: static !important;
}