/* Shared room detail layout; gallery and booking interactions stay in the reference layer. */
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-layout {
  display:block;
  padding-top:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-detail-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-heading h1 {
  font-size:28px;
  line-height:38px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] {
  gap:16px;
  margin-top:24px;
  padding-block:24px;
  border-block:1px solid var(--line);
}
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] > li {
  grid-template-columns:118px minmax(0,1fr);
  align-items:first baseline;
  gap:16px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] .bell-fact-label {
  align-items:baseline;
  line-height:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .bell-fact-label > .bell-ui-icon {
  align-self:center;
}
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] strong {
  font-size:16px;
  line-height:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section {
  padding-block:32px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-main > .chosei-room-listing-section + .chosei-room-listing-section {
  border-top:1px solid var(--line);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section h2 {
  font-size:22px;
  line-height:32px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section :is(p,li) {
  line-height:28px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section-heading > p {
  line-height:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-description-copy p + p {
  margin-top:16px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-description-copy > p:first-child {
  margin-top:0;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-context-photo > .bell-photo-trigger > img {
  border-radius:8px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-room-rail {
  gap:0;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-room-card {
  padding-block:20px;
  border-bottom:1px solid var(--line);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-room-card:first-child {
  padding-top:0;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-room-card:last-child {
  padding-bottom:0;
  border-bottom:0;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-room-card > div {
  gap:8px 16px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail :is([data-room-booking-variant],.chosei-room-listing-amenities-open,.chosei-room-listing-mobile-booking > a) {
  border-radius:8px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-amenities {
  gap:16px 24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-booking-included > span {
  display:inline-block;
}
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms {
  grid-column:1/-1;
  border-top:1px solid var(--line);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-auto-flow:row;
  grid-auto-columns:auto;
  overflow:visible;
  scroll-snap-type:none;
  gap:32px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card > .live-card-image {
  aspect-ratio:3/2;
  border-radius:8px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card h3 {
  font-size:20px;
  line-height:28px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card .live-card-body {
  margin-top:16px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card :is(.live-price-main > strong,.live-price-included,.live-room-card-specs dd,.live-room-card-fit p) {
  color:var(--ink);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card :is(.live-price-main small,.live-price-notice,.live-room-card-specs dt,.live-room-card-fit > span) {
  color:var(--muted);
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card-specs {
  display:grid;
  gap:8px;
  font-size:14px;
  line-height:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card-specs > div,
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card-fit {
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  align-items:first baseline;
  gap:12px;
  margin:0;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card .live-room-card-specs :is(dt,dd),
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card .live-room-card-fit > :is(span,p) {
  margin:0;
  font-size:14px;
  line-height:24px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card-fit {
  margin-top:8px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card-fit > span {
  white-space:nowrap;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-price-main {
  align-items:baseline;
  flex-wrap:wrap;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .live-price-main > strong {
  display:inline-flex;
  align-items:baseline;
  gap:2px;
  white-space:nowrap;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-price-amount {
  font-size:24px;
  line-height:32px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-price-unit {
  font-size:14px;
  line-height:22px;
  font-weight:400;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .room-booking-price {
  display:inline-flex;
  align-items:baseline;
  flex-wrap:nowrap;
  gap:2px;
  white-space:nowrap;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-mobile-booking .room-price-amount {
  color:var(--ink);
  font-size:20px;
  line-height:26px;
}
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-mobile-booking .room-price-unit {
  color:var(--ink);
  font-size:12px;
  line-height:18px;
}
@media (min-width:768px) {
  .bub-site-page .room-listing-detail-page.room-reference-detail :is(.chosei-room-listing-hero,.chosei-room-listing-layout) {
    width:min(calc(100% - 64px),var(--room-content));
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-layout {
    padding-top:32px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-gallery {
    border-radius:8px 0 0 8px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .room-editorial-side-photo {
    border-radius:0 8px 8px 0;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section {
    padding-block:40px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail :is(.chosei-room-listing-description,#room-types) {
    display:grid;
    grid-template-columns:minmax(0,2fr) minmax(0,3fr);
    align-items:start;
    gap:0 24px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail :is(.chosei-room-listing-description > h2,#room-types > .chosei-room-listing-section-heading) {
    grid-column:1/-1;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail :is(.chosei-room-listing-description,#room-types) > .room-reference-context-photo {
    margin-bottom:0;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-bathroom-card:has(> .room-reference-context-photo) {
    grid-template-columns:minmax(0,2fr) minmax(0,3fr);
    gap:24px;
    align-items:start;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px;
  }
}
@media (min-width:1024px) {
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .room-detail-overview {
    grid-template-columns:minmax(0,1fr) 280px;
    gap:0 48px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-heading h1 {
    font-size:32px;
    line-height:44px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section h2 {
    font-size:24px;
    line-height:34px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-booking {
    padding-top:24px;
    border-top:1px solid var(--line);
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-booking-info {
    padding:0;
    border-radius:0;
    background:transparent;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-price {
    margin-top:0;
    font-size:22px;
    line-height:32px;
  }
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-booking > .button {
    margin:24px 0 0;
    border-radius:8px;
  }
}

/* ===== TOP's tone (owner, 2026-10-07) =====
 * As the facility TOPs: space instead of hairlines between sections, TOP's 15px lead, 12px photo
 * corners, a small expand mark instead of the 「拡大」 tag, and bold 「〜 >」 links instead of outlined
 * buttons; on phones the other rooms run across like TOP's cards. */
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section,
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section[id] { border-top: 0; padding-block: 28px; }
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section-heading p,
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .section-heading p { margin-top: 8px; color: rgb(47 47 47 / 85%); font-size: 15px; line-height: 26px; }
.bub-site-page .room-listing-detail-page.room-reference-detail :is(.room-reference-context-photo .bell-photo-trigger, .room-reference-context-photo img, .live-room-card img) { overflow: hidden; border-radius: 12px; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-context-photo .bell-photo-trigger::after {
  content: ""; right: 8px; bottom: 8px; width: 28px; height: 28px; padding: 0; border-radius: 4px;
  background: rgb(47 47 47 / 64%) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fcfcfc' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center / 14px no-repeat;
}
.bub-site-page .room-listing-detail-page.room-reference-detail :is(.detail-back-link[data-room-booking-variant], .chosei-room-listing-amenities-open) {
  display: inline-flex; align-items: center; gap: 2px; width: auto; min-height: 44px; margin-inline: 0; padding: 0; border: 0; border-radius: 0; background: none; color: var(--ink); font-size: 14px; line-height: 22px; font-weight: 700; text-decoration: none; box-shadow: none;
}
.bub-site-page .room-listing-detail-page.room-reference-detail :is(.detail-back-link[data-room-booking-variant], .chosei-room-listing-amenities-open)::after {
  content: ""; flex: none; 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 .room-listing-detail-page.room-reference-detail .chosei-room-listing-amenities-open { justify-self: start; margin-top: 12px; }
@media (max-width: 767px) {
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100vw - 40px) * .72); grid-template-columns: none; gap: 12px; margin: 0 -20px; padding: 0 20px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scroll-padding-inline: 20px; scrollbar-width: none; }
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-grid::-webkit-scrollbar { display: none; }
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card { scroll-snap-align: start; min-width: 0; }
  .bub-site-page .room-listing-detail-page.room-reference-detail .live-room-card img { aspect-ratio: 4 / 3; height: auto; }
}
@media (min-width: 768px) {
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section,
  .bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-section[id] { padding-block: 36px; }
}
/* The section rules above lose to route CSS; settle them here. */
.bub-site-page main.room-listing-detail-page.room-reference-detail section.chosei-room-listing-section { border-top: 0 !important; }
.bub-site-page main.room-listing-detail-page.room-reference-detail .chosei-room-listing-highlights { padding-block: 8px; border-top: 0; border-bottom: 0; }
.bub-site-page main.room-listing-detail-page.room-reference-detail .chosei-room-listing-description p.lead { color: rgb(47 47 47 / 85%); }

/* ===== Rooms in TOP's parts (owner, 2026-10-07: 「객실 페이지가 밤티」) =====
 * The spec sheet gives way: three facts with icons in one line (bedding and pets live in the room types
 * and notes), one paragraph with the rest folded, photos full width with 12px corners, the amenities
 * under a noun head with 「すべて見る >」, the notes in TOP's closing grey band, light related cards. */
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 0; padding: 0; border: 0; list-style: none; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li { display: inline-flex; align-items: center; gap: 6px; min-height: 0; margin: 0; padding: 0; border: 0; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li[data-fact="寝具"],
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li[data-fact="ペット"] { display: none; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights .bell-fact-label { display: inline-flex; gap: 0; min-width: 0; width: auto; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights .bell-fact-label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights .bell-ui-icon { width: 18px; height: 18px; color: rgb(47 47 47 / 70%); }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights strong { font-size: 15px; line-height: 22px; font-weight: 500; }
.bub-site-page main.room-reference-detail .room-reference-context-photo { margin: 0 0 12px; }
.bub-site-page main.room-reference-detail .room-reference-context-photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; }
.bub-site-page main.room-reference-detail .room-reference-context-photo figcaption { margin-top: 6px; color: rgb(47 47 47 / 60%); font-size: 12px; line-height: 18px; }
.bub-site-page main.room-reference-detail .chosei-room-listing-section h2 { font-size: 22px; line-height: 32px; font-weight: 700; }
.bub-site-page main.room-reference-detail .room-description-copy p { margin-top: 12px; color: rgb(47 47 47 / 85%); font-size: 15px; line-height: 26px; }
.bub-site-page main.room-reference-detail .room-description-copy p.lead { margin-top: 0; color: var(--ink); font-size: 17px; line-height: 28px; font-weight: 700; }
.bub-site-page main.room-reference-detail .room-description-more summary { display: inline-flex; align-items: center; gap: 2px; min-height: 44px; margin-top: 4px; color: var(--ink); font-size: 14px; font-weight: 700; cursor: pointer; list-style: none; }
.bub-site-page main.room-reference-detail .room-description-more summary::-webkit-details-marker { display: none; }
.bub-site-page main.room-reference-detail .room-description-more summary::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url('/assets/icons/lucide/source/chevron-down.svg') center / contain no-repeat; mask: url('/assets/icons/lucide/source/chevron-down.svg') center / contain no-repeat; }
.bub-site-page main.room-reference-detail .room-description-more[open] summary { display: none; }
.bub-site-page main.room-reference-detail #facilities { position: relative; }
.bub-site-page main.room-reference-detail #facilities .chosei-room-listing-amenities-open { position: absolute; top: 28px; right: 0; min-height: 32px; margin: 0; }
.bub-site-page main.room-reference-detail .chosei-room-listing-amenities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; margin: 0; padding: 0; }
.bub-site-page main.room-reference-detail .chosei-room-listing-amenities li { padding: 6px 0; border: 0; color: rgb(47 47 47 / 85%); font-size: 14px; line-height: 22px; }
.bub-site-page main.room-reference-detail #other-rooms :is(.live-price-notice, .live-price-included, .live-room-card-specs) { display: none; }
.bub-site-page main.room-reference-detail #other-rooms .live-room-card h3 { margin-top: 10px; font-size: 16px; line-height: 24px; }
.bub-site-page main.room-reference-detail #other-rooms .live-price-main { font-size: 13px; }
@media (max-width: 767px) {
  .bub-site-page main.room-reference-detail section.chosei-room-listing-section.room-notes-band { position: relative; margin: 40px calc(50% - 50vw) 0; padding: 48px calc(50vw - 50%) 40px; background: var(--surface-subtle); }
  .bub-site-page main.room-reference-detail .room-notes-band::before { content: ""; position: absolute; left: 0; right: 0; top: -17px; height: 18px; background: var(--surface-subtle); 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; }
}
@media (min-width: 768px) {
  .bub-site-page main.room-reference-detail section.chosei-room-listing-section.room-notes-band { margin-top: 24px; padding: 32px; border-radius: 12px; background: var(--surface-subtle); }
  .bub-site-page main.room-reference-detail .chosei-room-listing-section h2 { font-size: 24px; line-height: 34px; }
  .bub-site-page main.room-reference-detail #facilities .chosei-room-listing-amenities-open { top: 36px; }
  .bub-site-page main.room-reference-detail .chosei-room-listing-amenities { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* Settle the room parts against the older route rules. */
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] > li { display: inline-flex; flex-direction: row; grid-template-columns: none; align-items: center; gap: 6px; }
.bub-site-page .room-listing-detail-page.room-reference-detail [data-room-comparison-facts] .bell-fact-label { display: inline-flex; flex: none; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-context-photo { width: 100%; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-context-photo .bell-photo-trigger { display: block; width: 100%; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-reference-context-photo img { width: 100% !important; max-width: none !important; height: auto !important; max-height: none !important; aspect-ratio: 3 / 2; object-fit: cover; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-description-copy p { display: block; -webkit-line-clamp: unset; overflow: visible; white-space: normal; text-overflow: clip; }
.bub-site-page .room-listing-detail-page.room-reference-detail .room-description-copy,
.bub-site-page .room-listing-detail-page.room-reference-detail .room-description-copy > * { border: 0; }
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-amenities li { display: block; min-height: 0; }
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .eyebrow { display: none; }
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .live-room-card-fit { display: block; margin-top: 2px; }
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .live-room-card-fit > span { display: none; }
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .live-room-card-fit p { margin: 0; color: rgb(47 47 47 / 85%); font-size: 13px; line-height: 20px; }
.bub-site-page .room-listing-detail-page.room-reference-detail #other-rooms .live-price { margin-top: 6px; }
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-amenities { row-gap: 4px; column-gap: 16px; }
.bub-site-page .room-listing-detail-page.room-reference-detail .chosei-room-listing-amenities li { margin: 0; line-height: 22px; }

/* Photo viewer (owner, 2026-10-07: the arrows floated off the photo): the arrows sit in the photo's own
   frame, centred on it whatever its shape; the photo is centred in the space, its caption one line under. */
.bub-site-page .room-reference-detail .chosei-room-gallery-modal-stage { display: block; padding: 0; }
.bub-site-page .room-reference-detail .chosei-room-gallery-modal-stage > figure { display: grid; grid-template-rows: minmax(0, 1fr) auto; height: 100%; min-height: 0; margin: 0; }
.bub-site-page .room-reference-detail .room-gallery-frame { position: relative; min-height: 0; height: 100%; }
.bub-site-page .room-reference-detail .room-gallery-frame > img { display: block; width: 100%; height: 100%; max-height: none; object-fit: contain; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav { position: absolute; z-index: 1; top: 50%; width: 44px; height: 44px; margin: 0; border-radius: 50%; transform: translateY(-50%); background: rgb(47 47 47 / 64%); color: var(--paper); }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-prev { left: 8px; right: auto; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-next { right: 8px; left: auto; }
.bub-site-page .room-reference-detail .chosei-room-gallery-modal-stage figcaption { overflow: hidden; padding: 12px 20px; color: rgb(252 252 252 / 80%); font-size: 13px; line-height: 20px; text-align: center; white-space: nowrap; text-overflow: ellipsis; }
@media (min-width: 768px) {
  .bub-site-page .room-reference-detail .chosei-room-gallery-modal-stage { padding: 20px 24px 0; }
  .bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-prev { left: 16px; }
  .bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-next { right: 16px; }
}
/* Wider tap targets (owner, 2026-10-07: 「미스탭」): each arrow owns the outer third of the photo, top to
   bottom; the round mark stays 44px at its edge. A disabled end arrow goes away. */
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav { top: 0; bottom: 0; width: 32%; height: auto; padding: 0 8px; display: flex; align-items: center; border-radius: 0; background: none; transform: none; -webkit-tap-highlight-color: transparent; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-prev { left: 0; justify-content: flex-start; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav.is-next { right: 0; justify-content: flex-end; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav > svg { box-sizing: content-box; flex: none; width: 20px; height: 20px; padding: 12px; border-radius: 50%; background: rgb(47 47 47 / 64%); color: var(--paper); }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav:active > svg { background: rgb(47 47 47 / 84%); }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav:disabled { opacity: 0; pointer-events: none; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav:focus-visible { outline: none; }
.bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav:focus-visible > svg { outline: 2px solid var(--paper); outline-offset: 2px; }
@media (min-width: 768px) {
  .bub-site-page .room-reference-detail .room-gallery-frame > .chosei-room-gallery-modal-nav { width: 20%; padding: 0 16px; }
}

/* Phones: booking in a bottom bar, as the facility TOPs' dock (owner, 2026-10-07) — the price and
   「部屋を選ぶ」 stay in reach; the card in the page goes. */
@media (max-width: 1023px) {
  :root body:has(main.room-reference-detail) .mobile-action-bar { display: none; }
  :root body:has(main.room-reference-detail) { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-booking { display: none; }
  :root .bub-site-page .room-reference-detail ~ * .chosei-room-listing-mobile-booking,
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking { display: flex !important; z-index: 35; min-height: 76px; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid rgb(47 47 47 / 12%); background: var(--paper); }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking > div { gap: 0; }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking strong { color: var(--ink); font-size: 15px; line-height: 22px; font-weight: 700; }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking strong .room-price-amount { font: 700 18px/24px var(--font-num), var(--font-ja); }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking strong .room-price-unit { font-size: 12px; font-weight: 500; }
  :root .bub-site-page main.room-reference-detail .chosei-room-listing-mobile-booking > a { flex: 1 0 auto; max-width: 48%; min-height: 52px; border-radius: 12px; font-size: 15px; font-weight: 700; }
}
/* A long capacity keeps its full wording for readers and checks; the line shows the short form. */
.bub-site-page main.room-reference-detail [data-room-comparison-facts] strong[data-short] { font-size: 0; }
.bub-site-page main.room-reference-detail [data-room-comparison-facts] strong[data-short]::after { content: attr(data-short); font-size: 15px; line-height: 22px; }
@media (max-width: 767px) {
  .bub-site-page main.room-reference-detail .chosei-room-listing-highlights { column-gap: 14px; }
  .bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li { gap: 4px; }
  .bub-site-page main.room-reference-detail .chosei-room-listing-highlights .bell-ui-icon { width: 16px; height: 16px; }
  .bub-site-page main.room-reference-detail .chosei-room-listing-highlights strong,
  .bub-site-page main.room-reference-detail [data-room-comparison-facts] strong[data-short]::after { font-size: 14px; }
}
/* Same shape on every room: capacity and size on one line, the water arrangement (often long) under it. */
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li[data-fact="定員"] { order: 1; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li[data-fact="広さ（目安）"] { order: 2; }
.bub-site-page main.room-reference-detail .chosei-room-listing-highlights > li[data-fact="水回り"] { order: 3; flex-basis: 100%; }

/* Room pages in the detail-page grammar (2026-10-17): 客室の目安 cells, 写真 and ※ lines, copied from the
   food pages (food-room-reference.css), scoped to .room-guide. */
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells { margin: 24px 0 0; padding: 0; list-style: none; overflow: hidden; border-radius: 12px; background: var(--surface-subtle); }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li { position: relative; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li + li::before { content: ""; position: absolute; top: 0; left: 50px; right: 0; border-top: 1px solid rgb(47 47 47 / 8%); }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells :is(li, li > a, li > button) { display: grid; grid-template-columns: 20px 48px minmax(0, 1fr) auto; align-items: center; column-gap: 12px; min-height: 52px; padding: 0 16px; color: var(--ink); text-decoration: none; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li:has(> :is(a, button)) { display: block; padding: 0; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li > button { width: 100%; margin: 0; border: 0; background: none; font: inherit; text-align: left; cursor: pointer; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li > :is(a, button) { padding-block: 10px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells .ic { width: 20px; height: 20px; color: rgb(47 47 47 / 60%); }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells em { color: rgb(47 47 47 / 60%); font-size: 13px; line-height: 20px; font-style: normal; font-weight: 500; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells span { display: grid; gap: 0; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells strong { font-size: 15px; line-height: 22px; font-weight: 700; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li.is-time strong { font: 700 20px/26px var(--font-num), var(--font-ja); }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells small { color: rgb(47 47 47 / 70%); font-size: 12px; line-height: 18px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells :is(a, button) .ic:last-child { width: 16px; height: 16px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-notes { display: grid; gap: 4px; margin: 10px 0 0; padding: 0; list-style: none; color: rgb(47 47 47 / 70%); font-size: 13px; line-height: 20px; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos > div { display: grid; grid-template-columns: 3fr 2fr; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 8px; aspect-ratio: 5 / 3.4; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos figure { position: relative; min-height: 0; margin: 0; overflow: hidden; border-radius: 12px; background: var(--surface-subtle); }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos figure.is-lead { grid-row: 1 / -1; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos figcaption { position: absolute; left: 8px; bottom: 8px; padding: 2px 8px; border-radius: 999px; background: rgb(252 252 252 / 92%); color: var(--ink); font-size: 11px; line-height: 18px; font-weight: 700; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos .is-missing { display: grid; place-items: center; border: 1.5px dashed rgb(47 47 47 / 20%); background: none; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos .is-missing span { display: grid; gap: 2px; color: rgb(47 47 47 / 60%); font-size: 12px; line-height: 18px; font-weight: 700; text-align: center; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos .is-missing small { font-size: 11px; font-weight: 500; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells :is(li, li > a, li > button) { grid-template-columns: 20px 56px minmax(0, 1fr) auto; }
.bub-site-page main.room-reference-detail .room-guide :is(.activity-frame-facts, .activity-frame-photos) h2,
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos h2 { margin: 0 0 14px; color: var(--ink); font-size: 20px; line-height: 28px; font-weight: 700; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells { margin-top: 0; }
.bub-site-page main.room-reference-detail .room-guide-lead { margin: 12px 0 0; color: var(--ink); font-size: 15px; line-height: 26px; }
.bub-site-page main.room-reference-detail .room-guide { margin-top: 32px; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos { margin-top: 40px; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos > div.is-two { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; aspect-ratio: 2 / 1; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos > div.is-two figure { grid-row: auto; }
.bub-site-page main.room-reference-detail .room-guide.activity-frame-photos a { display: block; height: 100%; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-notes { margin-top: 0; }
.bub-site-page .room-listing-detail-page.room-reference-detail #room-types > .chosei-room-listing-room-rail { grid-column: 1 / -1; }
/* The panel keeps data-room-comparison-facts for the hub/detail fact contract, but not the old fact list's
   look (grid gap 16px, a line above and below): it is the same panel as on the food and activity pages. */
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells[data-room-comparison-facts] { display: block; gap: 0; border: 0; }
/* The same space above and below every row's text, and room at the sides (2026-10-17). */
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells :is(li, li > button) { min-height: 0; padding: 14px 20px; box-sizing: border-box; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li:has(> button) { padding: 0; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li + li::before { left: 20px; right: 20px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells span { gap: 2px; }
.bub-site-page main.room-reference-detail .room-guide .activity-frame-facts h2 { margin-bottom: 16px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-notes { gap: 6px; }
/* Same type and rhythm as the food and activity guide blocks (2026-10-17): guide headings 20/28 (22/32 on
   PC), 40px between blocks, the lead at 16/28, small lines regular weight. 部屋タイプ reads as part of the guide. */
.bub-site-page main.room-reference-detail .room-guide-lead { margin: 16px 0 0; font-size: 16px; line-height: 28px; }
.bub-site-page main.room-reference-detail :is(.room-guide .activity-frame-facts h2, .room-guide.activity-frame-photos h2, #room-types > .chosei-room-listing-section-heading h2) { margin: 0 0 14px; font-size: 20px; line-height: 28px; font-weight: 700; }
.bub-site-page .room-listing-detail-page.room-reference-detail section#room-types { margin-top: 40px; padding-block: 0; border: 0; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells li { font-size: 16px; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-cells small { font-weight: 400; }
.bub-site-page main.room-reference-detail .room-guide .activity-app-notes { margin-top: 14px; gap: 4px; }
.bub-site-page main.room-reference-detail .room-guide:has(> .activity-app-notes) { margin-top: 0; }
@media (min-width: 768px) {
  .bub-site-page main.room-reference-detail :is(.room-guide .activity-frame-facts h2, .room-guide.activity-frame-photos h2, #room-types > .chosei-room-listing-section-heading h2) { font-size: 22px; line-height: 32px; }
}
.bub-site-page main.room-reference-detail .room-guide:has(> .activity-frame-facts) { margin-top: 28px; }
.bub-site-page .room-listing-detail-page.room-reference-detail section#other-rooms { margin-top: 32px; padding-top: 0; border-top: 0; }
@media (min-width: 768px) {
  .bub-site-page .room-listing-detail-page.room-reference-detail section#other-rooms { margin-top: 40px; }
}