/* /room/・/food/ in the room and facility pages' tone (owner, 2026-10-07).
 * One place mark per card (the photo tag goes), the room cards keep capacity and water only (bedding and
 * pets are on each room page), 12px photos, bold 「〜 >」 links instead of underlines and the dark
 * button, and the closing band with TOP's brush edge. */
.bub-site-page main:is(.room-index-page, .food-index-page) .lead { color: rgb(47 47 47 / 85%); font-size: 15px; line-height: 26px; }
.bub-site-page main:is(.room-index-page, .food-index-page) .room-catalog-note { color: rgb(47 47 47 / 60%); font-size: 12px; line-height: 20px; }

/* /room/ */
.bub-site-page main.room-index-page .room-facility-label { display: none; }
.bub-site-page main.room-index-page .room-type-image { border-radius: 12px; aspect-ratio: 4 / 3; height: auto; object-fit: cover; }
.bub-site-page main.room-index-page .room-type-body h3 { font-size: 18px; line-height: 28px; }
.bub-site-page main.room-index-page .room-ia-card-facts { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 10px; padding: 0; border: 0; }
.bub-site-page main.room-index-page .room-ia-card-facts > div { display: inline-flex; gap: 6px; padding: 0; border: 0; }
.bub-site-page main.room-index-page .room-ia-card-facts > div:nth-child(2),
.bub-site-page main.room-index-page .room-ia-card-facts > div:nth-child(4) { display: none; }
.bub-site-page main.room-index-page .room-ia-card-facts dt { color: rgb(47 47 47 / 60%); font-size: 13px; line-height: 22px; }
.bub-site-page main.room-index-page .room-ia-card-facts dd { margin: 0; color: var(--ink); font-size: 14px; line-height: 22px; font-weight: 500; }
.bub-site-page main.room-index-page .room-image-caption { border: 0; }
.bub-site-page main.room-index-page .room-detail-action { gap: 2px; margin-top: 8px; font-size: 14px; font-weight: 700; text-decoration: none; }
.bub-site-page main.room-index-page .room-detail-action svg { display: none; }
.bub-site-page main.room-index-page .room-detail-action::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }

/* /food/ */
.bub-site-page main.food-index-page .food-facility-head h2 { font-size: 22px; line-height: 32px; }
.bub-site-page main.food-index-page .food-meal-photos img { border-radius: 12px; }
.bub-site-page main.food-index-page :is(.food-meal-link, .food-facility-more) { display: inline-flex; align-items: center; gap: 2px; width: auto; min-height: 44px; margin-top: 4px; padding: 0; border: 0; border-radius: 0; background: none; color: var(--ink); font-size: 14px; line-height: 22px; font-weight: 700; text-decoration: none; }
.bub-site-page main.food-index-page :is(.food-meal-link, .food-facility-more) svg { display: none; }
.bub-site-page main.food-index-page :is(.food-meal-link, .food-facility-more)::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }
.bub-site-page main.food-index-page .food-facility-more { margin-top: 24px; font-size: 15px; }

/* Closing band: TOP's grey with the brush edge. */
.bub-site-page main:is(.room-index-page, .food-index-page) .stay-more { position: relative; margin-top: 56px; }
.bub-site-page main:is(.room-index-page, .food-index-page) .stay-more::before { content: ""; position: absolute; left: 0; right: 0; top: -17px; height: 18px; background: inherit; pointer-events: none; -webkit-mask: url('/assets/images/top-handdrawn-edge.png') center -72px / 140% 198px no-repeat; mask: url('/assets/images/top-handdrawn-edge.png') center -72px / 140% 198px no-repeat; }
.bub-site-page main:is(.room-index-page, .food-index-page) .stay-more img { border-radius: 12px; }
.bub-site-page main.food-index-page .food-allergy-support a { display: inline-flex; align-items: center; gap: 2px; min-height: 44px; color: var(--ink); font-size: 14px; font-weight: 700; text-decoration: none; }
.bub-site-page main.food-index-page .food-allergy-support a svg { display: none; }
.bub-site-page main.food-index-page .food-allergy-support a::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }

/* ===== As /activity/ (owner, 2026-10-07: 「엑티비티는 제대로 만들었는데」) =====
 * The same card: a photo with the facility tag, a bold title with 「>」, one grey meta line under it;
 * two across on phones. The head carries a count, as 「アクティビティ 266件」. */
.bub-site-page main:is(.room-index-page, .food-index-page) h1 { font-size: 28px; line-height: 40px; }
.bub-site-page main.room-index-page h1 .room-count { margin-left: 12px; font: 700 22px/40px var(--font-num), var(--font-ja); }
.bub-site-page main.room-index-page h1 .room-count::first-letter { font-size: inherit; }

