/* Customer room finder: quiet surfaces, clear prices, compact map controls. */
body { height: 100dvh; background: #f5f7f7; }
.finder-container { grid-template-columns: minmax(0, 1fr) 410px; }
.map-area { min-width: 0; }
.map-overlay-info, .map-legend, .map-locate-btn {
  border: 1px solid #e5eae7;
  box-shadow: 0 3px 14px #20352d0d;
  background: rgba(255,255,255,.97);
}
.map-overlay-info { border-radius: 10px; padding: 12px 16px; gap: 9px; font-size: 12px; }
.map-overlay-info .dot { background: #2d725b; width: 6px; height: 6px; }
.map-legend { top: 76px; border-radius: 10px; gap: 10px; padding: 12px 14px; }
.legend-item { font-size: 11px; font-weight: 500; color: #58645e; }
.legend-dot { width: 7px; height: 7px; }
.map-locate-btn { border-radius: 12px; min-width: 42px; min-height: 42px; }
.list-area { background: #f6f8f7; border-left-color: #e2e8e5; }
.list-header { padding: 24px 22px 20px; border-bottom-color: #e8ecea; }
.list-header h1 { font-size: 21px; letter-spacing: -.6px; display: flex; align-items: center; gap: 8px; }
.list-header p { margin-top: 9px; font-size: 12px; line-height: 1.5; color: #758079; }
.count-badge { margin: 0; padding: 3px 8px; border-radius: 7px; background: #eaf3ee; color: #32664e; font-size: 12px; }
.place-list { padding: 18px 20px 96px; gap: 18px; scrollbar-gutter: stable; }
.room-card, .room-card.card-immediate, .room-card.card-future, .room-card.card-partner {
  border: 1px solid #e3e9e6; border-radius: 16px; box-shadow: 0 2px 5px #23392c04;
}
.room-card:hover, .room-card.card-immediate:hover, .room-card.card-future:hover, .room-card.card-partner:hover {
  border-color: #b8cec2; transform: translateY(-2px); box-shadow: 0 7px 20px #23392c0d;
}
.room-card:focus-visible { outline: 3px solid #41775f; outline-offset: 3px; }
.card-thumb { height: 184px; background: #e9eeeb; }
.card-thumb img { display: block; }
.room-card:hover .card-thumb img { transform: scale(1.025); }
.listing-badge { top: 12px; left: 12px; font-size: 10px; font-weight: 650; padding: 5px 9px; border-radius: 6px; backdrop-filter: blur(8px); }
.direct-badge-now, .direct-badge-future { background: #fffffff0; color: #345d49; }
.partner-badge { background: #fffffff0; color: #70528b; }
.card-info { padding: 16px; }
.card-title { margin: 0 0 11px; font-size: 14px; font-weight: 600; line-height: 1.55; letter-spacing: -.3px; color: #47534c; overflow-wrap: anywhere; }
.price-row { gap: 6px 10px; margin: 0 0 12px; align-items: baseline; }
.price-tag { font-size: 12px; font-weight: 500; color: #778179; line-height: 1.4; }
.price-tag.highlight { order: -1; font-size: 21px; font-weight: 750; letter-spacing: -.7px; color: #253b30; }
.avail-badge { padding: 5px 8px; font-size: 11px; font-weight: 550; border-radius: 6px; gap: 6px; }
.avail-badge.immediate { background: #edf5ef; color: #39704c; }
.avail-badge.future { background: #f8f2e9; color: #946c36; }
.avail-badge.future .avail-dot { background: #bf9358; }
.avail-badge.full { background: #f1f3f2; color: #747f77; }
#kakaoChatBtn { width: 54px; height: 54px; right: 24px; bottom: 22px; box-shadow: 0 4px 16px #25352d18; animation: none; }
#kakaoChatBtn::before, #kakaoChatBtn::after { animation: none; display: none; }
#kakaoChatBtn svg { width: 25px; height: 25px; }
#kakaoChatBtn .kakao-text { font-size: 9px; }
@media (min-width: 1600px) {
  .finder-container { grid-template-columns: minmax(0, 1fr) 460px; }
  .card-thumb { height: 208px; }
}
@media (max-width: 900px) {
  .finder-container { grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr; }
  .list-area { height: auto; max-height: none; border: 0; background: transparent; bottom: 0; padding: 0; }
  .place-list { flex-direction: row; padding: 10px 14px calc(14px + env(safe-area-inset-bottom)); gap: 12px; scrollbar-gutter: auto; align-items: stretch; }
  .room-card, .room-card.card-immediate, .room-card.card-future, .room-card.card-partner { flex: 0 0 270px; box-shadow: 0 4px 18px #20352d16; }
  .card-thumb { height: 120px; }
  .card-info { padding: 11px 13px; }
  .card-title { font-size: 12px; margin: 0 0 6px; }
  .price-row { margin-bottom: 6px; }
  .price-tag { font-size: 11px; }
  .price-tag.highlight { font-size: 18px; }
  .avail-badge { font-size: 10px; padding: 3px 6px; }
  .map-overlay-info { top: 14px; left: 14px; transform: none; padding: 11px 13px; }
  .map-legend { top: 66px; left: 14px; gap: 8px; padding: 10px 12px; }
  .map-locate-btn { top: 14px; right: 14px; }
  #kakaoChatBtn { width: 44px; height: 44px; right: 14px; bottom: calc(300px + env(safe-area-inset-bottom)); }
  #kakaoChatBtn .kakao-text { display: none; }
}
@media (max-width: 480px) {
  .list-area { max-height: none; }
  .room-card, .room-card.card-immediate, .room-card.card-future, .room-card.card-partner { flex-basis: 260px; }
  .card-thumb { height: 116px; }
}
@media (prefers-reduced-motion: reduce) {
  .room-card, .card-thumb img, .map-locate-btn { transition: none; }
}

/* Station / neighborhood search, available above the cards on every screen. */
.list-header {display:block;padding:18px 20px 12px;background:#fff;flex-shrink:0}
.room-search {display:flex;align-items:center;gap:8px;padding:5px 6px 5px 12px;border:1px solid #dae4de;border-radius:12px;background:#f7faf8;color:#728078}
.room-search:focus-within {border-color:#588872;box-shadow:0 0 0 3px #36745412}
.room-search svg {flex-shrink:0}
.room-search input {width:100%;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:13px;color:#283f33;padding:8px 0}
.room-search input::-webkit-search-cancel-button {display:none}
.room-search button {flex-shrink:0;border:0;border-radius:8px;padding:8px 10px;background:#285e48;color:#fff;font:inherit;font-size:12px;cursor:pointer}
.room-search #clearRoomSearch {background:transparent;color:#738177;font-size:20px;padding:0 5px}
.room-search button[hidden] {display:none}
.search-result-count {margin-top:10px;color:#7a867e;font-size:11px}
.search-result-count #listCount {color:#315f46;font-weight:700;margin-left:4px}
@media(max-width:900px) {
 .list-header {display:block;padding:10px 14px 7px;border:0;background:#ffffffed}
 .search-result-count {margin-top:5px}
 .list-area {pointer-events:none}
 .list-header,.place-list {pointer-events:auto}
}

/* Mobile: search above the map, with a solid surface for the room carousel. */
@media (max-width: 900px) {
  .finder-container {grid-template-rows:auto minmax(160px,1fr) auto;height:auto;overflow-y:auto;background:#fff}
  .list-area {display:contents}
  .list-header {grid-column:1;grid-row:1;padding:10px 14px;background:#fff;border-bottom:1px solid #e5ece8;z-index:2}
  .room-search input {font-size:16px}
  .search-result-count {margin-top:6px}
  .map-area {grid-column:1;grid-row:2;min-height:160px}
  .place-list {grid-column:1;grid-row:3;min-width:0;min-height:0;flex:none;background:#fff;border-top:1px solid #e2e8e5;padding:14px 14px calc(14px + env(safe-area-inset-bottom));gap:12px;max-height:42dvh;overflow-x:auto;overflow-y:hidden}
  .room-card,.room-card.card-immediate,.room-card.card-future,.room-card.card-partner {box-shadow:none;align-self:flex-start}
  #kakaoChatBtn {bottom:calc(266px + env(safe-area-inset-bottom));width:40px;height:40px}
}

/* Compact mobile map key; desktop overlays retain their original positioning. */
.map-summary {display:contents}
.mobile-map-count {display:none}
@media (max-width:900px) {
  .search-result-count {display:none}
  .map-area {display:grid;grid-template-rows:auto minmax(0,1fr)}
  .map-summary {display:flex;align-items:center;gap:12px;min-width:0;padding:10px 14px;background:#fff;border-bottom:1px solid #e5ece8;overflow-x:auto;white-space:nowrap;scrollbar-width:none;z-index:10}
  .map-summary::-webkit-scrollbar {display:none}
  .map-overlay-info {display:none}
  .mobile-map-count {display:flex;align-items:center;gap:4px;flex-shrink:0;color:#53665c;font-size:11px}
  .mobile-map-count strong {color:#285e48;font-size:12px}
  .map-legend {position:static;display:flex;flex-direction:row;align-items:center;gap:10px;flex-shrink:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;backdrop-filter:none;transform:none}
  .legend-item {gap:4px;font-size:10px;line-height:1.4}
  .legend-dot {width:5px;height:5px;flex-shrink:0}
  #mapFrame {grid-row:2;min-height:0}
  .map-locate-btn {top:48px;right:12px}
}

/* Keep map bounds independent of changes in the room results. */
@media (max-width: 900px) {
  .finder-container { --mobile-room-list-height:clamp(238px, calc(36dvh - 12px), 288px); }
  .place-list { height:var(--mobile-room-list-height); padding-bottom:calc(2px + env(safe-area-inset-bottom)); box-sizing:border-box; max-height:none; }
  .map-area { overflow:hidden; min-height:160px; }
}

@media (max-width:900px) {
  .map-area { height:auto; grid-template-rows:auto minmax(0,1fr); }
  #mapFrame { height:100%; min-height:0; align-self:stretch; }
}

/* The mobile room carousel accepts horizontal gestures only. */
@media (max-width:900px) {
  .place-list {
    overflow-x:auto;
    overflow-y:hidden;
    touch-action:pan-x pinch-zoom;
    overscroll-behavior-x:contain;
    overscroll-behavior-y:none;
    align-items:flex-start;
  }
  .place-list .room-card { scroll-snap-align:none center; }
}