/* The English names share a track with the sliding selection indicator. */
html[lang="en"] .map_list_choice_toggle_track {
    width: 224px;
    height: 34px;
}

html[lang="en"] .map_list_choice_toggle_btn {
    gap: 5px;
    padding-inline: 5px;
    white-space: nowrap;
}

html[lang="en"] .map_list_choice_toggle_btn_icon {
    flex: none;
    margin: 0;
}

html[lang="en"] .map_list_choice_toggle_btn_span {
    top: 0;
    color: inherit;
    font: 500 12px/1.3 "Itbang Header", "Noto Sans KR", sans-serif !important;
    letter-spacing: 0;
}

html[lang="en"] .map_list_choice_toggle_btn.active {
    color: #283442;
}

/* Keep each icon with its value on both map cards and the agency's listing rows. */
html[lang="en"] :is(.list_right_tags, .estate_detail_in_list_tags) {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 4px 6px;
    margin: 0;
}

html[lang="en"] :is(.list_right_tags, .estate_detail_in_list_tags) > span {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 1 auto;
    gap: 4px;
    max-width: 100%;
    box-sizing: border-box;
    padding: 2px 5px;
    border-radius: 5px;
    background: #f4f6f8;
}

html[lang="en"] :is(.list_right_tag_icon, .estate_detail_in_tag_icon) {
    flex: 0 0 13px;
    width: 13px;
    height: 13px;
    margin: 0;
    object-fit: contain;
}

html[lang="en"] :is(.list_right_tags, .estate_detail_in_list_tags) > span > span {
    display: block;
    flex: 0 1 auto;
    min-width: 0;
    padding: 0;
    background: transparent;
    color: #465260;
    font: 500 12px/1.32 "Itbang Header", "Noto Sans KR", sans-serif !important;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}

html[lang="en"] .list_right_tags + .list_right_info_line {
    margin: 0;
}

html[lang="en"] .list_right_info {
    justify-content: flex-start;
}

html[lang="en"] .estate_detail_in_list_item {
    height: auto;
    min-height: calc(131px * var(--size));
}

html[lang="en"] .estate_detail_in_list_thumb {
    height: auto;
    align-self: stretch;
}

html[lang="en"] .estate_detail_in_list_thumb > img:first-child {
    position: absolute;
    inset: 0;
    object-fit: cover;
}

html[lang="en"] .estate_detail_in_list_info {
    gap: 6px;
}

/* English labels stay intact beside the agent's name or move to the next line. */
html[lang="en"] .detail_estate_info_footer {
    flex-wrap: wrap;
    gap: 8px 12px;
}

html[lang="en"] .detail_estate_info_footer_profile {
    flex: 1 1 7rem;
    min-width: 0;
}

html[lang="en"] .detail_estate_info_footer_icon {
    flex: none;
}

html[lang="en"] .detail_estate_info_footer_text {
    min-width: 0;
    overflow-wrap: anywhere;
}

html[lang="en"] .detail_estate_info_reviewhome_btn {
    flex: none;
    width: auto;
    min-height: 34px;
    margin-left: auto;
    padding: 6px 10px;
    gap: 6px;
    white-space: nowrap;
    line-height: 1.25;
    box-sizing: border-box;
}

html[lang="en"] .detail_estate_info_reviewhome_btn_icon {
    flex: none;
    width: 16px;
    height: 16px;
    margin: 0;
}

/* The portrait and identity share the first two rows; counts use the card's full width. */
html[lang="en"] .member_list_profile_wrap {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: 3px 8px;
    width: 100%;
    margin: 0;
}

html[lang="en"] .member_list_profile_img {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 46px;
    height: 46px;
}

html[lang="en"] .member_list_title_wrap {
    display: contents;
}

html[lang="en"] .member_list_title_line {
    grid-column: 2;
    grid-row: 1;
    flex-wrap: wrap;
    align-self: end;
    gap: 2px 5px;
    padding-right: 16px;
}