/* /room/ cards */
.bub-site-page main.room-index-page .room-showcase-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
.bub-site-page main.room-index-page .room-type-card { display: block; min-width: 0; padding: 0; border: 0; background: none; color: var(--ink); text-decoration: none; }
.bub-site-page main.room-index-page .room-type-image-link { position: relative; overflow: hidden; border-radius: 8px; }
.bub-site-page main.room-index-page .room-type-image { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; object-fit: cover; }
.bub-site-page main.room-index-page .room-facility-label { display: inline-block; position: absolute; top: 8px; left: 8px; z-index: 1; padding: 3px 8px; border-radius: 4px; background: var(--paper); color: var(--ink); font-size: 12px; line-height: 18px; font-weight: 700; }
.bub-site-page main.room-index-page .room-type-body { display: flex; flex-wrap: wrap; align-items: baseline; padding: 0; }
.bub-site-page main.room-index-page .room-type-body h3 { display: flex; flex-basis: 100%; align-items: flex-start; justify-content: space-between; gap: 4px; margin: 10px 0 4px; font-size: 16px; line-height: 24px; font-weight: 700; }
.bub-site-page main.room-index-page .room-type-body h3::after { content: ""; flex: none; width: 16px; height: 16px; margin-top: 4px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }
.bub-site-page main.room-index-page :is(.room-location-badge, .room-detail-action) { display: none; }
.bub-site-page main.room-index-page .room-ia-card-facts { display: contents; }
.bub-site-page main.room-index-page .room-ia-card-facts > div { display: none; }
.bub-site-page main.room-index-page .room-ia-card-facts > div:nth-child(1) { display: inline; order: 1; }
.bub-site-page main.room-index-page .room-ia-card-facts > div:nth-child(3) { display: block; order: 3; flex-basis: 100%; }
.bub-site-page main.room-index-page .room-ia-card-facts dt { display: none; }
.bub-site-page main.room-index-page :is(.room-ia-card-facts dd, .room-type-meta) { margin: 0; color: rgb(47 47 47 / 85%); font-size: 13px; line-height: 20px; font-weight: 400; }
.bub-site-page main.room-index-page .room-ia-card-facts dd[data-short] { font-size: 0; }
.bub-site-page main.room-index-page .room-ia-card-facts dd[data-short]::after { content: attr(data-short); font-size: 13px; }
.bub-site-page main.room-index-page .room-image-caption { display: inline; order: 2; margin: 0; padding: 0; border: 0; }
.bub-site-page main.room-index-page .room-image-caption::before { content: "|"; margin: 0 6px; color: rgb(47 47 47 / 30%); font-size: 12px; }
@media (min-width: 768px) {
  .bub-site-page main.room-index-page .room-showcase-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 24px; }
}
@media (min-width: 1024px) {
  /* 9 rooms sit 3 × 3; four columns left one card alone on the last row (QA 2026-10-13). */
  .bub-site-page main.room-index-page .room-showcase-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* /food/ : each meal as the same card, the facility's meals two across. */
.bub-site-page main.food-index-page .food-facility { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
.bub-site-page main.food-index-page .food-facility[hidden] { display: none; }
.bub-site-page main.food-index-page :is(.food-facility-head, .food-facility-more) { grid-column: 1 / -1; }
.bub-site-page main.food-index-page .food-facility-head { margin-bottom: 4px; }
.bub-site-page main.food-index-page .food-facility-head p { margin-top: 8px; color: rgb(47 47 47 / 85%); font-size: 15px; line-height: 26px; }
.bub-site-page main.food-index-page .food-meal { position: relative; display: block; min-width: 0; margin: 0; padding: 0; border: 0; }
.bub-site-page main.food-index-page .food-meal-photos { display: block; overflow: hidden; margin: 0; border-radius: 8px; }
.bub-site-page main.food-index-page .food-meal-photos img { display: none; border-radius: 0; }
.bub-site-page main.food-index-page .food-meal-photos img:first-child { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.bub-site-page main.food-index-page .food-meal-body { padding: 0; }
.bub-site-page main.food-index-page .food-meal-body h3 { display: flex; align-items: flex-start; justify-content: space-between; gap: 4px; margin: 10px 0 4px; font-size: 16px; line-height: 24px; font-weight: 700; }
.bub-site-page main.food-index-page .food-meal-body h3 span { position: absolute; top: 8px; left: 8px; z-index: 1; padding: 3px 8px; border-radius: 4px; background: var(--paper); color: var(--ink); font-size: 12px; line-height: 18px; font-weight: 700; }
.bub-site-page main.food-index-page .food-meal-body h3::after { content: ""; flex: none; width: 16px; height: 16px; margin-top: 4px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }
.bub-site-page main.food-index-page .food-meal-facts { margin: 0; padding: 0; border: 0; }
.bub-site-page main.food-index-page .food-meal-facts > div { display: none; padding: 0; border: 0; }
.bub-site-page main.food-index-page .food-meal-facts > div:first-child { display: block; }
.bub-site-page main.food-index-page .food-meal-facts dt { display: none; }
.bub-site-page main.food-index-page .food-meal-facts dd { margin: 0; overflow: hidden; color: rgb(47 47 47 / 85%); font-size: 13px; line-height: 20px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
/* The whole card opens the meal; the link text stays for readers. */
.bub-site-page main.food-index-page .food-meal-link { position: static; display: block; width: 1px; height: 1px; min-height: 0; margin: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bub-site-page main.food-index-page .food-meal-link::after { content: none; }
.bub-site-page main.food-index-page .food-meal:has(.food-meal-link) { cursor: pointer; }
.bub-site-page main.food-index-page .food-meal-link::before { content: ""; position: absolute; inset: 0; z-index: 2; }
.bub-site-page main.food-index-page .food-meal-link { clip-path: none; overflow: visible; color: transparent; font-size: 0; }
/* 夕食・朝食・ドリンク (お子さま lives on each facility page, FB-011): dinner leads full width on the phone. */
.bub-site-page main.food-index-page .food-facility > .food-meal:first-of-type { grid-column: 1 / -1; }
.bub-site-page main.food-index-page .food-facility > .food-meal:first-of-type .food-meal-photos { aspect-ratio: 16 / 9; }
@media (min-width: 768px) {
  .bub-site-page main.food-index-page .food-facility { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 24px; }
  .bub-site-page main.food-index-page .food-facility > .food-meal:first-of-type { grid-column: auto; }
  .bub-site-page main.food-index-page .food-facility > .food-meal:first-of-type .food-meal-photos { aspect-ratio: 4 / 3; }
}
/* Settle against the older hub rules. */
.bub-site-page main.room-index-page .room-type-image-link { aspect-ratio: auto; }
.bub-site-page main:is(.room-index-page, .food-index-page) :is(.room-type-body h3, .food-meal-body h3) { min-width: 0; overflow-wrap: anywhere; word-break: normal; }
.bub-site-page main.food-index-page .food-meal-photos { aspect-ratio: 4 / 3; height: auto; padding: 0; }
.bub-site-page main.food-index-page .food-meal-photos img:first-child { width: 100% !important; height: 100% !important; max-height: none !important; }
.bub-site-page main.food-index-page .food-meal-facts { display: block; }
.bub-site-page main.room-index-page .room-type-body { margin-top: 0; }
/* 「すべて見る >」 beside the facility's title, as TOP's heads (owner, 2026-10-07: a lone centred link
   under the cards read cheap). */
.bub-site-page main.food-index-page .food-facility-head { grid-row: 1; grid-column: 1 / -1; }
.bub-site-page main.food-index-page .food-facility-head h2 { padding-right: 96px; }
.bub-site-page main.food-index-page .food-facility-more { grid-row: 1; grid-column: 1 / -1; justify-self: end; align-self: start; margin: 0; min-height: 32px; font-size: 14px; }
@media (min-width: 768px) { .bub-site-page main.food-index-page .food-facility-more { font-size: 15px; } }
/* Allergy help as /activity/'s link rows (owner, 2026-10-07): one row, the title bold, the action grey
   under it, 「>」 at the right; the whole row opens the form. */
.bub-site-page main.food-index-page .food-allergy-support { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 32px; padding: 16px 0; border-top: 1px solid rgb(47 47 47 / 12%); border-bottom: 1px solid rgb(47 47 47 / 12%); }
.bub-site-page main.food-index-page .food-allergy-support > svg { display: none; }
.bub-site-page main.food-index-page .food-allergy-support > div { display: grid; gap: 2px; padding: 0; }
.bub-site-page main.food-index-page .food-allergy-support h2 { margin: 0; font-size: 15px; line-height: 22px; font-weight: 700; }
.bub-site-page main.food-index-page .food-allergy-support a { min-height: 0; margin: 0; color: rgb(47 47 47 / 70%); font-size: 13px; line-height: 20px; font-weight: 400; }
.bub-site-page main.food-index-page .food-allergy-support a::after { content: none; }
.bub-site-page main.food-index-page .food-allergy-support a::before { content: ""; position: absolute; inset: 0; }
.bub-site-page main.food-index-page .food-allergy-support::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--ink); -webkit-mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-right.svg') center / contain no-repeat; }
