/* ==========================================================================
   BoostUp Rent Search
   テーマのデザイントークンを参照し、LP側と同じ控えめな角丸・薄い罫線・白面で統一。
   ========================================================================== */

.brs {
  --l:  var(--color-border, #e2e4e7);
  --ls: var(--color-border-strong, #d3d6da);
  --ink:   var(--color-text-main, #17181b);
  --ink2:  var(--color-text-sub, #565a61);
  --muted: var(--color-text-muted, #9297a0);
  --surf:  var(--color-surface, #fff);
  --surf2: var(--color-bg-light, #edeef0);
  --btn:   var(--color-accent, #0077c8);
  --btn-strong: var(--color-accent-strong, #005f9f);
  --btn-ink: var(--color-accent-ink, #fff);
  /* CV（問い合わせ・検索）＝オレンジ */
  --cv:        var(--color-cv, #f47a1f);
  --cv-strong: var(--color-cv-strong, #d86400);
  --cv-ink:    var(--color-cv-ink, #fff);
  --gold:  var(--color-hairline, #9a824c);
  --price: var(--color-price, var(--color-accent, #0077c8));
  /* LPに合わせた控えめな角丸 */
  --radius-sm: var(--border-radius-sm, 0);
  --radius-md: var(--border-radius-md, 0);
  --radius-lg: var(--border-radius-lg, 0);
  --shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05));
  --brs-line: 1px;
  --brs-line-accent: 3px;
  --brs-space-2xs: 2px;
  --brs-space-xs: var(--space-xs, 6px);
  --brs-space-sm: var(--space-sm, 8px);
  --brs-space-md: var(--space-md, 14px);
  --brs-space-lg: var(--space-lg, 18px);
  --brs-space-xl: var(--space-xl, 24px);
  --brs-space-2xl: var(--space-2xl, 40px);
  --brs-font-2xs: var(--font-2xs, 11px);
  --brs-font-xs: var(--font-xs, 12px);
  --brs-font-sm: var(--font-sm, 14px);
  --brs-font-md: var(--font-md, 16px);
  --brs-font-lg: var(--font-lg, 20px);
  --brs-control-md: 42px;
  --brs-action-min-height: 36px;
  --brs-cost-icon-size: 20px;
  --brs-fav-size: 58px;
  --brs-mobile-action-size: 40px;
  --brs-floorplan-size: 86px;
  --brs-floorplan-size-mobile: 112px;
  --brs-room-min-height: 128px;
  --brs-accordion-icon-size: 1.75rem;
  --brs-accordion-line-long: .75rem;
  --brs-accordion-line-thick: 1px;
  --brs-hover-y: -2px;
  --brs-table-head-bg: var(--color-bg-soft, #eeeeee);
  --brs-table-head-ink: var(--color-text-sub, #4f5659);
  --brs-row-border: var(--color-border-strong, #d5d5d5);
  --brs-photo-border: var(--color-border, #d8dddd);
  --brs-empty-bg: var(--color-bg-light, #f5f8f8);
  --brs-badge-bg: var(--color-text-muted, #9b9b9b);
  --brs-badge-ink: var(--color-text-white, #fff);
  --brs-mobile-divider: var(--color-border, #e6ecef);
  --brs-mobile-thumb-bg: var(--color-bg-light, #eef4f6);
  --brs-fav-muted: var(--color-text-sub, #606a6d);
  --brs-accordion-neutral-ink: #17181b;
  --brs-accordion-neutral-border: #d3d6da;

  display: grid;
  grid-template-columns: 1fr;                /* モバイル: フォーム→結果の縦積み */
  gap: clamp(24px, 3vw, 44px);
  font-family: var(--font-family, sans-serif);
}
@media (min-width: 1024px) { .brs { grid-template-columns: 320px 1fr; } }  /* lg: 左フォーム + 右結果 */
/* 検索フォームを伴わない使い方（詳細下の関連物件・トップの新着物件など）は
   2カラムグリッドを解除して1カラムで流す */
.brs--form,
.brs--results,
.brs--related,
.brs--new,
.brs--favorites,
.brs--same-building {
  display: block;
}
.brs__state {
  display: none;
}

/* ---- 検索ページ / 現在条件 / 保存条件 ---- */
.brs-search {
  display: grid;
  gap: 18px;
}
.brs-search__card {
  overflow: hidden;
  border: 1px solid var(--l);
  border-radius: var(--radius-lg);
  background: var(--surf);
  box-shadow: none;
}
.brs-form--search-page {
  border: 0;
  padding: clamp(22px, 4vw, 42px);
}
.brs-condition {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-bottom: 20px;
  padding: 18px;
  border: 1px solid var(--l);
  border-radius: var(--radius-lg);
  background: var(--surf);
  box-shadow: none;
}
.brs-condition__eyebrow {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
}
.brs-condition__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.brs-condition__token {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 11px;
  border: 1px solid var(--ls);
  border-radius: 999px;
  background: var(--surf2);
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}
.brs-condition__count {
  margin: 10px 0 0;
  color: var(--ink2);
  font-size: 14px;
}
.brs-condition__count strong {
  color: var(--ink);
  font-family: var(--ff-num, sans-serif);
  font-size: 24px;
}
.brs-condition__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.brs-condition__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid var(--ls);
  border-radius: 999px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  box-shadow: none;
  transition: background .2s, border-color .2s, color .2s, transform .2s, opacity .2s;
}
.brs-condition__btn--save {
  border-color: var(--btn);
  color: var(--btn);
}
.brs-condition__btn--change {
  background: var(--btn);
  border-color: var(--btn);
  color: var(--btn-ink);
  box-shadow: none;
}
.brs-condition__btn:hover {
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}
.brs-condition__btn--change:hover {
  color: var(--btn-ink);
  opacity: .9;
  box-shadow: none;
}
.brs-saved {
  grid-column: 1 / -1;
  margin-top: 2px;
  padding-top: 16px;
  border-top: 1px solid var(--l);
}
.brs-saved[hidden] {
  display: none;
}
.brs-saved--standalone {
  grid-column: auto;
  margin: 0;
  padding: 16px;
  border: 1px solid var(--l);
  border-radius: var(--radius-lg);
  background: var(--surf);
  box-shadow: none;
}
.brs-saved__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.brs-saved__title {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
}
.brs-saved__clear,
.brs-saved__remove {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 0;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  text-decoration: underline;
  box-shadow: none;
  cursor: pointer;
}
.brs-saved__list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.brs-saved__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--l);
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: none;
}
.brs-saved__link {
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: color .2s;
}
.brs-saved__link:hover {
  color: var(--btn);
}
@media (max-width: 767px) {
  .brs-condition {
    grid-template-columns: 1fr;
    padding: 16px;
    border-radius: var(--radius-lg);
  }
  .brs-condition__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: stretch;
  }
  .brs-condition__btn {
    min-height: 42px;
    padding: 9px 12px;
    font-size: 14px;
  }
}

/* ---- フォーム ---- */
.brs-form {
  border: 0;
  border-radius: 0;
  background: var(--surf);
  padding: 22px;
  box-shadow: none;
}
.brs-form__grid { display: flex; flex-direction: column; gap: 20px; }
.brs-field__label { display: block; font-weight: 700; font-size: 12px; letter-spacing: .06em; color: var(--ink2); margin-bottom: 8px; }

.brs-input,
.brs-select {
  width: 100%; appearance: none; font: inherit; font-size: 14px; color: var(--ink);
  min-height: 42px;
  background: var(--surf2); border: 1px solid transparent;
  border-radius: 999px; padding: 8px 16px;
}
.brs-input:focus, .brs-select:focus { outline: none; border-color: var(--btn); background: var(--surf); }
/* 沿線 / 駅: 幅があれば横並び、狭ければ縦積み。
   検索ページは全幅なので 2 カラム、結果ページの左サイドバー(320px)では自動的に縦積みになる。 */
.brs-field--line-station .brs-field__control {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

.brs-range { display: flex; align-items: center; gap: 8px; }
.brs-range .brs-select { flex: 1; }
.brs-range__sep { color: var(--muted); }

.brs-checks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: 8px;
}
.brs-check {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%;
  padding: 8px 12px; border: 1px solid var(--ls); border-radius: 999px;
  text-align: center;
  font-size: 13px; color: var(--ink2); cursor: pointer; user-select: none; transition: .15s;
}
.brs-check:hover { border-color: var(--ink); }
.brs-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.brs-check:has(input:checked) { border-color: var(--ink); background: var(--ink); color: var(--surf); font-weight: 600; }

/* 件数を上、ボタンを中央。ボタン位置はサイト全体で中央に統一する。 */
.brs-form__actions {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--l);
}
.brs-form__buttons {
  display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap;
}
.brs-count { font-size: 13px; color: var(--ink2); }
.brs-count__num { font-family: var(--ff-num, "Helvetica Neue", Arial, sans-serif); font-variant-numeric: tabular-nums; font-size: 22px; color: var(--ink); font-weight: 700; }

.brs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 999px; cursor: pointer; font: inherit; font-weight: 700; letter-spacing: .04em; box-shadow: none; transition: background .2s, color .2s, border-color .2s, transform .2s; }
.brs-btn i,
.brs-condition__btn i,
.brs-saved__clear i,
.brs-saved__remove i,
.brs-bldg__toggle i,
.brs-mobile-bar__btn i {
  flex: none;
  font-size: 1.15em;
  line-height: 1;
}
/* 検索＝主要アクションなのでCVカラー */
.brs-btn--search { background: var(--cv); color: var(--cv-ink); padding: 12px 28px; font-size: 14px; box-shadow: none; }
.brs-btn--search:hover { background: var(--cv-strong); color: var(--cv-ink); transform: translateY(var(--brs-hover-y)); box-shadow: none; }
.brs-btn--reset {
  padding: 12px 20px;
  color: var(--muted);
  background: var(--surf);
  border: 1px solid var(--ls);
  text-decoration: none;
  font-weight: 700;
  box-shadow: none;
}
.brs-btn--reset:hover {
  color: var(--surf);
  background: var(--ink);
  border-color: var(--ink);
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}

/* ---- 結果バー ---- */
.brs-resultsbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.brs-total { font-size: 14px; color: var(--ink2); }
.brs-total__num { font-family: var(--ff-num, sans-serif); font-variant-numeric: tabular-nums; font-size: 28px; font-weight: 700; color: var(--ink); }
.brs-sort { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink2); }
.brs-sort__select { width: auto; appearance: none; background: transparent; border: 0; border-bottom: 1px solid var(--ls); padding: 6px 2px; font: inherit; color: var(--ink); }

/* ---- 結果一覧（建物グループ + 単独号室グリッド）---- */
.brs-results-wrap.is-loading { opacity: .5; pointer-events: none; }
.brs-results { display: flex; flex-direction: column; gap: var(--brs-space-xl); }
.brs-cards {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 2px;
  background: var(--l); border: 1px solid var(--l);
}

/* 建物グループの基本構造 */
.brs-bldg { border: var(--brs-line) solid var(--l); background: var(--surf); }
.brs-bldg__head { display: flex; gap: var(--brs-space-md); padding: var(--brs-space-md); }
.brs-bldg__thumb { flex: 0 0 40%; max-width: 240px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surf2); }
.brs-bldg__img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.brs-bldg__noimg { display: grid; place-items: center; height: 100%; color: var(--muted); font-size: var(--brs-font-2xs); letter-spacing: .2em; }
.brs-bldg__meta { min-width: 0; }
.brs-bldg__name { font-size: var(--brs-font-md); font-weight: 700; margin: 0 0 var(--brs-space-xs); }
.brs-bldg__addr, .brs-bldg__station { font-size: var(--brs-font-xs); color: var(--muted); margin: var(--brs-space-2xs) 0; }
.brs-bldg__count { font-size: var(--brs-font-xs); margin-top: var(--brs-space-sm); }
.brs-bldg__count .num { color: var(--gold); font-weight: 700; }
.brs-bldg__rooms { list-style: none; margin: 0; padding: 0; }
.brs-bldg__room + .brs-bldg__room { border-top: var(--brs-line) solid var(--l); }
.brs-bldg__room.is-hidden { display: none; }
/* 行ホバーは行そのものに当てる。
   以前は `.brs-bldg__room a:hover` と書いていたが、行内に素の <a> は無く
   「詳細を見る / 問い合わせ」ボタンだけに当たっていた。詳細度が (0,2,1) で
   ボタン自身のホバー (0,2,0) に勝つため、背景が薄色に塗り替えられ
   白文字が読めなくなっていた。 */
.brs-bldg__room:hover { background: var(--surf2); }
.brs-bldg__floor { flex: none; min-width: 3.5em; font-weight: 700; font-family: var(--ff-num, sans-serif); }
.brs-bldg__rent { flex: none; font-family: var(--ff-num, sans-serif); font-weight: 700; color: var(--ink); }
.brs-bldg__rent small { color: var(--muted); font-weight: 400; }
.brs-bldg__spec { flex: 1 1 100%; color: var(--ink2); font-size: var(--brs-font-xs); }
.brs-bldg__more { flex: none; margin-left: auto; color: var(--muted); font-size: var(--brs-font-xs); }
.brs-bldg__toggle { display: inline-flex; align-items: center; justify-content: center; gap: 4px; width: 100%; padding: var(--brs-space-sm); border: 0; border-top: var(--brs-line) solid var(--l); background: none; color: var(--btn); font-weight: 700; cursor: pointer; }
.brs-bldg__toggle:hover { background: var(--surf2); }
@media (min-width: 768px) { .brs-bldg__spec { flex: 1 1 auto; } }

/* 建物概要 + 募集住戸テーブル */
.brs-bldg {
  border: 0;
  border-top: var(--brs-line-accent) solid var(--btn);
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
.brs-bldg__bar {
  display: none;
}
.brs-bldg__titleline {
  display: flex;
  align-items: center;
  gap: var(--brs-space-sm);
  padding: var(--brs-space-sm) var(--brs-space-md) var(--brs-space-xs);
  border-radius: 0;
}
.brs-bldg__badge {
  flex: none;
  background: var(--surf);
  border: var(--brs-line) solid var(--btn);
  color: var(--btn);
  font-size: var(--brs-font-2xs);
  font-weight: 700;
  line-height: 1;
  padding: var(--brs-space-xs) var(--brs-space-sm);
  border-radius: 999px;
}
.brs-bldg__titlelink {
  color: var(--ink);
  font-size: clamp(var(--brs-font-sm), 1.4vw, var(--brs-font-lg));
  font-weight: 700;
  text-decoration: none;
}
.brs-bldg__titlelink:hover { color: var(--btn); text-decoration: underline; }
.brs-bldg__head {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: var(--brs-space-md);
  padding: var(--brs-space-xs) var(--brs-space-md) var(--brs-space-sm);
}
.brs-bldg__thumb {
  max-width: none;
  border: 0;
  border-radius: 0;
}
.brs-bldg__spec-table {
  width: 100%;
  height: 100%;
  border-collapse: collapse;
  font-size: var(--brs-font-xs);
}
/* 交通は 1 駅 1 行 */
.brs-bldg__stations {
  list-style: none;
  margin: 0;
  padding: 0;
}
.brs-bldg__stations li + li {
  margin-top: var(--brs-space-2xs);
}

.brs-bldg__spec-table th,
.brs-bldg__spec-table td {
  border: 0;
  border-bottom: var(--brs-line) dotted var(--l);
  padding: var(--brs-space-sm) var(--brs-space-md);
  text-align: left;
  vertical-align: middle;
}
.brs-bldg__spec-table th {
  width: 7.5rem;
  background: transparent;
  color: var(--ink2);
  font-weight: 500;
}
.brs-bldg__spec-row--age th,
.brs-bldg__spec-row--age td {
  border-bottom: 0;
}
.brs-bldg__count {
  padding: var(--brs-space-sm) var(--brs-space-md);
  color: var(--ink);
  font-size: var(--brs-font-sm);
  font-weight: 700;
}
.brs-bldg__count strong {
  color: var(--btn);
  font-family: var(--ff-num, sans-serif);
  font-size: var(--brs-font-lg);
}
.brs-bldg__rooms {
  border-top: 0;
}
.brs-bldg__room-head,
.brs-bldg__room {
  display: grid;
  /* 賃料列だけが余白を吸わないよう、各列に最小幅を持たせて余りを分配する */
  grid-template-columns:
    92px
    86px
    minmax(150px, 1.1fr)
    minmax(104px, 0.9fr)
    minmax(108px, 0.9fr)
    minmax(92px, 0.8fr)
    minmax(116px, 1fr);
  align-items: center;
}
.brs-bldg__room-head {
  min-height: var(--brs-control-md);
  background: var(--brs-table-head-bg);
  color: var(--brs-table-head-ink);
  font-size: var(--brs-font-xs);
  text-align: center;
}
.brs-bldg__room-head span {
  padding: var(--brs-space-sm) var(--brs-space-xs);
}
.brs-bldg__room {
  position: relative;
  min-height: var(--brs-room-min-height);
  border-top: var(--brs-line) solid var(--brs-row-border);
}
.brs-bldg__room > div {
  box-sizing: border-box;
  min-width: 0;
  padding: var(--brs-space-md) var(--brs-space-sm);
}
.brs-bldg__floorplan,
.brs-bldg__floor,
.brs-bldg__price,
.brs-bldg__cost,
.brs-bldg__room-spec,
.brs-bldg__fav,
.brs-bldg__detail {
  align-self: center;
}
.brs-bldg__floorplan,
.brs-bldg__floor,
.brs-bldg__room-spec,
.brs-bldg__cost,
.brs-bldg__fav,
.brs-bldg__detail {
  text-align: center;
}
.brs-bldg__floorplan-img {
  display: block;
  width: var(--brs-floorplan-size);
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  border: var(--brs-line) solid var(--brs-photo-border);
  border-radius: var(--radius-sm);
  box-shadow: none;
}
.brs-bldg__floorplan-empty {
  display: inline-grid;
  place-items: center;
  width: var(--brs-floorplan-size);
  max-width: 100%;
  aspect-ratio: 4 / 3;
  background: var(--brs-empty-bg);
  color: var(--muted);
  font-size: var(--brs-font-xs);
  border-radius: var(--radius-sm);
  box-shadow: none;
}
.brs-bldg__floor {
  font-size: var(--brs-font-sm);
  font-weight: 700;
  line-height: 1.55;
  white-space: nowrap;
}
.brs-bldg__price {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: left;
}
.brs-bldg__rent {
  margin: 0 0 var(--brs-space-xs);
  color: var(--price);
  font-weight: 700;
  white-space: nowrap;
}
.brs-bldg__rent .num {
  font-family: var(--ff-num, sans-serif);
  font-size: var(--font-xl, 26px);
  line-height: 1.1;
}
.brs-bldg__rent .unit {
  display: inline-block;
  margin-left: .08em;
  font-family: var(--font-family-base, sans-serif);
  font-size: var(--brs-font-sm);
  line-height: 1;
}
.brs-bldg__subcost {
  margin: 0;
  color: var(--ink);
  font-size: var(--brs-font-xs);
  line-height: 1.45;
  white-space: nowrap;
}
.brs-bldg__cost {
  display: grid;
  gap: var(--brs-space-xs);
  justify-content: center;
  color: var(--ink);
  font-size: var(--brs-font-xs);
  line-height: 1.4;
}
.brs-bldg__cost p {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  margin: 0;
  white-space: nowrap;
}
.brs-bldg__cost span {
  display: inline-grid;
  place-items: center;
  width: var(--brs-cost-icon-size);
  height: var(--brs-cost-icon-size);
  margin-right: var(--brs-space-xs);
  background: var(--brs-badge-bg);
  color: var(--brs-badge-ink);
  font-size: var(--brs-font-xs);
  font-weight: 700;
  /* body 由来の letter-spacing は字の右側に余白を作り、
     palt は字詰めをするため 1 文字だと中央からずれる。ここでは打ち消す。 */
  line-height: 1;
  letter-spacing: 0;
  text-indent: 0;
  font-feature-settings: normal;
  font-kerning: none;
  border-radius: 999px;
}
.brs-bldg__room-spec {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--brs-space-xs);
  font-size: var(--brs-font-sm);
  line-height: 1.4;
}
.brs-bldg__room-spec span {
  white-space: nowrap;
}
.brs-bldg__room-spec span:first-child {
  font-weight: 600;
}
.brs-bldg__fav-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: var(--brs-fav-size);
  height: var(--brs-fav-size);
  min-height: 0;
  aspect-ratio: 1 / 1;
  padding: var(--brs-space-xs);
  border: var(--brs-line) solid var(--ls);
  border-radius: var(--radius-md);
  background: var(--surf);
  color: var(--btn);
  cursor: pointer;
  box-shadow: none;
  transition: background .2s, border-color .2s, color .2s, transform .2s;
}
.brs-bldg__fav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-xl, 26px);
  line-height: 1;
}
.brs-bldg__fav-icon i {
  display: block;
  line-height: 1;
}
.brs-bldg__fav-btn small {
  color: var(--brs-fav-muted);
  font-size: var(--brs-font-2xs);
  font-weight: 700;
}
.brs-bldg__fav-btn:hover {
  border-color: var(--btn);
  background: var(--color-accent-soft, #eef6fb);
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}
/* 登録済み。JS が localStorage を見て is-active を付ける。
   色はヘッダーの「お気に入り」ボタン（--color-accent = メインブルー）に合わせる。 */
.brs-bldg__fav-btn.is-active {
  color: var(--btn-ink);
  background: var(--btn);
  border-color: var(--btn);
  box-shadow: none;
}
.brs-bldg__fav-btn.is-active small { color: var(--btn-ink); }
.brs-bldg__fav-btn.is-active:hover {
  background: var(--btn-strong);
  border-color: var(--btn-strong);
  box-shadow: none;
}
.brs-bldg__detail {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--brs-space-sm);
}
/* 詳細を見る＝アウトライン（ホバーでアクセントカラーに塗りつぶす） */
.brs-bldg__detail-link,
.brs-bldg__detail-link:link,
.brs-bldg__detail-link:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  width: 100%;
  min-height: var(--brs-action-min-height);
  padding: var(--brs-space-xs) var(--brs-space-sm);
  border: var(--brs-line) solid var(--ls);
  border-radius: 999px;
  background: var(--surf);
  color: var(--ink);
  font-size: var(--brs-font-sm);
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: none;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.brs-bldg__detail-link:hover,
.brs-bldg__detail-link:focus {
  border-color: var(--btn);
  background: var(--btn);
  color: var(--btn-ink);
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}

/* 問い合わせ＝CV（オレンジのベタ塗り） */
.brs-bldg__contact-link,
.brs-bldg__contact-link:link,
.brs-bldg__contact-link:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  width: 100%;
  min-height: var(--brs-action-min-height);
  padding: var(--brs-space-xs) var(--brs-space-sm);
  border: var(--brs-line) solid var(--cv);
  border-radius: 999px;
  background: var(--cv);
  color: var(--cv-ink);
  font-size: var(--brs-font-xs);
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: none;
  transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.brs-bldg__contact-link:hover,
.brs-bldg__contact-link:focus {
  border-color: var(--cv-strong);
  background: var(--cv-strong);
  color: var(--cv-ink);
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}
.brs-bldg__detail-link i,
.brs-bldg__contact-link i {
  flex: none;
  font-size: 1.1em;
  line-height: 1;
}
.brs-bldg__detail-link span,
.brs-bldg__contact-link span {
  min-width: 0;
}
.brs-bldg__room-extra {
  grid-column: 3 / 7;
  padding-top: 0;
  border-top: var(--brs-line) dotted var(--l);
}
.brs-bldg__features {
  display: flex;
  flex-wrap: wrap;
  gap: var(--brs-space-xs);
  margin-bottom: var(--brs-space-sm);
}
.brs-bldg__feature {
  background: var(--surf2);
  color: var(--ink);
  font-size: var(--brs-font-xs);
  line-height: 1;
  padding: var(--brs-space-xs) var(--brs-space-sm);
  border-radius: 999px;
}
.brs-bldg__note {
  margin: 0;
  color: var(--ink);
  font-size: var(--brs-font-xs);
  line-height: 1.65;
}
.brs-bldg__toggle {
  color: var(--btn);
  font-size: var(--brs-font-sm);
}
@media (max-width: 767px) {
  .brs-results {
    gap: var(--brs-space-lg);
  }
  .brs-bldg {
    overflow: hidden;
    border-top: 0;
    border: var(--brs-line) solid var(--l);
    border-radius: 0;
    box-shadow: none;
  }
  .brs-bldg__titleline {
    align-items: center;
    flex-direction: row;
    padding: var(--brs-space-md) var(--brs-space-md) var(--brs-space-sm);
    border-bottom: var(--brs-line) solid var(--brs-mobile-divider);
  }
  .brs-bldg__badge { display: none; }
  .brs-bldg__titlelink {
    font-size: var(--brs-font-lg);
    line-height: 1.45;
  }
  /* 写真を横に置くと本文が 130px 程度しか残らず読めない。
     スマホでは写真とテキストを縦積みにして、どちらも横幅いっぱいに使う。 */
  .brs-bldg__head {
    display: block;
    gap: 0;
    padding: 0;
  }
  .brs-bldg__thumb {
    width: 100%;
    aspect-ratio: 16 / 10;
    background: var(--brs-mobile-thumb-bg);
    border-radius: 0;
  }
  .brs-bldg__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
  }
  .brs-bldg__meta {
    padding: var(--brs-space-md);
  }
  .brs-bldg__spec-table,
  .brs-bldg__spec-table tbody,
  .brs-bldg__spec-table tr,
  .brs-bldg__spec-table th,
  .brs-bldg__spec-table td {
    display: block;
    width: auto;
    height: auto;
    border: 0;
    padding: 0;
  }
  /* 項目名は隠さず、値の上に小さく出す（何の数字か分からなくなるため） */
  .brs-bldg__spec-table th {
    margin-bottom: var(--brs-space-2xs);
    color: var(--muted);
    font-size: var(--brs-font-xs);
    font-weight: 400;
    text-align: left;
  }
  .brs-bldg__spec-table tr + tr {
    margin-top: var(--brs-space-sm);
  }
  /* 建物の基本情報は補助情報。太字・大きめだと号室の賃料より目立つ。 */
  .brs-bldg__spec-table td {
    font-size: var(--brs-font-sm);
    font-weight: 400;
    line-height: 1.6;
    color: var(--ink2);
  }
  .brs-bldg__spec-table tr + tr td {
    margin-top: var(--brs-space-xs);
  }
  .brs-bldg__stations li {
    font-size: var(--brs-font-sm);
    line-height: 1.6;
  }
  .brs-bldg__count {
    padding: var(--brs-space-sm) var(--brs-space-md);
    border-top: 0;
    border-bottom: var(--brs-line) solid var(--brs-mobile-divider);
  }
  .brs-bldg__room-head {
    display: none;
  }
  .brs-bldg__room {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 40px;
    column-gap: var(--brs-space-xs);
    align-items: start;
    min-height: 0;
    padding: var(--brs-space-lg) var(--brs-space-md);
    border-top: 0;
  }
  .brs-bldg__room + .brs-bldg__room {
    border-top: var(--brs-line) solid var(--brs-mobile-divider);
  }
  .brs-bldg__room > div {
    padding: 0;
  }
  .brs-bldg__floorplan {
    grid-column: 1;
    grid-row: 1 / 4;
    padding-right: 0;
  }
  .brs-bldg__floorplan-img,
  .brs-bldg__floorplan-empty {
    width: var(--brs-floorplan-size-mobile);
    border: 0;
    border-radius: var(--radius-md);
  }
  .brs-bldg__floorplan-img {
    box-shadow: none;
  }
  .brs-bldg__floorplan-empty {
    box-shadow: none;
  }
  .brs-bldg__floor,
  .brs-bldg__cost,
  .brs-bldg__room-spec,
  .brs-bldg__fav,
  .brs-bldg__detail {
    text-align: left;
  }
  .brs-bldg__floor {
    display: none;
  }
  .brs-bldg__price,
  .brs-bldg__cost,
  .brs-bldg__room-spec,
  .brs-bldg__room-extra {
    grid-column: 2 / 4;
  }
  .brs-bldg__price {
    grid-row: 1;
  }
  .brs-bldg__rent .num {
    font-size: 24px;
  }
  .brs-bldg__subcost {
    display: inline;
    margin-left: 6px;
    font-size: 15px;
  }
  .brs-bldg__cost {
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 10px;
    margin-top: 6px;
    font-size: 15px;
  }
  .brs-bldg__cost p {
    margin: 0;
    white-space: nowrap;
  }
  .brs-bldg__cost span {
    background: var(--surf);
    border: 1px solid var(--btn);
    color: var(--btn);
  }
  .brs-bldg__room-spec {
    grid-row: 3;
    display: block;
    margin-top: 7px;
    font-size: 18px;
    font-weight: 700;
  }
  .brs-bldg__room-spec span {
    display: inline;
  }
  .brs-bldg__room-spec span + span {
    margin-left: var(--brs-space-sm);
    padding-left: var(--brs-space-sm);
    border-left: var(--brs-line) solid var(--l);
  }
  .brs-bldg__room-extra {
    border-top: 1px dotted #c6ccce;
  }
  .brs-bldg__fav {
    display: flex;
    justify-content: flex-end;
    align-items: stretch;
    position: static;
    grid-column: 3;
    grid-row: 4;
    margin-top: 12px;
  }
  .brs-bldg__fav-btn {
    width: 40px;
    height: 40px;
    min-height: 0;
    border: 1px solid var(--btn);
    background: var(--surf);
    color: var(--btn);
    padding: 0;
  }
  .brs-bldg__fav-icon {
    font-size: 28px;
  }
  .brs-bldg__fav-btn small { display: none; }
  .brs-bldg__detail {
    grid-column: 1 / 3;
    grid-row: 4;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 6px;
    margin-top: 12px;
    padding-right: 0;
  }
  .brs-bldg__detail-link,
  .brs-bldg__detail-link:link,
  .brs-bldg__detail-link:visited,
  .brs-bldg__contact-link,
  .brs-bldg__contact-link:link,
  .brs-bldg__contact-link:visited {
    position: static;
    flex: 1 1 0;
    width: auto;
    max-width: none;
    min-width: 0;
    min-height: 40px;
    transform: none;
    overflow: visible;
    padding: 7px 2px;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 1.2;
    white-space: nowrap;
  }
  .brs-bldg__detail-link::after {
    content: none;
  }
}

.brs-card {
  background: var(--surf);
  position: relative;
  min-width: 0;
  border-radius: var(--radius-lg);
  box-shadow: none;
  overflow: hidden;
  transition: transform .2s;
}
.brs-card:hover { transform: translateY(var(--brs-hover-y)); box-shadow: none; z-index: 2; }
.brs-card__link { display: block; min-width: 0; color: inherit; text-decoration: none; }
.brs-card__thumb { width: 100%; max-width: 100%; min-width: 0; aspect-ratio: 16/11; background: var(--surf2); overflow: hidden; }
.brs-card__img { display: block; width: 100%; max-width: 100%; height: 100%; object-fit: cover; }
.brs-card__noimg { display: grid; place-items: center; height: 100%; color: var(--muted); font-size: 11px; letter-spacing: .2em; }
.brs-card__body { padding: 16px; }
.brs-card__title { font-size: 15px; font-weight: 600; margin: 0 0 8px; line-height: 1.5; }
.brs-card__rent { display: flex; align-items: baseline; gap: 4px; margin: 0 0 8px; }
.brs-card__rent-num { font-family: var(--ff-num, sans-serif); font-variant-numeric: tabular-nums; font-size: 25px; font-weight: 700; color: var(--ink); }
.brs-card__mgmt { font-size: 12px; color: var(--muted); font-weight: 400; margin-left: 4px; }
.brs-card__spec { display: flex; gap: 12px; font-size: 13px; color: var(--ink2); margin: 0 0 10px; padding-bottom: 10px; border-bottom: 1px solid var(--l); }
.brs-card__station,
.brs-card__addr { font-size: 12px; color: var(--muted); margin: 2px 0 0; }

.brs-empty { grid-column: 1 / -1; background: var(--surf); padding: 48px 16px; text-align: center; color: var(--muted); }

/* ---- ページネーション ---- */
.brs-pager { grid-column: 1 / -1; background: var(--surf); margin-top: 2px; padding: 20px 0; }
.brs-pager__list { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; padding: 0; margin: 0; }
.brs-pager__link { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 10px; border: 1px solid var(--ls); text-decoration: none; color: inherit; font-family: var(--ff-num, sans-serif); }
.brs-pager__link { border-radius: 999px; box-shadow: none; transition: border-color .2s, transform .2s; }
.brs-pager__link:hover { border-color: var(--ink); transform: translateY(var(--brs-hover-y)); box-shadow: none; }
.brs-pager__item.is-current .brs-pager__link { background: var(--btn); color: var(--btn-ink); border-color: var(--btn); }

/* ==========================================================================
   一覧レイアウト強化（2カラム建物カード + アコーディオン絞り込み）
   ========================================================================== */
/* 建物カードを2カラムグリッドに（広い画面） */
@media (min-width: 1200px) {
  .brs-results { display: flex; flex-direction: column; gap: 24px; align-items: stretch; }
}

/* 絞り込みサイドバーを sticky に */
@media (min-width: 1024px) {
  .brs-form { position: sticky; top: 16px; align-self: start; }
}

/* 絞り込み各項目をアコーディオン化 */
.brs-field__label.c-toggle-icon {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--brs-space-sm);
  user-select: none;
  --toggle-icon-size: var(--brs-accordion-icon-size);
  --toggle-icon-line-length: var(--brs-accordion-line-long);
  --toggle-icon-stroke: var(--brs-accordion-line-thick);
  --toggle-icon-border: var(--brs-accordion-neutral-border);
  --toggle-icon-color: var(--brs-accordion-neutral-ink);
  --toggle-icon-bg: transparent;
  --toggle-icon-hover-border: var(--brs-accordion-neutral-ink);
  --toggle-icon-vertical-size: 0px;
  --toggle-icon-rotate: 180deg;
}
.brs .brs-field__label.c-toggle-icon::after {
  flex: none;
  margin-left: var(--brs-space-sm);
}
.brs .brs-field.is-collapsed:not(.brs-field--static) .brs-field__label.c-toggle-icon {
  --toggle-icon-vertical-size: var(--toggle-icon-line-length);
  --toggle-icon-rotate: 0deg;
}
.brs-field.is-collapsed:not(.brs-field--static) .brs-field__control,
.brs-field.is-collapsed:not(.brs-field--static) .brs-checks { display: none; }

/* ============================================================
   セレクト / 入力の視認性（「選択できる」と分かるように）
   appearance:none でネイティブ矢印が消えているため、下向き矢印を補う。
   ============================================================ */

/* 入力・セレクトを枠線＋白背景のフォームコントロールらしく */
.brs-input,
.brs-select {
  background-color: var(--surf, #fff);
  border: 1px solid var(--ls);
  border-radius: 999px;
  padding: 10px 16px;
  transition: border-color .2s, box-shadow .2s;
}
.brs-input:hover,
.brs-select:hover {
  border-color: var(--color-accent, #0077c8);
}
.brs-input:focus,
.brs-select:focus {
  outline: none;
  border-color: var(--color-accent, #0077c8);
  box-shadow: 0 0 0 3px rgba(var(--color-accent-rgb, 0, 119, 200), .12);
}

/* 下向き矢印（検索フォーム・並び替え 共通） */
.brs-select,
.brs-sort__select {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%237c87a3' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  cursor: pointer;
}
.brs-select {
  background-position: right var(--select-arrow-inset, 16px) center;
  background-size: 12px 8px;
  padding-right: var(--select-padding-right, 40px);
  border-radius: 999px;
}
/* 並び替えも検索フォームと同じピル型に揃える */
.brs-sort__select {
  background-position: right 8px center;
  background-size: 12px 8px;
  padding: 8px 28px 8px 14px;
  border: 1px solid var(--ls);
  border-radius: 999px;
}
.brs-sort__select:focus { outline: none; border-color: var(--color-accent, #0077c8); }

/* ============================================================
   スマホ（〜1023px）
   結果を先に見せ、絞り込みは「全画面パネル(ドロワー)」に格納する。
   下部固定の「絞り込み」ボタンで開き、パネル下部に 該当件数＋検索を固定。
   ============================================================ */

/* PCでは非表示（JSで挿入される要素） */
.brs-mobile-bar,
.brs-drawer-backdrop,
.brs-drawer-head { display: none; }

@media (max-width: 1023px) {

  /* --- 絞り込みパネル（全画面ドロワー） --- */
  .brs__form-col {
    position: fixed; inset: 0; z-index: 1000;
    background: var(--surf, #fff);
    transform: translateY(100%);
    transition: transform .3s ease;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    visibility: hidden;
  }
  .brs.is-filter-open .brs__form-col { transform: translateY(0); visibility: visible; }

  .brs-drawer-backdrop {
    display: block; position: fixed; inset: 0; z-index: 999;
    background: rgba(0, 0, 0, .4);
    opacity: 0; pointer-events: none; transition: opacity .3s;
  }
  .brs.is-filter-open .brs-drawer-backdrop { opacity: 1; pointer-events: auto; }

  /* パネル上部のヘッダー（タイトル＋閉じる） */
  .brs-drawer-head {
    display: flex; align-items: center; justify-content: space-between;
    position: sticky; top: 0; z-index: 2;
    background: var(--surf, #fff);
    border-bottom: 1px solid var(--l);
    padding: 14px 16px;
  }
  .brs-drawer-head__title { font-weight: 700; font-size: 15px; color: var(--ink); }
  .brs-drawer-head__close {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ink2);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
  }

  /* パネル内のフォーム本体 */
  .brs-form { border: 0; padding: 16px 16px 0; position: static; }

  /* パネル下部に固定：該当N件 + この条件で検索 */
  .brs-form__actions {
    position: sticky; bottom: 0; z-index: 2;
    background: var(--surf, #fff);
    border-top: 1px solid var(--l);
    margin: 20px -16px 0;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    display: flex; flex-direction: column; align-items: center; gap: 10px;
  }
  .brs-form__buttons { width: 100%; }
  .brs-form__actions .brs-btn--search { flex: 1 1 auto; padding: 14px 16px; }

  /* --- 画面下の「絞り込み」呼び出しバー --- */
  .brs-mobile-bar {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
    background: var(--surf, #fff); border-top: 1px solid var(--l);
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  }
  /* 絞り込み＝検索と同じ主要アクションなのでCVカラー */
  .brs-mobile-bar__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    width: 100%; appearance: none; border: 0; border-radius: 999px;
    background: var(--color-cv, #f47a1f); color: var(--color-cv-ink, #fff);
    font-size: 15px; font-weight: 700; padding: 14px; cursor: pointer;
    box-shadow: none;
    transition: background .2s, transform .2s;
  }
  .brs-mobile-bar__btn:hover { background: var(--color-cv-strong, #d86400); transform: translateY(var(--brs-hover-y)); box-shadow: none; }
  .brs-mobile-bar__count { opacity: .9; font-weight: 500; margin-left: 6px; }

  /* パネルを開いている間は呼び出しバーを隠す */
  .brs.is-filter-open .brs-mobile-bar { display: none; }
}

/* パネル表示中は背面のスクロールを止める */
body.brs-noscroll { overflow: hidden; }

/* ==========================================================================
   お気に入り一覧（[boostup_rent_favorites]）
   ========================================================================== */
.brs-favorites__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--l);
}
.brs-favorites__bar[hidden] { display: none; }
.brs-favorites__count {
  margin: 0;
  font-size: 13px;
  color: var(--ink2);
}
.brs-favorites__count strong {
  font-family: var(--ff-num, sans-serif);
  font-variant-numeric: tabular-nums;
  font-size: 22px;
  font-weight: 700;
  color: var(--ink);
}

/* チェックボックスは「プライバシーポリシーに同意」(.buf-form__radio) と同じ意匠 */
.brs-favorites__check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink2);
  cursor: pointer;
}
.brs-favorites__check input {
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--btn);
}
/* 号室ごとの選択（JS が差し込む） */
.brs-bldg__room > .brs-favorites__check {
  position: absolute;
  top: 8px;
  right: 10px;
  z-index: 2;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid var(--l);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surf) 92%, transparent);
  font-size: 11px;
  line-height: 1;
}
.brs-bldg__room > .brs-favorites__check input {
  width: 1rem;
  height: 1rem;
}
@media (max-width: 767px) {
  .brs-bldg__room > .brs-favorites__check {
    top: 12px;
    right: 14px;
  }
}

/* 削除は破壊的な操作。一覧の下・中央に置く（サイト共通のボタン位置） */
.brs-favorites__actions {
  display: flex;
  justify-content: center;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--l);
}
.brs-favorites__actions[hidden] { display: none; }
.brs-btn--remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 17.5rem;
  padding: 12px 28px;
  font-size: 14px;
  color: var(--ink2);
  background: var(--surf);
  border: 1px solid var(--ls);
  box-shadow: none;
}
.brs-btn--remove i { font-size: 18px; line-height: 1; }
.brs-btn--remove:not(:disabled):hover {
  color: var(--surf);
  background: var(--color-danger, #d64545);
  border-color: var(--color-danger, #d64545);
  transform: translateY(var(--brs-hover-y));
  box-shadow: none;
}
.brs-btn--remove:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.brs-favorites__empty,
.brs-favorites__loading {
  margin: 0;
  padding: 40px 16px;
  text-align: center;
  color: var(--muted);
  line-height: 1.9;
}
.brs-favorites__empty[hidden],
.brs-favorites__loading[hidden] { display: none; }

.brs-bldg__thumb,
.brs-bldg__thumb .brs-bldg__img,
.brs-bldg__thumb img {
  border-radius: 0;
}