html[lang="en"] .member_list_name {
    white-space: normal;
    overflow-wrap: anywhere;
}

html[lang="en"] .member_list_position {
    font-weight: 500;
    color: #566073;
}

html[lang="en"] .member_list_estate_row {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    min-width: 0;
    margin: 0;
}

html[lang="en"] .member_list_stats_row {
    grid-column: 1 / -1;
    grid-row: 3;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 6px;
}

html[lang="en"] .member_list_stat_item {
    flex: none;
    gap: 3px;
    white-space: nowrap;
    line-height: 1.4;
    font-variant-numeric: tabular-nums;
}

html[lang="en"] .member_list_stat_item img,
html[lang="en"] .member_list_stat_value {
    position: static;
    margin: 0;
    transform: none;
}

html[lang="en"] .member_list_score_left {
    width: 58px;
}

html[lang="en"] .member_list_score_stars {
    width: max-content;
    align-self: center;
    padding: 0;
}

html[lang="en"] .member_list_score_right {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    align-items: center;
    gap: 2px 6px;
    min-width: 0;
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    line-height: 1.35;
}

html[lang="en"] .member_list_score_bar_row {
    display: contents;
}

html[lang="en"] .member_list_score_bar_row::before {
    content: attr(data-score) " ★";
    content: attr(data-score) " ★" / "";
    color: #566073;
    white-space: nowrap;
}

/* Assistive technology reads the full existing rating label. */
html[lang="en"] .member_list_score_bar_label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

html[lang="en"] .member_list_score_bar_count {
    width: auto;
    text-align: right;
    white-space: nowrap;
}

/* English map filters */
html[lang="en"] .filter_body {
    --itb-filter-font: "Itbang Header", "Noto Sans KR", sans-serif;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_subtitle {
    margin: 0 0 9px;
    color: #28384a;
    font: 700 14px/1.35 var(--itb-filter-font);
    text-indent: 0;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_media) .filter_content_options,
html[lang="en"] #filter_content_loan .filter_content_checks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 103px), 1fr));
    gap: 7px;
    padding: 0;
}

html[lang="en"] #filter_content_loan .filter_content_architecture + .filter_content_architecture .filter_content_checks,
html[lang="en"] #filter_content_media .filter_content_options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[lang="en"] .filter_body :is(.filter_content_options, .filter_content_checks) .item {
    position: relative;
    display: flex;
    align-items: stretch;
    min-width: 0;
    border: 0;
    border-radius: 8px;
}

/* Keep the native checkbox focusable while the whole tile acts as its label. */
html[lang="en"] .filter_body :is(.filter_content_options, .filter_content_checks) .item input[type="checkbox"] {
    display: block;
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
}

html[lang="en"] .filter_body :is(.filter_content_options, .filter_content_checks) .item input + label {
    flex: 1;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 8px;
    border: 1px solid #d7e0ea;
    border-radius: inherit;
    background: #fff;
    color: #24364a;
    font: 500 12px/1.35 var(--itb-filter-font) !important;
    letter-spacing: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    text-wrap: balance;
    cursor: pointer;
}

html[lang="en"] .filter_body .filter_content_options .item input + label {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 25px 1fr;
    align-items: center;
    justify-items: center;
    gap: 5px;
    min-height: 74px;
}

html[lang="en"] .filter_body .filter_content_options .item label img {
    width: 25px;
    height: 25px;
    object-fit: contain;
}

html[lang="en"] .filter_body .filter_content_checks .item input + label {
    min-height: 44px;
}

html[lang="en"] #filter_content_media .filter_content_options .item input + label {
    display: flex;
    flex-direction: row;
    gap: 7px;
    min-height: 54px;
}

html[lang="en"] .filter_body :is(.filter_content_options, .filter_content_checks) .item input:checked + label {
    background: #e9f3ff;
    border-color: #4f94dc;
    color: #174e86;
}

html[lang="en"] .filter_body .filter_content_options .item input:checked + label img {
    filter: none;
}

html[lang="en"] .filter_body :is(.filter_content_options, .filter_content_checks) .item input:focus-visible + label {
    outline: 2px solid #185b9c;
    outline-offset: 1px;
}

html[lang="en"] #filter_content_media > br,
html[lang="en"] #filter_content_media .filter_content_subtitle {
    display: none;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_architecture {
    margin-bottom: 18px;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_refresh {
    margin: 0;
    padding-top: 10px;
    border-top: 1px solid #e7ecf2;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_refresh > div {
    gap: 4px;
    min-height: 31px;
    padding: 4px 9px;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_refresh span {
    font: 500 12px/1.3 var(--itb-filter-font);
    padding: 0;
}

html[lang="en"] :is(#filter_content_option, #filter_content_facility, #filter_content_loan, #filter_content_media) .filter_content_refresh img {
    width: 16px;
    height: 16px;
    margin: 0;
    object-fit: contain;
}

/* Keep every amenity reachable without moving the map or clipping its side tabs. */
html[lang="en"] #filter_content_option {
    max-height: calc(100vh - 195px);
    overflow-y: auto;
    overscroll-behavior-y: contain;
}

/* Media has just two choices; the vertical category rail remains outside the panel. */
html[lang="en"] .filter_body.visible:has(#filter_media.active) {
    min-height: 0;
}

/* English detail sections use the scrolling tabs themselves for the active state. */
html[lang="en"] .detail_in_tabs_center_marker { display: none; }

html[lang="en"] .detail_in_tabs_wrapper {
    height: 68px;
    box-sizing: border-box;
    border-top-width: 2px;
}

html[lang="en"] .detail_in_tabs_scroll {
    height: 100%;
    box-sizing: border-box;
    padding: 4px 0;
}

html[lang="en"] .detail_in_tabs {
    flex: 0 0 100%;
    width: 100%;
    padding: 0;
    gap: 0;
}

html[lang="en"] :is(.detail_in_tabs_dummy, .detail_in_tabs_tab) {
    flex: 0 0 calc(100% / 3);
    min-width: 0;
    box-sizing: border-box;
}

html[lang="en"] .detail_in_tabs_tab {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 2px 5px;
}

html[lang="en"] .detail_in_tabs_tab img {
    flex: none;
    width: 19px;
    height: 19px;
    margin: 0;
}

html[lang="en"] .detail_in_tabs_tab span {
    font-family: "Noto Sans KR", sans-serif !important;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.25;
    white-space: normal;
    word-break: normal;
    color: #536174;
}

html[lang="en"] .detail_in_tabs_tab.selected {
    visibility: visible;
    background-color: #eff5fc;
    box-shadow: inset 0 0 0 1px #cadcef;
    border-radius: 9px;
}

html[lang="en"] .detail_in_tabs_tab.selected span {
    font-weight: 700;
    color: #23466f;
}

/* Align both cards and their paired fields as labels and values wrap. */
html[lang="en"] .detail_sale_info_title {
    margin-bottom: 14px;
    letter-spacing: normal;
}

html[lang="en"] .detail_sale_info_wrapper {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 10px 8px;
}

html[lang="en"] .detail_sale_info_column {
    min-width: 0;
    padding: 12px 9px;
    gap: 10px;
}

@supports (grid-template-rows: subgrid) {
    html[lang="en"] .detail_sale_info_column {
        display: grid !important; /* Override the existing generic .show display rule. */
        grid-template-rows: subgrid;
        /* Each column has a heading and nine property fields. */
        grid-row: 1 / span 10;
    }
}

html[lang="en"] .detail_sale_info_column_title {
    margin: 0;
    padding-bottom: 9px;
    gap: 5px;
    align-items: center;
    border-bottom: 1px solid #e5eaf0;
}

html[lang="en"] .detail_sale_info_column_title img {
    width: 18px;
    height: 18px;
    flex: none;
}

html[lang="en"] :is(.detail_sale_info_title span, .detail_sale_info_column_title span, .detail_sale_info_label, .detail_sale_info_value) {
    font-family: "Noto Sans KR", sans-serif !important;
    letter-spacing: normal;
    word-break: normal;
}

html[lang="en"] .detail_sale_info_column_title span {
    color: #34445a;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

html[lang="en"] .detail_sale_info_item { align-items: flex-start; gap: 6px; }
html[lang="en"] .detail_sale_info_icon { width: 17px; height: 20px; object-fit: contain; }
html[lang="en"] .detail_sale_info_textgroup { min-width: 0; gap: 2px; }
html[lang="en"] .detail_sale_info_textgroup.show { display: flex !important; }

html[lang="en"] .detail_sale_info_label {
    color: #5d6979;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}

html[lang="en"] .detail_sale_info_value {
    color: #28364a;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

html[lang="en"] .detail_sale_info_value .itb-detail-measure {
    display: inline-block;
    max-width: 100%;
    vertical-align: top;
    font: inherit !important;
    color: inherit;
}

@supports not (grid-template-rows: subgrid) {
    html[lang="en"] .detail_sale_info_column.show { display: flex !important; }
}

/* Give the listing switch the space between the panel edge and its two tools. */
html[lang="en"] #top_title {
    --itb-sort-choice-width: max-content;
    --itb-sort-row-limit: calc(100% - 24px);
    --itb-tools-inset: 12px;
    --itb-tools-font: "Itbang Header";
    box-sizing: border-box;
    height: 56px;
    padding: 8px 12px;
}
html[lang="en"] #top_title .map_list_choice_toggle {
    width: calc(100% - 78px);
    padding: 0;
}
html[lang="en"] #top_title .map_list_choice_toggle_track {
    width: 100%;
    height: 38px;
    padding: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    background: #f0f3f7;
}
html[lang="en"] #top_title .map_list_choice_toggle_btn {
    gap: 7px;
    padding: 0 9px;
}
html[lang="en"] #top_title .map_list_choice_toggle_btn_span {
    font-size: 13px !important;
}
html[lang="en"] #top_title .map_list_choice_toggle_btn.active .map_list_choice_toggle_btn_span {
    font-weight: 700 !important;
}

/* The sorting controls use the available row once the tab switch fades out. */
html[lang="en"] #top_title .top_title_result_icons {
    width: max-content;
    max-width: var(--itb-sort-row-limit);
    right: var(--itb-tools-inset);
    gap: 4px;
}
html[lang="en"] #top_title .top_title_filter_result_sort_wrap {
    min-width: 0;
    max-width: 100%;
    gap: 0;
}
html[lang="en"] #top_title :is(.top_title_sort_icon_wrap, .top_title_pyung_icon_wrap) {
    width: 30px;
    height: 30px;
    flex: none;
    transform: none !important;
}
html[lang="en"] #top_title .top_title_result_icons img {
    display: block;
    box-sizing: border-box;
    width: 30px;
    height: 30px;
    padding: 6px;
    border-radius: 8px;
    background: #f3f5f8;
    object-fit: contain;
}
html[lang="en"] #top_title :is(.top_title_result_sort_first, .top_title_result_sort_second) {
    flex: 0 1 auto;
    min-width: 0;
    height: auto;
    white-space: normal;
}
html[lang="en"] #top_title :is(.top_title_result_sort_text, .top_title_result_sort_text_member) {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    box-sizing: border-box;
    padding: 5px 8px;
    border: 1px solid #dce2e9;
    border-radius: 7px;
    background: #fff;
    color: #344256;
    font: 500 12px/1.35 var(--itb-tools-font), "Noto Sans KR", sans-serif !important;
    text-align: left;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
}
html[lang="en"] #top_title :is(.top_title_result_sort_text, .top_title_result_sort_text_member)::after {
    content: "";
    flex: none;
    width: 5px;
    height: 5px;
    border-right: 1.5px solid #67768b;
    border-bottom: 1.5px solid #67768b;
    transform: translateY(-1px) rotate(45deg);
}