@charset "utf-8";

/* =============================================================

 * Under Basic Board — 보조 스타일 (board.css 이후 로드)

 * 테마 .responsive 호환 · 세부 튜닝

 * ============================================================= */

/* ─── 업체 갤러리 — 참고 레이아웃(썸네일 오버레이 + 정보패널 + 하단 버튼) ─ */

/* 목록 #bo_list 전용: 툴바(bo_btn_top) 바로 아래 빈틈 제거 + 안쪽 패딩 */

.ub-board .mbb-gallery-wrap {
  margin-top: 0;
}

.ub-board #bo_list.mbb-gallery-wrap {
  box-sizing: border-box;
}

.ub-board .mbb-gallery {
  list-style: none;

  margin: 0;

  padding: 0;

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 1rem;

  /* </li> 와 <li> 사이 공백 텍스트가 그리드 아이템이 되어 칸이 어긋나는 현상 방지 */

  font-size: 0;

  line-height: 0;
}

.ub-board .mbb-gallery > li {
  font-size: 0.9375rem;

  line-height: 1.65;
}

/* massage-business-gallery 위젯: flex 컬럼·테마 ul 규칙에서도 그리드 유지(인라인 !important 제거 후 여기서 통합) */

.ub-board.mbg-widget-outer {
  min-width: 0;

  width: 100%;

  max-width: 100%;

  box-sizing: border-box;
}

.ub-board.mbg-widget-outer .mbb-gallery-wrap.mbg-widget-gallery-wrap {
  min-width: 0;

  width: 100%;

  box-sizing: border-box;
}

.ub-board.mbg-widget-outer .mbb-gallery.mbg-widget__list {
  display: grid !important;

  width: 100%;

  max-width: none;

  box-sizing: border-box;
}

.ub-board.mbg-widget-outer .mbb-gallery.mbg-widget__list > li {
  min-width: 0;

  box-sizing: border-box;
}

@media (min-width: 576px) {
  .ub-board .mbb-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1.125rem;
  }
}

@media (min-width: 768px) {
  .ub-board .mbb-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1200px) {
  .ub-board .mbb-gallery {
    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 1.35rem;
  }
}

/* 업체 카드 — 힐링·커뮤니티 톤: 다층 그림자·은은한 보더 */

.ub-board .mbb-card {
  position: relative;

  margin: 0;

  padding: 0;

  list-style: none;

  background: var(--s-card, #fdfdfc);

  border-radius: 16px;

  border: 1px solid rgb(46 46 71 / 9%);

  box-shadow: none;

  overflow: visible; /* 리본 뱃지가 카드 모서리에서 잘리지 않도록 */

  transition:
    box-shadow 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.38s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.25s ease;
}

/* overflow:visible 전환 후 이미지 라운드 보정 — inner가 담당 */

.ub-board .mbb-card__inner {
  border-radius: 16px;

  overflow: hidden;
}

.ub-board .mbb-card:hover {
  box-shadow: none;

  transform: translateY(-3px);

  border-color: rgb(46 46 71 / 12%);
}

.ub-board .mbb-card--notice {
  border-color: #c7d2fe;

  box-shadow: none;
}

.ub-board .mbb-card--current {
  border-color: #5753e4;

  box-shadow: none;
}

/* 추천(상단고정) 카드: 1px 앰버 라인 + 부드러운 외곽 발광(레퍼런스: 얇고 고급스러운 테두리) */

.ub-board .mbb-card--pinned {
  border: 1px solid var(--mbb-pin-card-line, rgb(97 93 250 / 0.55));

  box-shadow: none;

  background-image: linear-gradient(
    180deg,
    rgb(244 244 252 / 97%) 0%,

    var(--s-card, #fdfdfc) 22%,

    var(--s-card, #fdfdfc) 100%
  );
}

.ub-board .mbb-card--pinned:hover {
  border-color: rgb(97 93 250 / 62%);

  box-shadow: none;

  transform: translateY(-3px);
}

/* 미승인 업체: 썸네일 흐림은 관리자·작성자도 동일(방문자와 같은 비활성 ‘느낌’)

 * 클릭은 .mbb-card--pending-clickable 에서만 허용(심사용 상세·리뷰 등) */

.ub-board .mbb-card--pending {
  cursor: default;
}

.ub-board .mbb-card--pending:hover,
.ub-board .mbb-card--adexpired:hover {
  transform: none;

  box-shadow: none;
}

.ub-board .mbb-card--pending:not(.mbb-card--pending-clickable) .mbb-card__inner,
.ub-board
  .mbb-card--adexpired:not(.mbb-card--pending-clickable)
  .mbb-card__inner {
  pointer-events: none;

  user-select: none;
}

.ub-board .mbb-card--pending .mbb-card__thumb > img,
.ub-board .mbb-card--adexpired .mbb-card__thumb > img {
  z-index: 1;

  filter: blur(6px) brightness(0.72);

  transform: scale(1.03);
}

.ub-board .mbb-card__thumb--static {
  cursor: default;

  text-decoration: none;

  color: inherit;

  /* 링크 썸네일(a)과 동일: 비율 박스가 없으면 안내 오버레이가 보이지 않음 */

  position: relative !important;

  display: block !important;

  height: 0 !important;

  padding-bottom: var(--mbb-thumb-pct, 75%) !important;

  background: linear-gradient(165deg, #f8fafc 0%, #eef2ff 100%);

  overflow: hidden !important;

  width: 100% !important;

  flex-shrink: 0 !important;

  font-size: 0;

  line-height: 0;
}

.ub-board .mbb-card__actions--pending {
  padding: 0.5rem 0 0;

  margin-top: 0.25rem;
}

.ub-board .mbb-card__pending-msg {
  margin: 0;

  font-size: 0.8125rem;

  line-height: 1.45;

  color: #64748b;

  text-align: center;
}

/* 미승인: 수정하기 / 승인하기 단일 버튼 */

.ub-board .mbb-card__actions--pending-one {
  display: flex;

  flex-direction: column;

  align-items: stretch;

  gap: 0.5rem;

  padding-top: 0.25rem;
}

.ub-board .mbb-card__btn--pending-single {
  width: 100%;

  justify-content: center;

  text-align: center;
}

.ub-board .mbb-card__pending-hint {
  margin: 0;

  font-size: 0.75rem;

  line-height: 1.4;

  color: #94a3b8;

  text-align: center;
}

/* 상세: 미승인·비작성자·비관리자 안내 */

.ub-board .mbb-pending-view-notice {
  margin: 1rem 0 1.25rem;

  padding: 1rem 1.125rem;

  border-radius: 12px;

  border: 1px solid #e2e8f0;

  background: #f8fafc;

  color: #475569;

  font-size: 0.9375rem;

  line-height: 1.55;

  text-align: center;
}

/* 관리자 체크: 안전 뱃스와 겹치지 않게 우측 상단 */

.ub-board .mbb-card__check {
  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 5;

  background: rgb(255 255 255 / 95%);

  border-radius: 8px;

  padding: 4px 6px;

  line-height: 1;

  box-shadow: none;
}

.ub-board .mbb-card__check input {
  margin: 0;

  vertical-align: middle;
}

/* 관리자 선택 모드: 체크박스와 겹치지 않게(신규 N은 좌측 유지) */

.ub-board .mbb-card--admin .mbb-card__badge--hot,
.ub-board .mbb-card--admin .mbb-card__badge--lock,
.ub-board .mbb-card--admin .mbb-card__badge--pinned {
  right: 46px;

  left: auto;
}

.ub-board .mbb-card__inner {
  display: flex;

  flex-direction: column;

  height: 100%;

  min-height: 0;
}

/* 썸네일 링크 = 상세보기 진입 */

.ub-board a.mbb-card__thumb {
  position: relative !important;

  display: block !important;

  /* `aspect-ratio`가 테마/브라우저 조건에 따라 불안정할 때 높이가 달라지는 문제 방지 */

  /* padding-bottom 기반 비율 컨테이너에서는 height:0이 안정적입니다. */

  height: 0 !important;

  /* 화면 배너 비율은 고정(4:3 = 75%) */

  padding-bottom: var(--mbb-thumb-pct, 75%) !important;

  background: linear-gradient(165deg, #f8fafc 0%, #eef2ff 100%);

  overflow: hidden;

  color: inherit;

  text-decoration: none;

  width: 100% !important;

  flex-shrink: 0 !important;

  font-size: 0;

  line-height: 0;
}

.ub-board .mbb-card__thumb > img {
  /* 일부 테마/기본 스타일에서 `height:auto`/`position` 등이 덮어쓰는 케이스 방지 */

  position: absolute !important;

  top: 0 !important;

  right: 0 !important;

  bottom: 0 !important;

  left: 0 !important;

  width: 100% !important;

  height: 100% !important;

  object-fit: cover !important;

  display: block !important;

  transition: transform 0.35s ease;

  max-width: none !important;

  min-width: 100% !important;

  min-height: 100% !important;
}

.ub-board .mbb-card:hover .mbb-card__thumb > img {
  transform: scale(1.03);
}

.ub-board .mbb-card__placeholder {
  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 2.5rem;

  color: #94a3b8;
}

/* 좌상: 안전 — board.css 와 동일 브론즈 액센트 */

.ub-board .mbb-card__safe {
  position: absolute;

  top: 10px;

  left: 10px;

  z-index: 3;

  display: inline-flex;

  align-items: center;

  gap: 0.28rem;

  padding: 0.3rem 0.55rem;

  font-size: 0.6875rem;

  font-weight: 700;

  letter-spacing: 0.03em;

  color: #fff;

  background: #615dfa;

  border-radius: var(--mbb-chip-r, 8px);

  box-shadow: none;
}

/* 썸네일 업체분류(안전 표시 자리 대체) */

.ub-board .mbb-card__category {
  position: absolute;

  top: 10px;

  left: 10px;

  z-index: 3;

  display: inline-flex;

  align-items: center;

  gap: 0.28rem;

  padding: 0.3rem 0.55rem;

  font-size: 0.6875rem;

  font-weight: 700;

  letter-spacing: 0.03em;

  color: #fff;

  background: #615dfa;

  border-radius: var(--mbb-chip-r, 8px);

  box-shadow: none;
}

.ub-board .mbb-card__category .sk-ico {
  display: none;
}

/* 카트 아이콘 대신 퍼지는 도트 애니메이션 */

.ub-board .mbb-card__category::before {
  content: "";

  display: inline-block;

  width: 7px;

  height: 7px;

  background: rgba(255, 255, 255, 0.95);

  border-radius: 50%;

  flex-shrink: 0;

  animation: mbb-dot-ripple 1.8s ease-out infinite;
}

@keyframes mbb-dot-ripple {
  0% {
    box-shadow: none;
  }

  65% {
    box-shadow: none;
  }

  100% {
    box-shadow: none;
  }
}

.ub-board .mbb-card__safe .sk-ico {
  font-size: 0.75rem;

  opacity: 0.95;
}

/* 우상: HOT / NEW / 잠금 (안전과 분리) */

.ub-board .mbb-card__badge {
  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 2;

  padding: 0.2rem 0.45rem;

  font-size: 0.625rem;

  font-weight: 800;

  border-radius: var(--mbb-chip-r, 8px);

  line-height: 1.2;
}

.ub-board .mbb-card__badge--hot {
  background: #ef4444;

  color: #fff;

  right: 10px;
}

/* NEW: 우상 NEW 텍스트 */

.ub-board .mbb-card__badge--new {
  background: #615dfa;

  color: #fff;

  box-shadow: none;
}

.ub-board .mbb-card__badge--lock {
  background: rgb(30 41 59 / 76%);

  color: #fff;
}

/* 추천 태그: 상단에서 내려오는 행잉 태그 */

.ub-board .mbb-card__badge--pinned {
  position: absolute;

  top: 0;

  left: 10px;

  right: auto;

  z-index: 5;

  display: inline-flex;

  align-items: center;

  gap: 4px;

  background: linear-gradient(180deg, #3e3f5e 0%, #5753e4 40%, #adafca 100%);

  color: #fff;

  padding: 7px 12px 11px;

  font-weight: 800;

  font-size: 0.71rem;

  letter-spacing: 0.06em;

  line-height: 1;

  border-radius: 0 0 14px 14px;

  border-left: 2px solid rgba(199, 210, 254, 0.5);

  border-right: 2px solid rgba(199, 210, 254, 0.5);

  border-top: none;

  overflow: hidden;
}

.ub-board .mbb-card__badge--pinned .sk-ico {
  color: var(--mbb-pin-gold);

  filter: none;
}

/* 추천 우측일 때 HOT·잠금은 한 줄 아래 */

.ub-board .mbb-card__thumb:has(.mbb-card__badge--pinned) .mbb-card__badge--hot,
.ub-board
  .mbb-card__thumb:has(.mbb-card__badge--pinned)
  .mbb-card__badge--lock {
  top: 48px;
}

.ub-board .mbb-card__badge--reply {
  top: auto;

  bottom: 44px;

  left: 10px;

  right: auto;

  background: rgb(255 255 255 / 92%);

  color: #475569;

  font-weight: 700;
}

/* 하단 캡슐 오버레이 */

.ub-board .mbb-card__capsule {
  position: absolute;

  bottom: 10px;

  z-index: 2;

  display: inline-flex;

  align-items: center;

  gap: 0.3rem;

  padding: 0.28rem 0.55rem;

  font-size: 0.6875rem;

  font-weight: 600;

  color: #f8fafc;

  background: rgb(30 41 59 / 65%);

  border-radius: 999px;

  backdrop-filter: blur(8px);

  -webkit-backdrop-filter: blur(8px);
}

.ub-board .mbb-card__capsule .sk-ico {
  font-size: 0.7rem;

  opacity: 0.9;
}

.ub-board .mbb-card__capsule-flag {
  display: inline-block;

  width: 16px;

  height: 16px;

  object-fit: contain;

  vertical-align: middle;

  border-radius: 2px;

  box-shadow: none;

  margin-right: 0.2rem;

  flex-shrink: 0;
}

.ub-board .mbb-card__capsule--time {
  bottom: 10px;

  left: 10px;

  top: auto;

  right: auto;

  max-width: calc(100% - 20px);

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;
}

.ub-board .mbb-card__capsule--nation {
  color: #ffffff;
}

.ub-board .mbb-card__capsule--nation-kor {
  background: linear-gradient(
    165deg,
    #1e1b4b 0%,
    #5753e4 38%,
    #5753e4 66%,
    #adafca 100%
  );
}

.ub-board .mbb-card__capsule--nation-tha {
  background: linear-gradient(165deg, #22c55e 0%, #16a34a 42%, #0d9488 100%);
}

.ub-board .mbb-card__capsule--nation-chn {
  /* 밝은 스카이→미디엄→딥네이비: 그라데이션이 뚜렷하게 보임 */

  background: linear-gradient(165deg, #38bdf8 0%, #0369a1 42%, #0c4a6e 100%);
}

.ub-board .mbb-card__capsule--nation-rus {
  /* 밝은 라벤더→미디엄→딥퍼플: 그라데이션이 뚜렷하게 보임 */

  background: linear-gradient(165deg, #a78bfa 0%, #6d28d9 42%, #4c1d95 100%);
}

.ub-board .mbb-card__capsule--nation-jpn {
  background: linear-gradient(135deg, #be123c 0%, #9f1239 100%);
}

.ub-board .mbb-card__capsule--nation-vnm {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
}

.ub-board .mbb-card__capsule--nation-phl {
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);
}

.ub-board .mbb-card__capsule--nation-usa {
  background: linear-gradient(135deg, #1d4ed8 0%, #1e3a8a 100%);
}

.ub-board .mbb-card__capsule--hit {
  right: 10px;
}

/* 하단 흰 패널 */

.ub-board .mbb-card__panel {
  flex: 1;

  display: flex;

  flex-direction: column;

  /* 썸네일과 패널 사이 여백/하단 여백을 줄여 이미지 영역이 더 꽉 차 보이도록 */

  padding: 0.9rem;

  min-height: 0;

  background: #fff;
}

/* 비회원·타인·미승인: 하단은 그레이 톤, 문구는 흰 박스로 구분 */

.ub-board .mbb-card__panel.mbb-card__panel--visitor-pending {
  align-items: center;

  justify-content: center;

  min-height: 5.5rem;

  padding: 0.75rem 0.85rem 0.85rem;

  background: #eef2f6;

  border-top: 1px solid #e2e8f0;
}

/* 미승인 안내: 아주 연한 파란 톤 면 + 아이콘(상단 컬러 바 없음) */

.ub-board .mbb-card__pending-panel-msg {
  display: flex;

  align-items: center;

  gap: 0.65rem;

  width: 100%;

  max-width: 100%;

  margin: 0;

  box-sizing: border-box;

  padding: 0.8rem 0.95rem 0.9rem;

  border-radius: 12px;

  background: linear-gradient(180deg, #f5f8fc 0%, #eef3f9 100%);

  box-shadow: none;
}

.ub-board .mbb-card__pending-panel-msg__icon {
  flex-shrink: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 2.35rem;

  height: 2.35rem;

  margin-top: 0.05rem;

  border-radius: 10px;

  font-size: 1rem;

  color: #fff;

  background: linear-gradient(135deg, #6478b4 0%, #7c8ec9 100%);

  box-shadow: none;
}

.ub-board .mbb-card__pending-panel-msg__icon .sk-ico {
  line-height: 1;

  opacity: 0.98;
}

.ub-board .mbb-card__pending-panel-msg__text {
  flex: 1;

  min-width: 0;

  font-size: 0.8125rem;

  font-weight: 800;

  line-height: 1.5;

  color: #334155;

  letter-spacing: -0.02em;

  text-align: left;
}

/* 사이트명 줄 (연보라 박스) */

.ub-board .mbb-card__sitename {
  margin-bottom: 0.55rem;
}

.ub-board .mbb-card__sitename-row {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.5rem;

  width: 100%;

  padding: 0.45rem 0.6rem;

  background: #f8f8fc;

  border-radius: 10px;

  border: 1px solid #e0e7ff;
}

.ub-board .mbb-card__sitename-label {
  display: inline-flex;

  align-items: center;

  gap: 0.35rem;

  font-size: 0.75rem;

  font-weight: 700;

  color: #64748b;

  white-space: nowrap;
}

.ub-board .mbb-card__sitename-label .sk-ico {
  color: #475569;

  font-size: 0.8rem;
}

.ub-board .mbb-card__sitename-value {
  font-size: 0.875rem;

  font-weight: 800;

  color: #5753e4;

  text-align: right;

  line-height: 1.25;

  word-break: break-word;
}

.ub-board .mbb-card__regionline {
  margin: 0.2rem 0 0.35rem;

  font-size: 0.75rem;

  font-weight: 600;

  color: #5753e4;

  line-height: 1.35;
}

.ub-board .mbb-card__regionline .sk-ico {
  margin-left: 0.17rem;

  margin-right: 0.2rem;

  opacity: 0.85;
}

.ub-board .mbb-card__catline {
  margin: 0 0 0.35rem;
}

.ub-board .mbb-card__catpill {
  display: inline-block;

  padding: 0.12rem 0.45rem;

  font-size: 0.6875rem;

  font-weight: 700;

  border-radius: 999px;

  background: #f1f5f9;

  color: #475569;

  border: 1px solid #e2e8f0;
}

/* 총평점 */

.ub-board .mbb-card__rating {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.5rem;

  margin-bottom: 0.5rem;
}

.ub-board .mbb-card__rating-label {
  display: inline-flex;

  align-items: center;

  gap: 0.3rem;

  font-size: 0.75rem;

  font-weight: 700;

  color: #475569;

  white-space: nowrap;
}

.ub-board .mbb-card__rating-label .sk-ico {
  color: #eab308;
}

.ub-board .mbb-card__rating-right {
  display: inline-flex;

  align-items: center;

  gap: 0.4rem;
}

.ub-board .mbb-card__stars {
  display: inline-flex;

  gap: 2px;

  font-size: 0.8rem;

  line-height: 1;
}

.ub-board .mbb-card__stars .mbb-star--on {
  color: #facc15;
}

.ub-board .mbb-card__stars .mbb-star--off {
  color: #e5e7eb;
}

.ub-board .mbb-card__score {
  font-size: 0.8125rem;

  font-weight: 800;

  font-variant-numeric: tabular-nums;

  color: #0f172a;

  min-width: 1.75rem;

  text-align: right;
}

.ub-board .mbb-card__price {
  margin-top: 0.45rem;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.5rem;
}

.ub-board .mbb-card__price-label {
  font-size: 0.6875rem;

  font-weight: 900;

  color: #f43f5e;

  letter-spacing: -0.02em;
}

.ub-board .mbb-card__price-value {
  font-size: 1.05rem;

  font-weight: 1000;

  color: #0f172a;

  letter-spacing: -0.02em;
}

.ub-board .mbb-card__rule {
  height: 1px;

  margin: 0.15rem 0 0.75rem;

  background: #e5e7eb;

  border: 0;
}

/* 통계 pill */

.ub-board .mbb-card__pills {
  display: flex;

  flex-wrap: wrap;

  gap: 0.35rem 0.4rem;

  margin-bottom: 0.65rem;
}

.ub-board .mbb-card__pill {
  display: inline-flex;

  align-items: center;

  gap: 0.25rem;

  padding: 0.2rem 0.45rem;

  font-size: 0.6875rem;

  font-weight: 600;

  color: #64748b;

  background: #f1f5f9;

  border-radius: 999px;

  border: 1px solid #e2e8f0;
}

.ub-board .mbb-card__pill .sk-ico {
  font-size: 0.72rem;

  opacity: 0.85;
}

.ub-board .mbb-card__pill--comment {
  color: #0f766e;

  background: #ccfbf1;

  border-color: #99f6e4;
}

.ub-board .mbb-card__pill--comment .sk-ico {
  color: #0f766e;
  opacity: 0.95;
}

.ub-board .mbb-card__pill--good {
  color: #166534;

  background: #dcfce7;

  border-color: #86efac;
}

.ub-board .mbb-card__pill--good .sk-ico {
  color: #166534;
  opacity: 0.95;
}

.ub-board .mbb-card__pill--nogood {
  color: #991b1b;

  background: #fee2e2;

  border-color: #fca5a5;
}

.ub-board .mbb-card__pill--nogood .sk-ico {
  color: #991b1b;
  opacity: 0.95;
}

.ub-board .mbb-card__pill--hit {
  color: #92400e;

  background: #ffedd5;

  border-color: #adafca;
}

.ub-board .mbb-card__pill--hit .sk-ico {
  color: #92400e;
  opacity: 0.95;
}

/* 카드: 옵션(이미지) 배지 */

.ub-board .mbb-card__pill--opt {
  color: #0f766e;

  background: #ecfeff;

  border-color: #67e8f9;

  font-weight: 900;
}

/* 카드: 관리사 국적 배지 */

.ub-board .mbb-card__pill--nation {
  color: #312e81;

  background: #fafafe;

  border-color: #c4b5fd;

  font-weight: 900;
}

/* 카드: 옵션/국적 캡슐 영역 */

.ub-board .mbb-card__optpills {
  margin-top: 0.25rem;

  margin-bottom: 0.55rem;
}

/* 글쓰기: 이미지 옵션(1인실~여성전용) 버튼 */

.ub-board .ub-mbb-image-options {
  display: flex;

  flex-wrap: wrap;

  gap: 0.5rem;
}

.ub-board .ub-mbb-image-opt {
  margin: 0;
}

.ub-board .ub-mbb-image-opt input {
  display: none;
}

.ub-board .ub-mbb-image-opt span {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 0.55rem 0.75rem;

  border-radius: 999px;

  background: #eeecff;

  color: #312e81;

  border: 1px solid #e0d8cc;

  font-size: 0.8125rem;

  font-weight: 900;

  line-height: 1;

  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;

  user-select: none;
}

.ub-board .ub-mbb-image-opt input:checked + span {
  background: linear-gradient(135deg, #475569 0%, #5753e4 100%);

  color: #ffffff;

  border-color: #5753e4;
}

/* 하단 액션(상세·리뷰·점프 등) */

.ub-board .mbb-card__actions {
  display: flex;

  flex-wrap: wrap;

  gap: 0.45rem;

  margin-top: auto;
}

.ub-board .mbb-card__jump-form {
  flex: 1 1 calc(33.333% - 0.3rem);

  display: flex;

  margin: 0;

  min-width: 5.5rem;
}

.ub-board .mbb-card__jump-form .mbb-card__btn {
  width: 100%;
}

.ub-board .mbb-card__btn {
  flex: 1;

  display: flex;

  align-items: stretch;

  min-height: 36px;

  border-radius: 10px;

  font-size: 0.8125rem;

  font-weight: 600;

  letter-spacing: 0.02em;

  text-decoration: none;

  overflow: hidden;

  border: 1px solid transparent;

  transition:
    filter 0.2s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.15s ease,
    box-shadow 0.2s ease;
}

.ub-board .mbb-card__btn:active {
  transform: scale(0.98);
}

.ub-board .mbb-card__btn-txt {
  flex: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 0 0.4rem;

  white-space: nowrap;
}

.ub-board .mbb-card__btn-ico {
  display: flex;

  align-items: center;

  justify-content: center;

  padding: 0 0.55rem;

  border-left: 1px solid rgb(255 255 255 / 22%);

  flex-shrink: 0;
}

.ub-board .mbb-card__btn--ghost {
  background: #f1f5f9;

  border-color: #e2e8f0;

  color: #334155;
}

.ub-board .mbb-card__btn--ghost .mbb-card__btn-ico {
  border-left-color: #cbd5e1;

  background: #e8ecf1;
}

.ub-board .mbb-card__btn--primary {
  background: #615dfa;

  border-color: transparent;

  color: #fff;

  box-shadow: none;
}

.ub-board .mbb-card__btn--primary:hover {
  filter: brightness(1.06);

  box-shadow: none;
}

/* 아이콘 칸에 별도 배경을 두면 그라데이션과 겹쳐 세로 띠처럼 보임 → 구분은 border만 */

.ub-board .mbb-card__btn--primary .mbb-card__btn-ico {
  border-left-color: rgb(255 255 255 / 28%);

  background: transparent;
}

/* 모바일: 카드 하단 버튼의 화살표 칸만 숨김(지역 필터 「전체 지역」 아이콘은 유지) */

@media (max-width: 575.98px) {
  .ub-board .mbb-card__actions .mbb-card__btn-ico {
    display: none !important;
  }

  .ub-board .mbb-card__actions .mbb-card__btn-txt {
    padding-left: 0.55rem;

    padding-right: 0.55rem;
  }
}

.ub-board .mbb-gallery-empty {
  margin-top: 2rem;
}

/* ─── 목록 / 제목 줄 세부 ─────────────────────────── */

/* ─── 지역 필터: 메인 위젯(mbg-rf)과 동일 박스 UI (목록·위젯 공통) ─── */

.ub-board .mbg-widget-region-filter-wrap.mbg-rf {
  margin: 0 0 1.25rem;

  padding: 0;

  background: transparent;

  border: none;

  box-shadow: none;

  position: relative;

  box-sizing: border-box;
}

.ub-board .mbg-widget-region-filter-wrap.mbg-rf::before {
  content: "";

  position: absolute;

  inset: 0;

  border-radius: 14px;

  background: #ffffff;

  border: 1px solid #e2e8f0;

  box-shadow: none;

  pointer-events: none;

  z-index: 0;
}

.ub-board .mbg-widget-region-filter-wrap.mbg-rf .mbg-rf__form {
  position: relative;

  z-index: 1;

  padding: 1rem 1.1rem 1.05rem;

  border-radius: 14px;

  box-sizing: border-box;
}

.ub-board .mbg-rf__head {
  display: flex;

  align-items: flex-start;

  gap: 0.75rem;

  margin-bottom: 0.9rem;

  padding-bottom: 0.8rem;

  border-bottom: 1px solid #e2e8f0;
}

.ub-board .mbg-rf__head-kicker {
  flex-shrink: 0;

  width: 2.5rem;

  height: 2.5rem;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  background: #f1f5f9;

  color: #64748b;

  font-size: 1.05rem;

  border: 1px solid #e2e8f0;
}

.ub-board .mbg-rf__head-copy {
  display: flex;

  flex-direction: column;

  gap: 0.2rem;

  min-width: 0;

  padding-top: 0.15rem;
}

.ub-board .mbg-rf__head-title {
  font-size: 1rem;

  font-weight: 800;

  letter-spacing: -0.025em;

  line-height: 1.3;

  color: #0f172a;
}

.ub-board .mbg-rf__head-desc {
  font-size: 0.8125rem;

  line-height: 1.45;

  color: #64748b;

  font-weight: 500;
}

/* ub-form-row 기본 음수 마진·자식 패딩 해제 */

.ub-board .mbg-rf__row.ub-mbb-region-filter__inner.ub-form-row {
  margin: 0;

  margin-left: 0;

  margin-right: 0;

  gap: 0.65rem 0.75rem;

  align-items: stretch;
}

.ub-board .mbg-rf__row.ub-mbb-region-filter__inner.ub-form-row > * {
  padding: 0;

  padding-left: 0;

  padding-right: 0;
}

.ub-board .mbg-rf__row.ub-mbb-region-filter__inner {
  display: flex;

  flex-wrap: wrap;

  align-items: stretch;
}

.ub-board .mbg-rf__field {
  min-width: 0;

  flex: 1 1 140px;

  display: flex;

  align-items: stretch;
}

.ub-board .mbg-rf__field--wide {
  flex: 1.35 1 200px;
}

.ub-board .mbg-rf__select.ub-select,
.ub-board select.mbg-rf__select {
  width: 100%;

  min-height: 2.75rem;

  padding: 0.55rem 2.35rem 0.55rem 0.95rem;

  font-size: 0.9375rem;

  font-weight: 600;

  color: #0f172a;

  background-color: #f8fafc;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");

  background-repeat: no-repeat;

  background-position: right 0.75rem center;

  background-size: 1rem;

  border: 1px solid #e2e8f0;

  border-radius: 10px;

  box-shadow: none;

  box-sizing: border-box;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

  transition:
    border-color 0.15s ease,
    background-color 0.15s ease;
}

.ub-board .mbg-rf__select.ub-select:hover,
.ub-board select.mbg-rf__select:hover {
  border-color: #cbd5e1;

  background-color: #fff;
}

.ub-board .mbg-rf__select.ub-select:focus,
.ub-board select.mbg-rf__select:focus {
  outline: none;

  border-color: #94a3b8;

  background-color: #fff;

  box-shadow: none;
}

.ub-board .mbg-rf__actions.ub-mbb-region-filter__actions {
  flex: 0 0 auto;

  display: flex;

  align-items: stretch;
}

/* 전체 지역: 카드 버튼 스타일 재사용 — 셀렉트와 높이·반경 맞춤 */

.ub-board a.mbb-card__btn.mbg-rf__reset {
  flex: 0 0 auto;

  min-width: 0;

  min-height: 2.75rem;

  border-radius: 10px;

  font-size: 0.9375rem;

  font-weight: 800;

  letter-spacing: -0.02em;

  box-shadow: none;

  box-sizing: border-box;
}

.ub-board a.mbb-card__btn.mbg-rf__reset:hover {
  filter: brightness(1.04);

  box-shadow: none;
}

.ub-board a.mbb-card__btn.mbg-rf__reset .mbb-card__btn-txt {
  padding: 0 0.55rem 0 0.85rem;
}

.ub-board a.mbb-card__btn.mbg-rf__reset .mbb-card__btn-ico {
  min-width: 2.65rem;

  padding: 0 0.6rem;

  font-size: 0.95rem;
}

@media (max-width: 575px) {
  .ub-board .mbg-rf__actions.ub-mbb-region-filter__actions {
    flex: 1 1 100%;
  }

  .ub-board a.mbb-card__btn.mbg-rf__reset {
    width: 100%;
  }
}

/* ─── 뷰 상단: 좌측 배너 / 우측 상세 ───────────────── */

.ub-board .uv-mbb-hero {
  display: grid;

  /* 좌열: 썸네일+리뷰+문의 / 우열: 표+시설 — 참고 비율 약 60:40 */

  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);

  gap: 1rem clamp(0.45rem, 1vw, 0.75rem);

  margin-top: 1rem;

  box-sizing: border-box;

  align-items: stretch;

  /* 이미지·상세 모두 동일 인셋(이미지 좌측 벽 붙음 방지). hero__side 패딩과 중복하지 않음 */

  padding-left: max(
    clamp(0.7rem, 2.6vw, 1.35rem),
    env(safe-area-inset-left, 0px)
  );

  padding-right: max(
    clamp(0.7rem, 2.6vw, 1.35rem),
    env(safe-area-inset-right, 0px)
  );
}

/* 좌열: 썸네일 전폭 + 아래 리뷰·문의 세로 스택 */

.ub-board .uv-mbb-hero__left {
  display: flex;

  flex-direction: column;

  gap: 0.65rem;

  min-width: 0;

  min-height: 0;

  align-self: stretch;
}

/* 히어로 이미지 래퍼: 우측 열보다 키가 클 때 남는 세로를 썸네일이 채움 */

.ub-board .uv-mbb-hero__media-wrap {
  --uv-mbb-hero-radius: 12px;

  min-width: 0;

  min-height: 0;

  display: flex;

  flex-direction: column;

  flex: 1 1 auto;

  align-self: stretch;
}

.ub-board .uv-mbb-hero__media {
  position: relative;

  width: 100%;

  max-width: 100%;

  border-radius: var(--uv-mbb-hero-radius, 14px);

  overflow: hidden;

  background: linear-gradient(145deg, #f3ebe1 0%, #d9cfc4 100%);

  /* 리스트 카드 썸네일(.mbb-card__thumb, --mbb-thumb-pct 75%)과 동일 4:3 */

  aspect-ratio: 4 / 3;

  min-height: 0;
}

/* 데스크톱 2열: 썸네일 높이 + 좌·우 열이 그리드 행 전체 높이를 채워 하단 맞춤 */

@media (min-width: 992px) {
  .ub-board .uv-mbb-hero__media-wrap .uv-mbb-hero__media {
    flex: 1 1 auto;

    aspect-ratio: auto;

    min-height: clamp(200px, 22vw, 340px);
  }

  .ub-board .uv-mbb-hero__left,
  .ub-board .uv-mbb-hero__side {
    height: 100%;

    align-self: stretch;
  }

  .ub-board .uv-mbb-hero__side .uv-mbb-hero-info-card {
    flex: 1 1 auto;

    min-height: 100%;
  }
}

.ub-board .uv-mbb-hero__media img {
  position: absolute !important;

  inset: 0 !important;

  width: 100% !important;

  height: 100% !important;

  object-fit: cover !important;

  display: block !important;

  max-width: none !important;

  min-width: 100% !important;

  min-height: 100% !important;
}

.ub-board .uv-mbb-hero__placeholder {
  position: absolute;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 3rem;

  color: #94a3b8;
}

/* 넓은 뷰포트: 이미지 열 최대 폭 확대(참고 레이아웃에 가깝게) */

@media (min-width: 1100px) {
  .ub-board .uv-mbb-hero {
    grid-template-columns: minmax(320px, min(52vw, 640px)) minmax(0, 1fr);
  }
}

/* 상세 열: 그리드 행 높이까지 늘려 좌열(이미지+리뷰+문의)과 상·하단 정렬 */

.ub-board .uv-mbb-hero__side {
  min-width: 0;

  display: flex;

  flex-direction: column;

  gap: 0.5rem;

  min-height: 0;

  align-self: stretch;
}

/* 히어로 안에서만: 옵션 뱃지 줄바꿈 + 가로·세로 중앙(카드가 늘어난 경우 여백 안에 배치) */

.ub-board .uv-mbb-hero__side .uv-mbb-options-row {
  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  align-content: center;

  gap: 0.5rem 0.65rem;

  margin-top: 0;

  margin-bottom: 0;
}

/* 좌열 리뷰·문의: flex gap으로 간격(상단 큰 margin 제거) */

.ub-board .uv-mbb-hero__left .uv-mbb-review-bar {
  margin-top: 0;
}

.ub-board .uv-mbb-hero__left .uv-mbb-hero__cta {
  margin-top: 0;
}

@media (max-width: 991px) {
  .ub-board .uv-mbb-hero {
    grid-template-columns: 1fr;

    align-items: start;

    padding-left: max(
      clamp(0.8rem, 4.2vw, 1.4rem),
      env(safe-area-inset-left, 0px)
    );

    padding-right: max(
      clamp(0.8rem, 4.2vw, 1.4rem),
      env(safe-area-inset-right, 0px)
    );
  }

  /* 모바일: 그리드 stretch로 좌열이 세로로 잡아당겨지지 않게 */

  .ub-board .uv-mbb-hero__left {
    align-self: start;

    height: auto;

    min-height: 0;
  }

  /* 모바일: 이미지 영역은 늘어나지 않음 — 4:3(목록 썸네일과 동일, 1:1보다 세로 짧음) */

  .ub-board .uv-mbb-hero__media-wrap {
    flex: 0 0 auto;

    align-items: flex-start;

    align-self: start;

    width: 100%;

    max-height: none;
  }

  /* 목록 .mbb-card__thumb 과 동일: padding 비율 박스 — aspect-ratio 미지원·버그 환경에서도 세로 고정 */

  .ub-board .uv-mbb-hero__media {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    max-width: 100% !important;

    flex: none;

    height: 0 !important;

    padding-bottom: 75% !important; /* 4:3 */

    aspect-ratio: unset;

    min-height: 0 !important;

    max-height: none !important;

    overflow: hidden !important;

    box-sizing: border-box !important;
  }

  .ub-board .uv-mbb-hero__media img {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    object-position: center !important;

    min-width: 0 !important;

    min-height: 0 !important;

    max-width: none !important;

    max-height: none !important;
  }

  .ub-board .uv-mbb-hero__side {
    padding-top: 0.15rem;

    gap: 0.65rem;
  }

  .ub-board .uv-mbb-hero__side .uv-mbb-options-row {
    margin-bottom: 0;
  }

  /* 1열 순서: 이미지 → 리뷰 → 문의 → 상세카드 — 좌열 블록 사이 간격 */

  .ub-board .uv-mbb-hero__left {
    gap: 0.7rem;
  }
}

@media (max-width: 480px) {
  .ub-board .uv-mbb-hero {
    padding-left: max(0.85rem, env(safe-area-inset-left, 0px));

    padding-right: max(0.85rem, env(safe-area-inset-right, 0px));
  }
}

/* ─── 히어로 ↔ 본문 구분: 업체명 + 코스안내 ───────────── */

.ub-board .uv-mbb-course-head {
  display: flex;

  align-items: stretch;

  margin-top: clamp(1rem, 2.8vw, 1.5rem);

  margin-bottom: 0.65rem;

  margin-left: max(
    clamp(0.7rem, 2.6vw, 1.35rem),
    env(safe-area-inset-left, 0px)
  );

  margin-right: max(
    clamp(0.7rem, 2.6vw, 1.35rem),
    env(safe-area-inset-right, 0px)
  );

  border-radius: 16px;

  overflow: hidden;

  border: 1px solid rgb(46 46 71 / 8%);

  box-shadow: none;

  background: linear-gradient(165deg, #ffffff 0%, #f5f7ff 48%, #eef2ff 100%);
}

.ub-board .uv-mbb-course-head__rail {
  width: 5px;

  flex-shrink: 0;

  background: linear-gradient(180deg, #adafca 0%, #5753e4 45%, #3e3f5e 100%);
}

.ub-board .uv-mbb-course-head__main {
  display: flex;

  align-items: center;

  gap: 0.85rem;

  flex: 1;

  min-width: 0;

  padding: 0.8rem 0.75rem 0.8rem 0.95rem;
}

/* 코스안내 줄 오른쪽: 매니저 출근현황 */

.ub-board .uv-mbb-course-head__actions {
  display: flex;

  align-items: center;

  flex-shrink: 0;

  padding: 0.55rem 1rem 0.55rem 0.35rem;
}

.ub-board .uv-mbb-course-head__badge {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 0.38rem;

  margin: 0;

  padding: 0.42rem 0.85rem;

  border: 1px solid #d5ded9;

  border-radius: 999px;

  background: linear-gradient(180deg, #f5f8f6 0%, #e8eeea 100%);

  box-shadow: none;

  color: #3d4541;

  font-size: 0.78rem;

  font-weight: 700;

  letter-spacing: 0.01em;

  line-height: 1.2;

  cursor: pointer;

  transition:
    background var(--dur-fast, 140ms) var(--ease, ease),
    border-color var(--dur-fast, 140ms) var(--ease, ease),
    transform var(--dur-fast, 140ms) var(--ease, ease);

  white-space: nowrap;

  max-width: 100%;
}

.ub-board .uv-mbb-course-head__badge:hover {
  background: linear-gradient(180deg, #e5ebe7 0%, #d5ded9 55%, #b8c4be 100%);

  border-color: #9daaa4;

  color: #2a302d;
}

.ub-board .uv-mbb-course-head__badge:active {
  transform: scale(0.98);
}

.ub-board .uv-mbb-course-head__badge .sk-ico {
  font-size: 0.95em;

  opacity: 0.92;
}

.ub-board .uv-mbb-course-head__icon {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 2.5rem;

  height: 2.5rem;

  border-radius: 12px;

  background: linear-gradient(145deg, #f8f8fc 0%, #dedeea 100%);

  color: #5753e4;

  font-size: 1.1rem;

  flex-shrink: 0;

  box-shadow: none;
}

.ub-board .uv-mbb-course-head__title {
  margin: 0;

  font-size: clamp(1rem, 2.9vw, 1.22rem);

  font-weight: 800;

  letter-spacing: -0.035em;

  line-height: 1.35;

  color: #0f172a;
}

.ub-board .uv-mbb-course-head__name {
  color: #5753e4;
}

.ub-board .uv-mbb-course-head__name::after {
  content: " · ";

  color: #94a3b8;

  font-weight: 700;
}

.ub-board .uv-mbb-course-head__suffix {
  font-weight: 700;

  color: #334155;
}

@media (max-width: 991px) {
  .ub-board .uv-mbb-course-head {
    margin-left: max(
      clamp(0.8rem, 4.2vw, 1.4rem),
      env(safe-area-inset-left, 0px)
    );

    margin-right: max(
      clamp(0.8rem, 4.2vw, 1.4rem),
      env(safe-area-inset-right, 0px)
    );
  }
}

@media (max-width: 480px) {
  .ub-board .uv-mbb-course-head {
    margin-left: max(0.85rem, env(safe-area-inset-left, 0px));

    margin-right: max(0.85rem, env(safe-area-inset-right, 0px));

    flex-wrap: wrap;
  }

  .ub-board .uv-mbb-course-head__main {
    padding: 0.7rem 0.85rem;

    gap: 0.65rem;
  }

  .ub-board .uv-mbb-course-head__icon {
    width: 2.25rem;

    height: 2.25rem;

    font-size: 1rem;
  }

  .ub-board .uv-mbb-course-head__actions {
    width: 100%;

    justify-content: flex-end;

    padding: 0 0.85rem 0.65rem;

    box-sizing: border-box;
  }
}

/* 매니저 모달: 목록은 좁게, iframe(읽기·쓰기)은 넓게 */

.ub-board.uv-mbb-review-modal.uv-mbb-manager-modal
  .ub-modal__dialog.uv-mbb-review-modal__dialog {
  max-width: min(520px, 96vw);
}

.ub-board.uv-mbb-review-modal.uv-mbb-manager-modal.uv-mbb-manager-modal--embed
  .ub-modal__dialog.uv-mbb-review-modal__dialog {
  max-width: min(920px, 98vw);
}

/* 매니저 모달 목록 — Massage-Manager-Board mmg-mag 정렬 (#mbb-manager-modal-list-scroll 전용) */

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list {
  --mmg-modal-ink: #0f172a;

  --mmg-modal-muted: #64748b;

  --mmg-modal-line: #e2e8f0;

  --mmg-modal-accent: #5753e4;

  --mmg-modal-mag-bg: #fafbfc;

  display: grid;

  grid-template-columns: 1fr;

  gap: 0.65rem;

  min-width: 0;

  box-sizing: border-box;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__cell {
  position: relative;

  min-width: 0;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__cell--hero {
  grid-column: 1 / -1;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__cell--with-chk {
  display: grid;

  grid-template-columns: auto minmax(0, 1fr);

  gap: 0.45rem;

  align-items: center;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__cell--with-chk
  .mmg-mag__card {
  min-width: 0;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__pick {
  position: absolute;

  top: 10px;

  left: 10px;

  z-index: 4;

  margin: 0;

  cursor: pointer;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__cell--with-chk
  .mmg-mag__pick {
  position: static;

  align-self: center;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__pick input {
  position: absolute;

  opacity: 0;

  width: 0;

  height: 0;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__pick-ui {
  display: flex;

  align-items: center;

  justify-content: center;

  width: 26px;

  height: 26px;

  border-radius: 8px;

  background: rgb(255 255 255 / 92%);

  border: 1px solid var(--mmg-modal-line);

  box-shadow: none;

  transition:
    border-color 0.15s ease,
    background 0.15s ease;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__pick
  input:focus
  + .mmg-mag__pick-ui {
  outline: 2px solid var(--mmg-modal-accent);

  outline-offset: 1px;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__pick
  input:checked
  + .mmg-mag__pick-ui {
  background: var(--mmg-modal-accent);

  border-color: var(--mmg-modal-accent);

  color: #fff;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__pick
  input:checked
  + .mmg-mag__pick-ui::after {
  content: "✓";

  font-size: 0.75rem;

  font-weight: 900;

  line-height: 1;
}

/* div 카드 — 테마 button 규칙 회피, 키보드 포커스 */

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card.mmg-modal-list__hit {
  cursor: pointer;

  -webkit-tap-highlight-color: transparent;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card.mmg-modal-list__hit:focus {
  outline: none;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card.mmg-modal-list__hit:focus-visible {
  outline: 2px solid var(--mmg-modal-accent);

  outline-offset: 2px;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__card {
  display: flex;

  flex-direction: column;

  background: #fff;

  border: 1px solid var(--mmg-modal-line);

  border-radius: 14px;

  overflow: hidden;

  text-decoration: none;

  color: inherit;

  box-shadow: none;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;

  padding: 10px 12px;

  box-sizing: border-box;

  gap: 0.5rem;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__card:hover {
  transform: translateY(-2px);

  box-shadow: none;
}

/* #mbb-manager-modal 까지 붙여 테마·전역 img/flex 규칙보다 우선 */

#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card--hero {
  flex-direction: row !important;

  flex-wrap: nowrap !important;

  align-items: center !important;

  min-height: 0;

  min-width: 0;

  width: 100%;

  max-width: 100%;

  box-sizing: border-box;

  gap: 0.65rem;
}

@media (max-width: 640px) {
  #mbb-manager-modal
    #mbb-manager-modal-list-scroll
    .mmg-mag.mmg-modal-list
    .mmg-mag__card--hero {
    gap: 0.5rem;

    padding: 8px 10px;
  }
}

#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__content {
  display: flex !important;

  flex-direction: row !important;

  align-items: center !important;

  flex: 1 1 auto !important;

  min-width: 0 !important;

  max-width: 100% !important;

  gap: 0.5rem;

  box-sizing: border-box;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__visual {
  position: relative;

  background: var(--mmg-modal-mag-bg);

  flex-shrink: 0;

  overflow: hidden;

  border-radius: 10px;
}

/* 정사각 슬롯 + 비율 유지용 flex(이미지는 contain·가운데) — aspect-ratio 로 높이 붕괴 방지 */

#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card--hero
  .mmg-mag__visual.mmg-modal-list__visual,
#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card--hero
  .mmg-modal-list__visual {
  width: 3rem !important;

  min-width: 3rem !important;

  max-width: 3rem !important;

  height: 3rem !important;

  min-height: 3rem !important;

  max-height: 3rem !important;

  aspect-ratio: 1 / 1 !important;

  flex: 0 0 3rem !important;

  flex-shrink: 0 !important;

  align-self: center !important;

  overflow: hidden !important;

  box-sizing: border-box !important;

  border-radius: 8px !important;

  background-color: #f1f5f9 !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  contain: layout style !important;
}

@media (max-width: 640px) {
  #mbb-manager-modal
    #mbb-manager-modal-list-scroll
    .mmg-mag.mmg-modal-list
    .mmg-mag__card--hero
    .mmg-mag__visual.mmg-modal-list__visual,
  #mbb-manager-modal
    #mbb-manager-modal-list-scroll
    .mmg-mag.mmg-modal-list
    .mmg-mag__card--hero
    .mmg-modal-list__visual {
    width: 2.75rem !important;

    min-width: 2.75rem !important;

    max-width: 2.75rem !important;

    height: 2.75rem !important;

    min-height: 2.75rem !important;

    max-height: 2.75rem !important;

    flex: 0 0 2.75rem !important;
  }
}

/* Massage-Manager-Board .mmg-mag__visual img { width:100%; height:100% } 무력화 — 원본 비율 유지(contain) */

#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-modal-list__visual
  img.mmg-modal-list__thumb,
#mbb-manager-modal
  #mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  img.mmg-modal-list__thumb {
  display: block !important;

  width: auto !important;

  height: auto !important;

  max-width: 100% !important;

  max-height: 100% !important;

  min-width: 0 !important;

  min-height: 0 !important;

  object-fit: contain !important;

  object-position: center !important;

  margin: 0 !important;

  padding: 0 !important;

  border: 0 !important;

  border-radius: 6px !important;

  vertical-align: middle !important;

  flex-shrink: 1 !important;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__placeholder {
  display: flex;

  align-items: center;

  justify-content: center;

  height: 100%;

  min-height: 0;

  color: #cbd5e1;

  font-size: 1rem;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__body {
  padding: 0.15rem 0;

  display: flex;

  flex-direction: column;

  gap: 0.2rem;

  flex: 1;

  min-width: 0;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card--hero
  .mmg-mag__body {
  justify-content: center;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__rail {
  display: flex;

  flex-direction: column;

  align-items: flex-end;

  justify-content: center;

  gap: 0.35rem;

  flex-shrink: 0;

  max-width: 42%;

  text-align: right;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__rail
  .mmg-mag__rail-nation,
#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__rail
  .mmg-mag__status {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  position: static;

  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 0.04em;

  padding: 0.28rem 0.55rem;

  border-radius: 999px;

  line-height: 1.2;

  white-space: nowrap;

  box-shadow: none;

  max-width: 100%;

  overflow: hidden;

  text-overflow: ellipsis;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__rail-nation {
  color: #0f766e;

  background: linear-gradient(135deg, #ecfdf5 0%, #ccfbf1 100%);

  border: 1px solid #5eead4;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__kicker {
  font-size: 0.65rem;

  font-weight: 800;

  letter-spacing: 0.08em;

  text-transform: uppercase;

  color: var(--mmg-modal-accent);
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__title {
  margin: 0;

  font-size: 0.95rem;

  font-weight: 800;

  line-height: 1.3;

  color: var(--mmg-modal-ink);

  letter-spacing: -0.02em;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__card--hero
  .mmg-mag__title {
  font-size: clamp(1rem, 2.2vw, 1.2rem);

  line-height: 1.28;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__meta {
  margin: 0;

  font-size: 0.8rem;

  color: var(--mmg-modal-muted);

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.15rem 0.35rem;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__meta-hit {
  margin-left: 0.4rem;

  font-size: 0.75rem;

  color: var(--mmg-modal-muted);

  white-space: nowrap;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__meta-hit .sk-ico {
  margin-right: 0.2rem;

  opacity: 0.85;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__chips {
  display: flex;

  flex-wrap: wrap;

  gap: 0.35rem 0.45rem;

  margin: 0.15rem 0 0.25rem;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__chip {
  display: inline-flex;

  align-items: center;

  font-size: 0.7rem;

  font-weight: 700;

  color: #5753e4;

  background: #f8f8fc;

  border: 1px solid #c7d2fe;

  border-radius: 999px;

  padding: 0.12rem 0.5rem;

  line-height: 1.2;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__chip--smoke-no {
  color: #166534;

  background: #dcfce7;

  border-color: #86efac;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__chip--smoke-yes {
  color: #9a3412;

  background: #ffedd5;

  border-color: #adafca;
}

#mbb-manager-modal-list-scroll
  .mmg-mag.mmg-modal-list
  .mmg-mag__chip--smoke-ec {
  color: #5b21b6;

  background: #eeecff;

  border-color: #c4b5fd;
}

@keyframes mmg-modal-list-status-blink-on {
  0%,
  100% {
    box-shadow: none;
  }

  50% {
    box-shadow: none;
  }
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__status--on {
  background: linear-gradient(135deg, #059669, #10b981);

  color: #fff;

  animation: mmg-modal-list-status-blink-on 2.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  #mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__status--on {
    animation: none;

    box-shadow: none;
  }
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__status--off {
  background: rgb(255 255 255 / 94%);

  color: #475569;

  border: 1px solid var(--mmg-modal-line);
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__status--rest {
  background: linear-gradient(135deg, #5753e4, #615dfa);

  color: #fff;
}

#mbb-manager-modal-list-scroll .mmg-mag.mmg-modal-list .mmg-mag__status--na {
  background: #e2e8f0;

  color: #475569;
}

/* 매니저 모달: 헤더와 첫 카드 사이 여백 */

.ub-board.uv-mbb-manager-modal
  .uv-mbb-manager-modal__body
  .uv-mbb-review-modal__scroll {
  padding-top: 0.85rem;
}

/* ─── 게시물 점프(본문 하단) — 코스헤더·리뷰바 톤과 통일 ─ */

.ub-board .uv-mbb-jump-bar {
  margin-top: 1.5rem;

  margin-bottom: 0.35rem;
}

.ub-board .uv-mbb-jump-form {
  margin: 0;
}

/* 코스안내와 달리 왼쪽 세로 띠 없음(중복 느낌 방지) */

.ub-board .uv-mbb-jump-bar__shell {
  border-radius: 14px;

  overflow: hidden;

  border: 1px solid #e2e8f0;

  box-shadow: none;

  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 38%, #f1f5f9 100%);
}

.ub-board .uv-mbb-jump-bar__body {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.85rem 1.1rem;

  min-width: 0;

  padding: 0.95rem 1.1rem;
}

.ub-board .uv-mbb-jump-bar__icon {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 2.65rem;

  height: 2.65rem;

  border-radius: 14px;

  background: linear-gradient(145deg, #f8f8fc 0%, #e0e7ff 100%);

  color: #5753e4;

  font-size: 1.15rem;

  flex-shrink: 0;

  box-shadow: none;
}

.ub-board .uv-mbb-jump-bar__copy {
  display: flex;

  flex-direction: column;

  align-items: flex-start;

  gap: 0.4rem;

  min-width: 0;

  flex: 1 1 12rem;
}

.ub-board .uv-mbb-jump-bar__title {
  font-size: 0.96875rem;

  font-weight: 800;

  color: #0f172a;

  letter-spacing: -0.03em;

  line-height: 1.3;
}

.ub-board .uv-mbb-jump-bar__badge {
  display: inline-flex;

  align-items: center;

  padding: 0.22rem 0.55rem;

  border-radius: 999px;

  font-size: 0.75rem;

  font-weight: 700;

  letter-spacing: -0.01em;
}

.ub-board .uv-mbb-jump-bar__badge--free {
  background: #ecfdf5;

  border: 1px solid #86efac;

  color: #047857;
}

.ub-board .uv-mbb-jump-bar__badge--paid {
  background: #fffbeb;

  border: 1px solid #fcd34d;

  color: #5753e4;
}

.ub-board .uv-mbb-jump-bar__submit {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 0.45em;

  margin-left: auto;

  padding: 0.62rem 1.15rem;

  border: none;

  border-radius: 12px;

  font-size: 0.875rem;

  font-weight: 800;

  letter-spacing: -0.02em;

  color: #fff;

  cursor: pointer;

  background: linear-gradient(165deg, #475569 0%, #5753e4 48%, #5753e4 100%);

  box-shadow: none;

  transition:
    transform var(--dur-fast, 140ms) var(--ease, ease),
    box-shadow var(--dur-fast, 140ms) var(--ease, ease);
}

.ub-board .uv-mbb-jump-bar__submit:hover {
  transform: translateY(-1px);

  box-shadow: none;

  color: #fff;
}

.ub-board .uv-mbb-jump-bar__submit:active {
  transform: translateY(0);
}

.ub-board .uv-mbb-jump-bar__submit:focus-visible {
  outline: 2px solid #adafca;

  outline-offset: 2px;
}

/* 업체게시판 목록 카드 내부 점프 숨김(하단 버튼 오염 방지) */

.mbb-card .mbb-card__jump-form,
.mbb-card .uv-mbb-jump-form,
.mbb-card .uv-mbb-jump-bar__submit {
  display: none !important;
}

/* 모바일도 한 줄 가로 배치: 아이콘 + 설명(제목·뱃지) + 점프 버튼 */

@media (max-width: 575px) {
  .ub-board .uv-mbb-jump-bar__body {
    display: flex !important;

    flex-direction: row !important;

    flex-wrap: nowrap !important;

    align-items: center !important;

    padding: 0.7rem 0.8rem;

    gap: 0.6rem 0.65rem;
  }

  .ub-board .uv-mbb-jump-bar__icon {
    width: 2.35rem;

    height: 2.35rem;

    font-size: 1rem;
  }

  .ub-board .uv-mbb-jump-bar__copy {
    display: flex !important;

    flex-direction: row !important;

    flex-wrap: wrap !important;

    align-items: center !important;

    align-content: center !important;

    gap: 0.3rem 0.45rem;

    flex: 1 1 0;

    min-width: 0;
  }

  .ub-board .uv-mbb-jump-bar__title {
    font-size: 0.8125rem;

    line-height: 1.25;
  }

  .ub-board .uv-mbb-jump-bar__badge {
    font-size: 0.6875rem;

    padding: 0.18rem 0.45rem;
  }

  .ub-board .uv-mbb-jump-bar__submit {
    display: inline-flex !important;

    margin-left: auto !important;

    flex-shrink: 0 !important;

    width: auto !important;

    max-width: 42%;

    min-height: 2.75rem;

    padding: 0.5rem 0.65rem;

    font-size: 0.75rem;

    white-space: nowrap !important;

    box-sizing: border-box;
  }
}

/* ─── 업체 상세 패널 (뷰): 표 + 옵션 뱃지 한 카드 ───────── */

.ub-board .uv-mbb-hero-info-card {
  border: 1px solid #e2e8f0;

  border-radius: 12px;

  background: #ffffff;

  overflow: hidden;

  box-shadow: none;
}

/* 히어로 우열: 행 높이만큼 카드 확장, 남는 세로는 시설 옵션 구역이 채우며 뱃지는 그 안에서 세로 중앙 */

.ub-board .uv-mbb-hero__side .uv-mbb-hero-info-card {
  flex: 1 1 auto;

  min-height: 0;

  display: flex;

  flex-direction: column;
}

.ub-board .uv-mbb-hero__side .uv-mbb-hero-info-card .uv-mbb-business-detail {
  flex: 0 0 auto;

  min-width: 0;

  width: 100%;
}

.ub-board .uv-mbb-hero__side .uv-mbb-hero-info-card .uv-mbb-options-row--card {
  flex: 1 1 auto;

  min-height: 0;

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  align-content: center;

  /* .uv-mbb-options-row 전역 margin 제거(히어로 카드 안에서만) */

  margin: 0;

  padding: 0.85rem 0.75rem;
}

.ub-board .uv-mbb-business-detail {
  display: block;

  margin: 0;

  padding: 0;

  background: transparent;

  border: 0;

  border-radius: 0;
}

.ub-board .uv-mbb-info-table {
  width: 100%;

  border-collapse: collapse;

  table-layout: fixed;
}

.ub-board .uv-mbb-info-table th,
.ub-board .uv-mbb-info-table td {
  padding: 0.62rem 0.85rem;

  vertical-align: middle;

  border-bottom: 1px solid #f1f5f9;

  /* table-layout:fixed + 좁은 열에서도 셀 배경·테두리가 끝까지 유지 */

  min-width: 0;
}

/* 대표가격 행: 마지막 줄 구분선이 안 보이는 환경 대비 명시 */

.ub-board .uv-mbb-info-table tbody tr:last-child th,
.ub-board .uv-mbb-info-table tbody tr:last-child td {
  border-bottom: 1px solid #f1f5f9;
}

.ub-board .uv-mbb-info-table th {
  width: 42%;

  max-width: 210px;

  text-align: left;

  font-weight: normal;

  background: linear-gradient(180deg, #fafbff 0%, #f8fafc 100%);
}

.ub-board .uv-mbb-th-inner {
  display: flex;

  align-items: center;

  gap: 0.5rem;

  min-height: 32px;
}

.ub-board .uv-mbb-icon {
  width: 28px;

  height: 28px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  background: #f8f8fc;

  color: #5753e4;

  flex-shrink: 0;
}

.ub-board .uv-mbb-label {
  font-size: 0.8125rem;

  color: #64748b;

  font-weight: 700;

  letter-spacing: -0.02em;
}

.ub-board .uv-mbb-td-value {
  text-align: right;

  font-weight: 700;

  color: #0f172a;

  font-size: 0.9rem;

  line-height: 1.45;

  letter-spacing: -0.02em;

  word-break: keep-all;

  overflow-wrap: break-word;

  white-space: normal;
}

/* 관리사 국적: 국기 + 텍스트(우측 정렬 유지) */

.ub-board .uv-mbb-td-value--nat {
  vertical-align: middle;
}

.ub-board .uv-mbb-nat-flag {
  margin-right: 0.2rem;
}

.ub-board .uv-mbb-nat-text {
  vertical-align: middle;
}

/* td에 display:flex 금지: 테이블 열·배경이 평점 행부터 깨짐 → table-cell 유지, 내부만 정렬 */

.ub-board .uv-mbb-td-value--rating {
  text-align: right;

  vertical-align: middle;
}

.ub-board .uv-mbb-td-value--rating .uv-mbb-stars {
  display: inline-flex;

  align-items: center;

  flex-wrap: wrap;

  justify-content: flex-end;

  gap: 0.12rem;

  vertical-align: middle;

  max-width: 100%;
}

.ub-board .uv-mbb-td-value--rating .uv-mbb-score {
  display: inline-block;

  vertical-align: middle;

  margin-left: 0.35rem;
}

/* 레거시(다른 마크업) 호환 */

.ub-board .uv-mbb-value {
  color: #0f172a;

  font-weight: 700;

  letter-spacing: -0.02em;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

.ub-board .uv-mbb-detail-row {
  display: flex;

  align-items: center;

  gap: 0.55rem;

  min-height: 38px;
}

/* 표 아래 시설 옵션(히어로 카드 안 패딩은 상위 선택자에서 덮어씀) */

.ub-board .uv-mbb-options-row--card {
  margin: 0;

  padding: 0.65rem 0.75rem 0.72rem;

  border-top: none;

  background: linear-gradient(180deg, #fdfdff 0%, #fafbff 100%);
}

@media (max-width: 575px) {
  .ub-board .uv-mbb-info-table th {
    width: 46%;

    padding-left: 0.7rem;

    padding-right: 0.45rem;
  }

  .ub-board .uv-mbb-info-table td {
    padding-left: 0.45rem;

    padding-right: 0.7rem;
  }

  .ub-board .uv-mbb-td-value {
    font-size: 0.875rem;
  }
}

/* 리뷰 바 아래: 쪽지·전화 (2열 그리드, 버튼 하나면 전체 폭) */

.ub-board .uv-mbb-hero__cta {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 0.5rem;

  min-width: 0;
}

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn {
  min-width: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  text-align: center;

  text-decoration: none;

  padding: 0.65rem 0.85rem;

  font-size: 0.875rem;

  font-weight: 600;

  min-height: 46px;

  box-sizing: border-box;

  border-radius: var(--uv-mbb-hero-radius, 12px);
}

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn:only-child {
  grid-column: 1 / -1;
}

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn--call {
  font-weight: 700;
}

.ub-board .uv-mbb-safe-badge {
  display: inline-flex;

  align-items: center;

  gap: 0.35rem;

  padding: 0.35rem 0.6rem;

  border-radius: 999px;

  background: #ecfdf5;

  border: 1px solid #86efac;

  color: #065f46;

  font-weight: 800;

  font-size: 0.8125rem;
}

.ub-board .uv-mbb-stars .mbb-star--on {
  color: #facc15;
}

.ub-board .uv-mbb-stars .mbb-star--off {
  color: #e5e7eb;
}

.ub-board .mbb-star--half {
  color: #facc15;
}

.ub-board .uv-mbb-score {
  margin-left: 0.35rem;

  color: #5753e4;

  font-weight: 900;
}

/* 리뷰 별점 배지: 5개 별 + 숫자 (모달 목록·상세 공통) */

.ub-board .uv-mbb-score-badge {
  display: inline-flex;

  align-items: center;

  flex-wrap: nowrap;

  gap: 0.4rem;

  max-width: 100%;
}

.ub-board .uv-mbb-score-badge__stars {
  display: inline-flex;

  align-items: center;

  gap: 2px;

  line-height: 1;

  flex-shrink: 0;
}

.ub-board .uv-mbb-score-badge__stars .sk-ico {
  font-size: 0.72rem;

  vertical-align: middle;
}

/* 배지 안 별은 .uv-mbb-stars 밖에 있어서 색 규칙이 비어 있음 — 테마 기본(검정) 무력화 */

.ub-board .uv-mbb-score-badge__stars .mbb-star--on {
  color: #fbbf24 !important;
}

.ub-board .uv-mbb-score-badge__stars .mbb-star--half {
  color: #fbbf24 !important;
}

.ub-board .uv-mbb-score-badge__stars .mbb-star--off {
  color: #e5e7eb !important;
}

.ub-board .uv-mbb-score-badge__value {
  display: inline-flex;

  align-items: baseline;

  gap: 0.08rem;

  padding: 0.18rem 0.45rem 0.2rem;

  border-radius: 999px;

  background: linear-gradient(135deg, #f8f8fc 0%, #e0e7ff 100%);

  border: 1px solid #c7d2fe;

  box-shadow: none;
}

.ub-board .uv-mbb-score-badge__num {
  font-size: 0.8125rem;

  font-weight: 900;

  letter-spacing: -0.03em;

  color: #312e81;

  line-height: 1;

  font-variant-numeric: tabular-nums;
}

.ub-board .uv-mbb-score-badge__den {
  font-size: 0.65rem;

  font-weight: 700;

  color: #475569;

  opacity: 0.9;
}

/* 목록 한 줄용 (작게) */

.ub-board .uv-mbb-score-badge--sm {
  gap: 0.28rem;
}

.ub-board .uv-mbb-score-badge--sm .uv-mbb-score-badge__stars .sk-ico {
  font-size: 0.62rem;
}

.ub-board .uv-mbb-score-badge--sm .uv-mbb-score-badge__num {
  font-size: 0.75rem;
}

.ub-board .uv-mbb-score-badge--sm .uv-mbb-score-badge__value {
  padding: 0.12rem 0.38rem 0.14rem;
}

.ub-board .uv-mbb-score-badge--sm .uv-mbb-score-badge__den {
  font-size: 0.6rem;
}

/* 상세 상단 (크게) */

.ub-board .uv-mbb-score-badge--lg {
  gap: 0.55rem;
}

.ub-board .uv-mbb-score-badge--lg .uv-mbb-score-badge__stars .sk-ico {
  font-size: 0.95rem;
}

.ub-board .uv-mbb-score-badge--lg .uv-mbb-score-badge__num {
  font-size: 1.125rem;
}

.ub-board .uv-mbb-score-badge--lg .uv-mbb-score-badge__value {
  padding: 0.35rem 0.65rem 0.38rem;

  border-radius: 12px;
}

.ub-board .uv-mbb-score-badge--lg .uv-mbb-score-badge__den {
  font-size: 0.72rem;
}

/* 모달 상세 헤더: 점수 과대 방지, 별은 읽기 쉬운 중간 크기 */

.ub-board .uv-mbb-score-badge--detail {
  gap: 0.38rem;
}

.ub-board .uv-mbb-score-badge--detail .uv-mbb-score-badge__stars .sk-ico {
  font-size: 0.78rem;
}

.ub-board .uv-mbb-score-badge--detail .uv-mbb-score-badge__num {
  font-size: 0.875rem;
}

.ub-board .uv-mbb-score-badge--detail .uv-mbb-score-badge__value {
  padding: 0.22rem 0.5rem 0.24rem;

  border-radius: 10px;
}

.ub-board .uv-mbb-score-badge--detail .uv-mbb-score-badge__den {
  font-size: 0.65rem;
}

/* ─── 옵션 아이콘 바 ─────────────────────────────── */

.ub-board .uv-mbb-options-row {
  display: flex;

  flex-wrap: wrap;

  gap: 0.75rem 1rem;

  margin-top: 0.35rem;

  margin-bottom: 0.55rem;
}

.ub-board .uv-mbb-opt {
  min-width: 0;

  max-width: 60px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 0.28rem;

  padding: 0.4rem 0.55rem;

  border-radius: 12px;

  border: 1px solid #e2e8f0;

  background: #ffffff;
}

.ub-board .uv-mbb-opt i {
  font-size: 1.15rem;

  line-height: 1;
}

.ub-board .uv-mbb-opt span {
  font-size: 0.75rem;

  font-weight: 800;

  color: #0f172a;

  white-space: nowrap;
}

.ub-board .uv-mbb-opt--pink i {
  color: #f43f5e;
}

.ub-board .uv-mbb-opt--blue i {
  color: #3b82f6;
}

.ub-board .uv-mbb-opt--teal i {
  color: #10b981;
}

.ub-board .uv-mbb-opt--orange i {
  color: #f97316;
}

.ub-board .uv-mbb-opt--violet i {
  color: #8b5cf6;
}

.ub-board .uv-mbb-opt--sky i {
  color: #0ea5e9;
}

.ub-board .uv-mbb-opt--amber i {
  color: #f59e0b;
}

.ub-board .uv-mbb-opt--red i {
  color: #ef4444;
}

/* 리뷰: 개수 안내 + 작성 버튼을 한 덩어리로 */

.ub-board .uv-mbb-review-bar {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 0.65rem 1rem;

  margin-top: 1.28rem;

  padding: 0.65rem 0.95rem;

  background: linear-gradient(135deg, #f8fafc 0%, #f8f8fc 100%);

  border: 1px solid #e2e8f0;

  border-radius: 12px;
}

.ub-board .uv-mbb-review-bar__meta {
  display: inline-flex;

  align-items: center;

  gap: 0.45rem;

  font-size: 0.8125rem;

  font-weight: 600;

  color: #64748b;

  line-height: 1.35;

  flex: 1 1 200px;

  min-width: 0;
}

.ub-board .uv-mbb-review-bar__meta .sk-ico {
  color: #5753e4;

  font-size: 1rem;

  flex-shrink: 0;
}

.ub-board .uv-mbb-review-bar__meta strong {
  color: #5753e4;

  font-weight: 800;
}

.ub-board .uv-mbb-review-bar__btn {
  flex-shrink: 0;
}

/* 리뷰 전체보기 + 리뷰 작성 나란히 */

.ub-board .uv-mbb-review-bar__actions {
  display: inline-flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 0.45rem;

  flex-shrink: 0;
}

/* 목록 카드: 리뷰보기 버튼(앵커와 동일 레이아웃) */

.ub-board button.mbb-card__btn {
  cursor: pointer;

  font-family: inherit;

  margin: 0;

  box-sizing: border-box;

  -webkit-appearance: none;

  appearance: none;

  /* 브라우저 기본 버튼 내부 하이라이트·테두리로 화살표 칸이 얼룩져 보이는 것 방지 */

  -webkit-tap-highlight-color: transparent;
}

.ub-board button.mbb-card__btn::-moz-focus-inner {
  border: 0;

  padding: 0;
}

/* 목록 전용 리뷰 모달: 업체 소개 + 리뷰 구역 제목 */

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__post-head {
  display: flex;

  align-items: center;

  gap: 0.4rem;

  font-size: 0.8125rem;

  font-weight: 700;

  color: var(--t-base, #0f172a);

  margin: 0 0 0.5rem;

  padding-bottom: 0.35rem;

  border-bottom: 1px solid var(--b-default, #e2e8f0);
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__post-head--reviews {
  margin-top: 1.25rem;
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__post {
  margin-bottom: 0;

  font-size: 0.875rem;

  line-height: 1.55;

  color: var(--t-medium, #334155);
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.5rem 0.75rem;

  justify-content: space-between;

  margin-top: var(--sp-3, 0.75rem);

  padding-top: var(--sp-3, 0.75rem);

  border-top: 1px solid var(--b-subtle, #f1f5f9);
}

/* 보라 배경 위 라벨·아이콘 흰색(테마에서 글자색이 먹히지 않는 경우 대비) */

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-list-modal-view-link.ub-btn--primary {
  color: #fff !important;
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-list-modal-view-link.ub-btn--primary
  .sk-ico {
  color: #fff !important;
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-list-modal-view-link.ub-btn--primary:hover,
.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-list-modal-view-link.ub-btn--primary:focus-visible {
  color: #fff !important;
}

/* 매니저 모달 하단「매니저 등록」— 동일하게 흰 글자(아이디 선택자 없어서 리뷰 링크 규칙이 안 먹던 문제) */

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-manager-modal-register-btn.ub-btn--primary {
  color: #fff !important;
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-manager-modal-register-btn.ub-btn--primary
  .sk-ico {
  color: #fff !important;
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-manager-modal-register-btn.ub-btn--primary:hover,
.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--list-context
  .uv-mbb-review-modal__foot--list-only
  #mbb-manager-modal-register-btn.ub-btn--primary:focus-visible {
  color: #fff !important;
}

/* 뷰: 리뷰 목록 모달(이전과 동일 — .ub-board.uv-mbb-review-modal 로 토큰·스코프 복원) */

.ub-board.uv-mbb-review-modal .ub-modal__dialog.uv-mbb-review-modal__dialog {
  max-width: min(520px, 96vw);

  width: 100%;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__body {
  padding-top: 0;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__scroll {
  max-height: min(52vh, 420px);

  overflow-y: auto;

  margin: 0 calc(var(--sp-5) * -1);

  padding: 0 var(--sp-5);

  -webkit-overflow-scrolling: touch;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__list {
  list-style: none;

  margin: 0;

  padding: 0;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__item {
  border-top: 1px dashed #e2e8f0;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__item:first-child {
  border-top: 0;
}

/* 목록 번호(링크 아님) + 본문 행 */

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__item-row {
  display: flex;

  align-items: center;

  gap: 0.4rem 0.55rem;

  width: 100%;

  box-sizing: border-box;
}

/* 목록 순번 — 총 건수·별점 pill과 톤 맞춘 미니 박스 */

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__index {
  flex: 0 0 auto;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 1.75rem;

  min-height: 1.75rem;

  padding: 0.2rem 0.38rem;

  box-sizing: border-box;

  border: 1px solid #c7d2fe;

  border-radius: 9px;

  background: linear-gradient(165deg, #f8f8fc 0%, #e0e7ff 55%, #dedeea 100%);

  box-shadow: none;

  color: #5753e4;

  font-size: 0.6875rem;

  font-weight: 800;

  line-height: 1;

  letter-spacing: -0.02em;

  font-variant-numeric: tabular-nums;

  text-align: center;

  user-select: none;

  pointer-events: none;
}

.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__item-row
  .uv-mbb-review-modal__link,
.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__item-row
  .uv-mbb-review-modal__static {
  flex: 1 1 auto;

  min-width: 0;

  width: auto;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__toprow {
  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  gap: 0.5rem 0.75rem;

  width: 100%;
}

.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__toprow
  .uv-mbb-review-modal__title {
  flex: 1 1 auto;

  min-width: 0;
}

.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__toprow
  .uv-mbb-review-modal__score {
  flex: 0 0 auto;

  align-self: flex-start;

  max-width: 48%;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__static {
  display: flex;

  flex-direction: column;

  align-items: stretch;

  gap: 0.35rem;

  padding: 0.7rem 0;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__link {
  display: flex;

  flex-direction: column;

  align-items: stretch;

  gap: 0.35rem;

  padding: 0.7rem 0;

  color: inherit;

  text-decoration: none;
}

.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__link:hover
  .uv-mbb-review-modal__title {
  color: #5753e4;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__title {
  font-size: 0.875rem;

  font-weight: 700;

  color: #0f172a;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__meta {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.35rem 0.45rem;

  font-size: 0.8125rem;

  color: #64748b;

  line-height: 1.5;

  margin-top: 0.05rem;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__meta-sep {
  color: #cbd5e1;

  font-weight: 400;

  user-select: none;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__who,
.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__date {
  font-size: 0.78rem;

  font-weight: 600;

  color: #64748b;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__empty {
  margin: 0;

  font-size: 0.875rem;

  color: #94a3b8;

  padding: 0.5rem 0 0.25rem;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__foot {
  margin: 0.75rem 0 0;

  padding-top: 0.65rem;

  border-top: 1px solid #e2e8f0;

  font-size: 0.8125rem;

  text-align: center;

  display: flex;

  justify-content: center;

  align-items: center;

  flex-wrap: wrap;

  gap: 0.55rem 0.75rem;
}

/* 총 리뷰 건수 — 박스형, 링크 아님 */

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__total-badge {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 0.42rem 0.7rem;

  border: 1px solid #e2e8f0;

  border-radius: 10px;

  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);

  box-shadow: none;

  color: #64748b;

  font-size: 0.78rem;

  font-weight: 600;

  line-height: 1.2;

  user-select: none;

  pointer-events: none;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__total-badge strong {
  color: #1e293b;

  font-weight: 800;

  margin: 0 0.12rem;

  font-variant-numeric: tabular-nums;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__foot a {
  color: #5753e4;

  font-weight: 700;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__foot--with-delete {
  justify-content: space-between;

  text-align: left;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__foot-actions {
  display: inline-flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.35rem;
}

.ub-board.uv-mbb-review-modal .uv-mbb-bulk-pick {
  flex: 0 0 auto;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  align-self: center;

  margin-right: 0.1rem;
}

.ub-board.uv-mbb-review-modal .uv-mbb-bulk-pick input {
  width: 1rem;

  height: 1rem;

  cursor: pointer;
}

/* 리뷰 모달: 헤더(뒤로·제목·닫기)

   뒤로 버튼이 [hidden]이면 display:none → 그리드 자식이 2개만 남아 닫기가 제목 옆 열에 붙는 문제 방지:

   3열 고정(좌·중·우) + 각 자식에 grid-column 명시 */

.ub-board.uv-mbb-review-modal .ub-modal__header.uv-mbb-review-modal__header {
  display: grid !important;

  grid-template-columns: 40px minmax(0, 1fr) 40px;

  align-items: center;

  column-gap: 0.35rem;

  row-gap: 0.25rem;

  justify-items: stretch;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__back {
  grid-column: 1;

  grid-row: 1;

  justify-self: center;

  align-self: center;

  background: rgb(255 255 255 / 22%);

  border: 0;

  color: #fff;

  width: 36px;

  height: 36px;

  border-radius: var(--r-full, 9999px);

  cursor: pointer;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  transition: background var(--dur-fast, 140ms) var(--ease, ease);
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__back:hover {
  background: rgb(255 255 255 / 35%);
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__heading {
  grid-column: 2;

  grid-row: 1;

  margin: 0;

  text-align: center;

  font-size: 0.9375rem;

  font-weight: 600;

  line-height: 1.35;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

/* 닫기는 항상 오른쪽(3열) — board.css flex 레이아웃과 무관하게 고정 */

.ub-board.uv-mbb-review-modal
  .ub-modal__header.uv-mbb-review-modal__header
  > .ub-modal__close {
  grid-column: 3;

  grid-row: 1;

  justify-self: center;

  align-self: center;

  margin: 0;

  flex-shrink: 0;

  width: 36px;

  height: 36px;

  min-width: 36px;
}

/* 목록 행: 링크 대신 버튼 */

.ub-board.uv-mbb-review-modal button.uv-mbb-review-modal__link,
.ub-board.uv-mbb-review-modal a.uv-mbb-review-modal__link {
  width: 100%;

  text-align: left;

  border: 0;

  background: none;

  padding: 0.7rem 0;

  cursor: pointer;

  font: inherit;

  color: inherit;
}

.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__item-row
  button.uv-mbb-review-modal__link,
.ub-board.uv-mbb-review-modal
  .uv-mbb-review-modal__item-row
  a.uv-mbb-review-modal__link {
  width: auto;
}

.ub-board.uv-mbb-review-modal
  button.uv-mbb-review-modal__link:hover
  .uv-mbb-review-modal__title,
.ub-board.uv-mbb-review-modal
  a.uv-mbb-review-modal__link:hover
  .uv-mbb-review-modal__title {
  color: #5753e4;
}

/* 본문 보기 — 작성자·날짜(왼쪽) + 별점(오른쪽) 한 줄 */

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-meta {
  display: flex;

  flex-direction: row;

  flex-wrap: nowrap;

  align-items: center;

  justify-content: space-between;

  gap: 0.5rem 0.75rem;

  margin-bottom: 0.85rem;

  margin-top: 0.1rem;

  padding: 0.75rem 0.15rem 0.8rem;

  border-bottom: 1px solid #e2e8f0;
}

/* 상세 — 본문 아래 글수정·삭제, 오른쪽 정렬 */

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-actions {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: flex-end;

  gap: 0.5rem;

  margin: 0.85rem 0 0.25rem;

  padding: 0.65rem 0.15rem 0;

  border-top: 1px solid #f1f5f9;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-scoreblock {
  display: flex;

  align-items: center;

  justify-content: flex-end;

  flex: 0 0 auto;

  max-width: min(55%, 220px);
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-subline {
  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 0.35rem 0.5rem;

  font-size: 0.8125rem;

  color: #64748b;

  font-weight: 600;

  flex: 1 1 auto;

  min-width: 0;

  line-height: 1.45;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-sep {
  color: #cbd5e1;

  font-weight: 400;

  user-select: none;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-author {
  color: #475569;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-date {
  color: #94a3b8;

  font-weight: 600;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-content {
  font-size: 0.875rem;

  line-height: 1.55;

  color: #0f172a;

  word-break: break-word;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__detail-content img {
  max-width: 100%;

  height: auto;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__secret-msg,
.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__empty-inline {
  margin: 0;

  font-size: 0.875rem;

  color: #94a3b8;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__scroll--detail {
  max-height: min(58vh, 480px);
}

/* 작성: 넓은 다이얼로그 + iframe(글쓰기 폼 가로 공간 확보, 이중 여백 최소화) */

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--write
  .ub-modal__dialog.uv-mbb-review-modal__dialog {
  max-width: min(900px, 99vw);
}

.ub-board.uv-mbb-review-modal.uv-mbb-review-modal--write
  .ub-modal__body.uv-mbb-review-modal__body {
  padding-top: 0;

  padding-left: 0;

  padding-right: 0;

  padding-bottom: 0;
}

.ub-board.uv-mbb-review-modal .uv-mbb-review-modal__iframe {
  width: 100%;

  min-height: min(72vh, 680px);

  border: 0;

  display: block;

  background: #ffffff;
}

@media (max-width: 575px) {
  .ub-board.uv-mbb-review-modal .uv-mbb-review-modal__iframe {
    min-height: min(65vh, 560px);
  }
}

.ub-board .uv-mbb-review-list {
  margin-top: 0.55rem;

  padding: 0.75rem 0.9rem;

  border: 1px solid #e2e8f0;

  border-radius: 12px;

  background: #ffffff;
}

.ub-board .uv-mbb-review-list__head {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.5rem;

  margin-bottom: 0.45rem;
}

.ub-board .uv-mbb-review-list__head strong {
  font-size: 0.86rem;

  color: #334155;
}

.ub-board .uv-mbb-review-list__more {
  font-size: 0.75rem;

  font-weight: 700;

  color: #5753e4;
}

.ub-board .uv-mbb-review-list__items {
  list-style: none;

  margin: 0;

  padding: 0;
}

.ub-board .uv-mbb-review-list__item {
  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 0.6rem;

  padding: 0.42rem 0;

  border-top: 1px dashed #e2e8f0;
}

.ub-board .uv-mbb-review-list__item:first-child {
  border-top: 0;
}

.ub-board .uv-mbb-review-list__title {
  font-size: 0.8rem;

  color: #1e293b;

  font-weight: 600;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  flex: 1;

  min-width: 0;
}

.ub-board .uv-mbb-review-list__meta {
  display: inline-flex;

  align-items: center;

  gap: 0.42rem;

  font-size: 0.72rem;

  color: #64748b;

  flex-shrink: 0;
}

.ub-board .uv-mbb-review-list__score {
  color: #5753e4;

  font-weight: 700;
}

.ub-board .uv-mbb-review-list__empty {
  font-size: 0.78rem;

  color: #94a3b8;

  padding: 0.25rem 0 0.1rem;
}

/* 읽은 글 처리 */

.ub-board .ubr__link:visited {
  color: #8b8fa8;
}

/* 공지·열람 행 제목은 항상 진하게 */

.ub-board .ubr--notice .ubr__link {
  color: #1e1b4b; /* 공지: 브론즈 진한 톤으로만 살짝 강조 */

  font-weight: 700;
}

.ub-board .ubr--current .ubr__link {
  color: #0f172a;
  font-weight: 600;
}

/* 데스크탑 제목 말줄임 */

@media (min-width: 768px) {
  .ub-board .ubr__link {
    max-width: 520px;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;
  }
}

/* ─── 게시글 보기 세부 ────────────────────────────── */

/* 본문 산문 스타일 */

.ub-board #bo_v_con .view-content {
  font-size: 1rem;

  line-height: 1.85;

  color: #1e293b;

  word-break: break-word;
}

.ub-board #bo_v_con .view-content p {
  margin: 0 0 1em;
}

.ub-board #bo_v_con .view-content h2,
.ub-board #bo_v_con .view-content h3 {
  margin-top: 1.5em;
  font-weight: 700;
}

.ub-board #bo_v_con .view-content blockquote {
  margin: 1.25em 0;

  padding: 0.75em 1.25em;

  border-left: 3px solid #5753e4;

  background: #f8f8fc;

  border-radius: 0 8px 8px 0;

  color: #334155;
}

.ub-board #bo_v_con .view-content a {
  color: #5753e4;
  text-decoration: underline;
}

.ub-board #bo_v_con .view-content pre,
.ub-board #bo_v_con .view-content code {
  background: #f1f5f9;

  border-radius: 6px;

  font-family: "JetBrains Mono", "Consolas", monospace;

  font-size: 0.875em;
}

.ub-board #bo_v_con .view-content pre {
  padding: 1em;
  overflow-x: auto;
}

.ub-board #bo_v_con .view-content code {
  padding: 0.15em 0.4em;
}

/* 뷰 상단(좌측 배너/우측 상세) 바로 아래 구분선 제거 */

.ub-board.uv-view-page #bo_v #bo_v_con {
  border-top: 0 !important;
}

/* =============================================================
 *
 * Under Jobs Board — 프리미엄 UI
 *
 * ============================================================= */

.ub-board .ujb-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #fff;
  font-weight: 700;
}

.ub-board .ujb-pay-grid {
  display: grid;
  grid-template-columns: 12rem minmax(0, 1fr);
  gap: 0.75rem;
}

@media (max-width: 575.98px) {
  .ub-board .ujb-pay-grid {
    grid-template-columns: 1fr;
  }
}

/* 필터 바 */

.ub-board .ujb-filterbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  padding: 12px 16px;
  margin: 0 0 6px;

  background: #ffffff;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.ub-board .ujb-filterbar__group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
}

.ub-board .ujb-filterbar__group--right {
  margin-left: auto;
  padding-left: 0;
  position: static;
}

.ub-board .ujb-filterbar__group--right::before {
  display: none;
}

.ub-board .ujb-filterbar__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 12px;

  border-radius: 10px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #ffffff;

  color: #475569;
  font-weight: 700;
  font-size: 0.8125rem;
  text-decoration: none;

  transition:
    background 160ms ease,
    border-color 160ms ease,
    color 160ms ease,
    transform 120ms ease;
}

.ub-board a.ujb-filterbar__tab:hover {
  background: #f8f9ff;
  border-color: rgba(79, 70, 229, 0.22);
  color: #4338ca;
  transform: translateY(-1px);
}

.ub-board .ujb-filterbar__tab.is-active {
  background: linear-gradient(180deg, #6366f1 0%, #4f46e5 52%, #4338ca 100%);
  border-color: transparent;
  color: #fff;
}

.ub-board .ujb-filterbar__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 10px;

  border-radius: 9999px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #f8fafc;

  color: #64748b;
  font-weight: 700;
  font-size: 0.75rem;
  text-decoration: none;

  transition:
    background 150ms ease,
    border-color 150ms ease,
    color 150ms ease,
    transform 120ms ease;
}

.ub-board a.ujb-filterbar__chip:hover {
  background: #eeecff;
  border-color: rgba(79, 70, 229, 0.22);
  color: #4338ca;
  transform: translateY(-1px);
}

@media (max-width: 575.98px) {
  .ub-board .ujb-filterbar {
    gap: 8px;
    padding: 10px 12px;
  }

  .ub-board .ujb-filterbar__group--right {
    margin-left: 0;
    padding-left: 0;
  }

  .ub-board .ujb-filterbar__group--right::before {
    display: none;
  }
}

.ub-board .ujb-filterbar__chip.is-active {
  background: rgba(79, 70, 229, 0.12);
  border-color: rgba(79, 70, 229, 0.22);
  color: #4338ca;
}

/* 배지 */

.ub-board .ujb-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.55rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  border: 1px solid #e2e8f0;
  white-space: nowrap;
}

.ub-board .ujb-badge--hire { background: #eef2ff; border-color: #c7d2fe; color: #3730a3; }
.ub-board .ujb-badge--seek { background: #ecfeff; border-color: #a5f3fc; color: #155e75; }
.ub-board .ujb-badge--open { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
.ub-board .ujb-badge--neg { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.ub-board .ujb-badge--closed { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.ub-board .ujb-badge--pay { background: #f8fafc; border-color: #e2e8f0; color: #334155; }
.ub-board .ujb-badge--wait { background: #fafafa; border-color: #e5e7eb; color: #6b7280; }
.ub-board .ujb-badge--report { background: #fff1f2; border-color: #fecdd3; color: #be123c; }

/* 리스트 우측 */

.ub-board .ujb-row__right {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.ub-board .ujb-row__author {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.ub-board .ujb-row__m-left {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

.ub-board .ujb-row__m-right {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.ub-board .ujb-row {
  /* list.skin.php 에서는 li가 .ubr(플랫 리스트)로 이미 레이아웃/패딩/구분선을 가짐.
     여기서는 UJB가 카드형으로 덮어써서 레이아웃이 깨지는 것을 방지한다. */
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0 24px;
  gap: 0;
}

.ub-board .ublist-body {
  padding: 0;
  margin-top: 0;
}

.ub-board .ujb-row .ubr__no {
  display: block;
}

.ub-board .ujb-row .ubr__body {
  flex: 1;
  min-width: 0;
}

.ub-board .ujb-row .ubr__cols {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
}

.ub-board .ujb-row__sub {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
  min-height: 18px;
}

.ub-board .ujb-subtext {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.ub-board .ujb-subtext + .ujb-subtext::before {
  content: "·";
  display: inline-block;
  margin: 0 6px 0 0;
  color: rgba(15, 23, 42, 0.18);
  font-weight: 700;
}

.ub-board .ujb-row__link {
  font-weight: 700;
  letter-spacing: -0.01em;
}

.ub-board .ujb-row__author {
  width: 92px;
  text-align: center;
  color: #475569;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .ub-board .ujb-row {
    padding: 14px 16px;
  }
  .ub-board .ujb-row .ubr__cols {
    display: none;
  }
}

.ub-board .ujb-mini {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 9999px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #ffffff;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #64748b;
}

/* 상세 카드 */

.ub-board .ujb-view-card {
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
  margin: 0 0 1.25rem;
}

.ub-board .ujb-view-card__top {
  padding: 1.25rem 1.35rem 1.15rem;
  background: linear-gradient(145deg, #f8fafc 0%, #ffffff 55%, #ffffff 100%);
}

.ub-board .ujb-view-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: center;
  margin-bottom: 0.75rem;
}

.ub-board .ujb-view-card__title {
  font-size: 1.15rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #0f172a;
  line-height: 1.35;
  margin-bottom: 0.75rem;
  word-break: break-word;
}

.ub-board .ujb-view-card__meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem 1rem;
  align-items: start;
  padding-top: 0.35rem;
}

.ub-board .ujb-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  font-weight: 700;
  color: #334155;
  min-width: 0;
}

.ub-board .ujb-meta .sk-ico {
  color: #6366f1;
  width: 16px;
  text-align: center;
  flex: 0 0 auto;
}

.ub-board .ujb-adminbar {
  padding: 0.85rem 1.35rem;
  border-top: 1px solid #e2e8f0;
  background: #ffffff;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.5rem 0.75rem;
}

.ub-board .ujb-adminbar__form {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}

.ub-board .ujb-adminbar__form .ub-btn-group {
  display: inline-flex;
  gap: 0.4rem;
}

.ub-board .ujb-adminbar__hint {
  flex: 1 1 100%;
  margin: 0.25rem 0 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: #94a3b8;
  line-height: 1.45;
}

.ub-board .ujb-jumpbar {
  padding: 0.85rem 1.35rem;
  border-top: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
}

.ub-board .ujb-jumpbar__form {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0;
}

.ub-board .ujb-jumpbar__cost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 1.55rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 900;
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  color: #3730a3;
  white-space: nowrap;
}

.ub-board .ujb-jumpbar__hint {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}

.ub-board .ujb-view-card__contact {
  border-top: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  padding: 1.05rem 1.35rem 1.15rem;
}

.ub-board .ujb-contact {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.ub-board .ujb-contact__icon {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgb(79 70 229 / 18%);
  color: #4f46e5;
  font-size: 1.1rem;
}

.ub-board .ujb-contact__label {
  margin: 0 0 0.25rem;
  font-size: 0.6875rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #64748b;
}

.ub-board .ujb-contact__value {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.55;
  color: #0f172a;
  word-break: break-word;
}

.ub-board .ujb-contact__value--locked {
  color: #64748b;
}

.ub-board .ujb-contact__hint {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}

@media (max-width: 575.98px) {
  .ub-board .ujb-view-card__top { padding: 1.05rem 1rem 1rem; }
  .ub-board .ujb-view-card__contact { padding: 0.95rem 1rem 1rem; }
  .ub-board .ujb-adminbar { padding: 0.8rem 1rem; }
  .ub-board .ujb-jumpbar { padding: 0.8rem 1rem; }
  .ub-board .ujb-view-card__meta { grid-template-columns: 1fr; }
  .ub-board .ujb-pay-grid { grid-template-columns: 1fr; }
}

/* ─── 게시글 보기 하단 버튼 ──────────────────────── */

.ub-board .clearfix.ub-pt-2.ub-border-top {
  padding: 1rem 1.5rem;

  background: #f8fafc;
}

/* ─── 댓글 영역 간격 ─────────────────────────────── */

.ub-board #viewcomment {
  border-top: 1px solid #edf0f5;

  padding: 20px 0 0;

  margin-top: 0;

  background: #ffffff;
}

/* 댓글 count 헤더 */

.ub-board #viewcomment > .ub-board {
  padding-left: 24px;

  padding-right: 24px;
}

.ub-board #bo_vc {
  padding: 0 24px;
}

.ub-board #bo_vc_w {
  padding: 0 24px 24px;
}

#bo_vc_login {
  margin: 24px;
}

/* 대댓글 들여쓰기 가이드선 */

.ub-board article[id^="c_"] .cmt-reply {
  top: 14px;
  left: -14px;

  width: 18px;
  height: 18px;

  opacity: 0.5;
}

/* 댓글 작성자 이름 */

.ub-board .cmt-wrap header a {
  font-weight: 600;
  color: #0f172a;
}

.ub-board .cmt-wrap header time {
  color: #94a3b8;
  font-size: 0.8125rem;
}

/* ─── 글쓰기 폼 헤더 ────────────────────────────── */

.ub-board #bo_w .ub-list-item:first-child {
  padding: 20px 28px;

  background: linear-gradient(135deg, var(--c-primary) 0%, var(--c-primary-h) 100%);

  border-radius: 12px 12px 0 0;

  border-bottom: 0;
}

.ub-board #bo_w .ub-list-item:first-child h5 {
  color: #fff;

  font-size: 1rem;

  font-weight: 700;

  margin: 0;

  letter-spacing: -0.02em;
}

/* ─── 페이징 구역 ────────────────────────────────── */

.ub-board #bo_list_wrap > .ub-font-normal {
  padding: 0.25rem 0 0;
}

/* ─── 글쓰기 제출 버튼 반응형 ───────────────────────── */

@media (max-width: 575px) {
  .ub-board #bo_w .uw-submit-bar {
    padding: 14px 16px;
    gap: 8px;
  }

  .ub-board #bo_w .uw-submit-bar .ub-btn {
    height: 44px;
    font-size: 0.875rem;
  }
}

/* ─── .responsive 호환 (테마 스코프) ─────────────── */

@media (max-width: 575px) {
  .responsive .ub-cmt-box {
    border-radius: var(--r-md);
  }

  .responsive #bo_vc_w .ub-cmt-box {
    border-radius: var(--r-md);
  }
}

/* ═══════════════════════════════════════════════════════════════

   ▶ LUXURY SPA DIRECTORY — Premium Redesign 2026

   철학: 공간이 곧 럭셔리 / copper는 딱 3곳만 / 타이포로 위계

   ═══════════════════════════════════════════════════════════════ */

/* ── 토큰 ──────────────────────────────────────────────────── */

.ub-board {
  --prm-ink-100: #0e0a07;

  --prm-ink-80: #28180c;

  --prm-ink-60: #5c5048;

  --prm-ink-40: #9a8f87;

  --prm-ink-20: #c8c0b8;

  --prm-bg-0: #ffffff;

  --prm-bg-1: #fdfcfa;

  --prm-bg-2: #f8fafc;

  --prm-bg-3: #f0e9e1;

  --prm-line-0: rgba(15, 23, 42, 0.05);

  --prm-line-1: rgba(15, 23, 42, 0.09);

  --prm-line-2: rgba(15, 23, 42, 0.15);

  --prm-line-3: rgba(15, 23, 42, 0.24);

  /* 기존 구리(copper) 톤 → 클린 CTA/포인트 톤으로 재매핑 */

  --prm-copper: var(--c-cta-1);

  --prm-copper-h: var(--c-cta-2);

  --prm-copper-dark: #3448d1;

  --prm-copper-deep: #0f172a;

  --prm-sh-card: none;

  --prm-sh-hover: none;

  --prm-sh-sm: none;

  --prm-r-card: 20px;

  --prm-r-badge: 8px;

  --prm-r-pill: 999px;

  --prm-r-btn: 11px;

  --prm-p-xs: 4px;
  --prm-p-sm: 8px;
  --prm-p-md: 12px;

  --prm-p-lg: 16px;
  --prm-p-xl: 20px;
  --prm-p-2xl: 24px;
}

/* ── 진입 애니메이션 ──────────────────────────────────────── */

@keyframes prm-card-in {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.97);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.ub-board .mbb-gallery > li {
  animation: prm-card-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.ub-board .mbb-gallery > li:nth-child(1) {
  animation-delay: 0.03s;
}

.ub-board .mbb-gallery > li:nth-child(2) {
  animation-delay: 0.08s;
}

.ub-board .mbb-gallery > li:nth-child(3) {
  animation-delay: 0.13s;
}

.ub-board .mbb-gallery > li:nth-child(4) {
  animation-delay: 0.18s;
}

.ub-board .mbb-gallery > li:nth-child(5) {
  animation-delay: 0.22s;
}

.ub-board .mbb-gallery > li:nth-child(6) {
  animation-delay: 0.26s;
}

.ub-board .mbb-gallery > li:nth-child(7) {
  animation-delay: 0.29s;
}

.ub-board .mbb-gallery > li:nth-child(8) {
  animation-delay: 0.32s;
}

.ub-board .mbb-gallery > li:nth-child(n + 9) {
  animation-delay: 0.34s;
}

/* ── 카드 기본 ───────────────────────────────────────────── */

.ub-board .mbb-card {
  position: relative; /* 추천 리본 absolute 기준점 */

  border-radius: var(--prm-r-card);

  border: 1px solid var(--prm-line-1);

  box-shadow: none;

  background: var(--prm-bg-0);

  transition:
    box-shadow 0.36s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.36s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.22s ease;
}

.ub-board .mbb-card:hover {
  box-shadow: none;

  transform: translateY(-5px);

  border-color: var(--prm-line-2);
}

/* 추천 카드 */

.ub-board .mbb-card--pinned {
  border-color: rgba(97, 93, 250, 0.36);

  box-shadow: none;

  background-image: linear-gradient(
    180deg,
    rgba(255, 252, 247, 1) 0%,

    var(--prm-bg-0) 28%
  );
}

.ub-board .mbb-card--pinned:hover {
  border-color: rgba(97, 93, 250, 0.5);

  box-shadow: none;
}

/* ── 썸네일 비율 — 3:2 (더 시네마틱) ──────────────────── */

.ub-board a.mbb-card__thumb,
.ub-board .mbb-card__thumb--static {
  padding-bottom: 66.67% !important;
}

/* ── 썸네일 이미지 — 색감 강화 ─────────────────────────── */

.ub-board .mbb-card__thumb > img {
  filter: brightness(1.03) contrast(1.06) saturate(1.14);

  transition:
    transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.42s ease;
}

.ub-board .mbb-card:hover .mbb-card__thumb > img {
  transform: scale(1.05);

  filter: brightness(1.05) contrast(1.07) saturate(1.2);
}

/* 썸네일 그라데이션 오버레이 */

.ub-board a.mbb-card__thumb::after,
.ub-board .mbb-card__thumb--static::after {
  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(
    to bottom,

    rgba(15, 23, 42, 0.02) 0%,

    transparent 35%,

    rgba(15, 23, 42, 0.18) 68%,

    rgba(15, 23, 42, 0.45) 100%
  );

  pointer-events: none;

  z-index: 1;

  transition: opacity 0.36s ease;
}

.ub-board .mbb-card:hover a.mbb-card__thumb::after {
  opacity: 0.75;
}

/* ── 카테고리 뱃지 (← 핵심 액센트 포인트) ───────────────── */

.ub-board .mbb-card__category {
  background: linear-gradient(135deg, #adafca 0%, #312e81 100%);

  box-shadow: none;

  border-radius: var(--prm-r-badge);

  padding: 0.28rem 0.58rem;

  font-size: 0.6875rem;

  font-weight: 700;

  letter-spacing: 0.02em;

  z-index: 3;
}

/* ── 추천 뱃지 — 캡슐과 동일 크기·스타일로 통일 ─────────── */

/* ── 추천 리본 — card overflow:visible 덕분에 리본 완전 노출

   shimmer sweep + glow pulse 애니메이션

   ─────────────────────────────────────────────────────── */

.ub-board .mbb-card__badge--pinned {
  position: absolute !important;

  top: 0 !important;

  left: 10px !important;

  right: auto !important;

  display: inline-flex !important;

  align-items: center !important;

  gap: 4px !important;

  padding: 9px 12px 7px !important;

  border-radius: 0 0 14px 14px !important;

  font-size: 0.71rem !important;

  font-weight: 800 !important;

  letter-spacing: 0.06em !important;

  line-height: 1 !important;

  color: #fff !important;

  background: linear-gradient(
    180deg,
    #3e3f5e 0%,
    #5753e4 40%,
    #adafca 100%
  ) !important;

  border-left: 2px solid rgba(199, 210, 254, 0.5) !important;

  border-right: 2px solid rgba(199, 210, 254, 0.5) !important;

  border-top: none !important;

  border-bottom: none !important;

  box-shadow: none;

  z-index: 20 !important;

  overflow: hidden !important;

  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;

  animation: prm-pin-glow 2.4s ease-in-out infinite;
}

/* 광택 스윕 — 상단→하단 */

.ub-board .mbb-card__badge--pinned::before {
  content: "" !important;

  position: absolute !important;

  inset: 0 !important;

  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.42) 0%,

    transparent 60%
  ) !important;

  pointer-events: none !important;

  animation: prm-pin-sweep 2.4s ease-in-out infinite;
}

@keyframes prm-pin-glow {
  /* 입체적인 태그 그림자 — 좁고 강하게 */

  0%,
  100% {
    box-shadow: none;
  }

  50% {
    box-shadow: none;
  }
}

@keyframes prm-pin-sweep {
  0% {
    transform: translateY(-200%);
  }

  55%,
  100% {
    transform: translateY(200%);
  }
}

/* ── 국적 캡슐 — 이미지 좌하단 10px, 일반 pill 형태 ───── */

.ub-board .mbb-card__capsule--time {
  top: auto !important;

  bottom: 10px !important;

  left: 10px !important;

  right: auto !important;

  border-radius: 999px !important;

  padding: 4px 10px !important;

  font-size: 0.69rem !important;
}

/* NEW 뱃지 — 로즈(메인 인디고와 대비) */

.ub-board .mbb-card__badge--new {
  background: linear-gradient(135deg, #fb7185 0%, #e11d48 55%, #be123c 100%);

  box-shadow: none;

  border-radius: var(--prm-r-badge);
}

/* ── 캡슐 오버레이 — 글래스모피즘 ───────────────────────── */

.ub-board .mbb-card__capsule {
  background: rgba(15, 23, 42, 0.52);

  backdrop-filter: blur(10px) saturate(1.3);

  -webkit-backdrop-filter: blur(10px) saturate(1.3);

  border: none;

  border-radius: var(--prm-r-pill);

  padding: 4px 10px;

  font-size: 0.69rem;

  font-weight: 600;

  transition: background 0.2s ease;
}

/* ════════════════════════════════════════════════════════════

   ▶ 카드 패널 — CSS Grid 레이아웃

   흐름: 업체명 → 지역 → [별점 | 통계pills] → 가격 → 버튼

   ════════════════════════════════════════════════════════════ */

/* 패널: CSS grid로 각 행 위치 명시 */

.ub-board .mbb-card__panel {
  background: var(--prm-bg-0);

  padding: 14px 14px 12px;

  border-top: 1px solid var(--prm-line-0);

  display: grid;

  grid-template-columns: 1fr auto;

  grid-template-areas:
    "sitename  sitename"
    "region    region"
    "catline   catline"
    "rating    pills"
    "price     price"
    "rule      rule"
    "actions   actions";

  row-gap: 0;

  column-gap: 6px;
}

.ub-board .mbb-card__sitename {
  grid-area: sitename;
}

.ub-board .mbb-card__regionline {
  grid-area: region;
}

.ub-board .mbb-card__catline {
  grid-area: catline;
}

.ub-board .mbb-card__rating {
  grid-area: rating;
  align-self: center;
}

.ub-board .mbb-card__pills {
  grid-area: pills;
  align-self: center;
  justify-content: flex-end;
}

.ub-board .mbb-card__price {
  grid-area: price;
}

.ub-board .mbb-card__rule {
  grid-area: rule;
}

.ub-board .mbb-card__actions {
  grid-area: actions;
}

/* 업체명 행 — [분류 좌] ←→ [업체명 우] */

.ub-board .mbb-card__sitename {
  margin-bottom: 8px;
} /* 분류↔주소 여백 */

.ub-board .mbb-card__sitename-row {
  background: none !important;

  border: none !important;

  border-radius: 0 !important;

  padding: 0 !important;

  box-shadow: none !important;

  display: flex !important;

  align-items: center;

  justify-content: space-between !important;

  gap: 6px;

  width: 100%;
}

.ub-board .mbb-card__sitename-label {
  display: none !important;
}

/* 패널 내 카테고리 뱃지 */

.ub-board .mbb-card__category--panel {
  flex-shrink: 0;

  display: inline-flex;

  align-items: center;

  gap: 4px;

  padding: 3px 8px 3px 7px;

  font-size: 0.64rem;

  font-weight: 700;

  letter-spacing: 0.03em;

  border-radius: 99px;

  white-space: nowrap;

  position: static !important;

  top: auto !important;
  left: auto !important;
  bottom: auto !important;

  box-shadow: none !important;

  /* 기본 색 (코드 없을 때) */

  color: #5753e4;

  background: #eeecff;

  border: 1px solid #dedeea;
}

.ub-board .mbb-card__category--panel::before {
  content: "";

  display: inline-block;

  width: 5px;
  height: 5px;

  border-radius: 50%;

  flex-shrink: 0;

  background: currentColor;

  opacity: 0.7;

  animation: mbb-dot-ripple 1.8s ease-out infinite;
}

/* ── 분류별 개별 색상 (10가지 완전 구분) ──────────────── */

/* 아로마마사지 — 에메랄드 그린 */

.ub-board .mbb-cat--opt-aroma {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
}

/* 타이마사지  — 사프란 옐로 */

.ub-board .mbb-cat--opt-thai {
  color: #713f12;
  background: #fef9c3;
  border-color: #fde047;
}

/* 핫타이      — 딥 레드 */

.ub-board .mbb-cat--opt-hot-thai {
  color: #7f1d1d;
  background: #fee2e2;
  border-color: #fca5a5;
}

/* 스웨디시    — 코발트 블루 */

.ub-board .mbb-cat--opt-swedish {
  color: #1e3a8a;
  background: #dbeafe;
  border-color: #93c5fd;
}

/* 스포츠마사지 — 다크 슬레이트 (회색 계열) */

.ub-board .mbb-cat--opt-sports {
  color: #1e293b;
  background: #e2e8f0;
  border-color: #94a3b8;
}

/* 발마사지    — 오렌지 */

.ub-board .mbb-cat--opt-foot {
  color: #312e81;
  background: #eeecff;
  border-color: #adafca;
}

/* 1인샵       — 바이올렛 */

.ub-board .mbb-cat--opt-room-1 {
  color: #4c1d95;
  background: #eeecff;
  border-color: #c4b5fd;
}

/* 여성전용    — 후쿠시아 핑크 */

.ub-board .mbb-cat--opt-women-only {
  color: #831843;
  background: #fce7f3;
  border-color: #f9a8d4;
}

/* 왁싱        — 라임 그린 */

.ub-board .mbb-cat--opt-waxing {
  color: #365314;
  background: #ecfccb;
  border-color: #bef264;
}

/* 샤워실      — 틸 */

.ub-board .mbb-cat--opt-shower-room {
  color: #134e4a;
  background: #ccfbf1;
  border-color: #5eead4;
}

.ub-board .mbb-card__sitename-value {
  min-width: 0;

  display: block;

  text-align: right;

  font-size: 1rem;

  font-weight: 800;

  color: var(--prm-ink-100);

  letter-spacing: -0.035em;

  line-height: 1.3;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;
}

/* 지역 — 슬레이트 + 인디고 핀 */

.ub-board .mbb-card__regionline {
  display: flex;

  align-items: center;

  gap: 4px;

  color: #64748b;

  font-size: 0.72rem;

  font-weight: 500;

  margin-bottom: 7px;
}

.ub-board .mbb-card__regionline .sk-ico {
  color: #6366f1;

  opacity: 0.88;

  font-size: 0.68rem;

  flex-shrink: 0;
}

/* 카테고리 pill */

.ub-board .mbb-card__catpill {
  background: var(--prm-bg-2);

  border: 1px solid var(--prm-line-1);

  color: var(--prm-ink-60);

  font-size: 0.68rem;

  font-weight: 600;

  padding: 2px 8px;

  border-radius: 99px;

  letter-spacing: 0.02em;
}

/* 평점 — 레이블 숨기고 별+점수만 컴팩트하게 */

.ub-board .mbb-card__rating {
  display: flex;

  align-items: center;

  gap: 4px;

  margin-bottom: 7px;
}

.ub-board .mbb-card__rating-label {
  display: none;
}

.ub-board .mbb-card__rating-right {
  display: flex;

  align-items: center;

  gap: 5px;
}

.ub-board .mbb-card__stars .sk-ico {
  font-size: 0.7rem;
  letter-spacing: 0.3px;
}

.ub-board .mbb-card__stars .mbb-star--on {
  color: #d97706;
}

.ub-board .mbb-card__stars .mbb-star--off {
  color: var(--prm-ink-20);
}

.ub-board .mbb-card__score {
  font-size: 0.78rem;

  font-weight: 700;

  color: var(--prm-ink-80);
}

/* 통계 pills — 오른쪽 정렬, rating과 같은 행 */

.ub-board .mbb-card__pills {
  display: flex;

  flex-wrap: nowrap;

  gap: 4px;

  margin-bottom: 7px;
}

.ub-board .mbb-card__pill {
  display: inline-flex;

  align-items: center;

  gap: 3px;

  padding: 0.2rem 0.44rem;

  font-size: 0.66rem;

  font-weight: 600;

  border-radius: 99px;

  border: 1px solid var(--prm-line-1);

  background: var(--prm-bg-2);

  color: var(--prm-ink-60);

  white-space: nowrap;
}

.ub-board .mbb-card__pill .sk-ico {
  color: var(--prm-ink-40);
  font-size: 0.63rem;
}

.ub-board .mbb-card__pill--comment {
  background: var(--prm-bg-2); /* 브라운 제거 → 뉴트럴 */

  border-color: var(--prm-line-1);

  color: var(--prm-ink-60);
}

.ub-board .mbb-card__pill--comment .sk-ico {
  color: var(--prm-ink-40);
}

.ub-board .mbb-card__pill--good {
  background: #eaf5ee;
  border-color: #b7dec9;
  color: #2d6a4f;
}

.ub-board .mbb-card__pill--good .sk-ico {
  color: #2d6a4f;
}

.ub-board .mbb-card__pill--nogood {
  background: #fae8e8;
  border-color: #f0b8b8;
  color: #9b3a3a;
}

.ub-board .mbb-card__pill--nogood .sk-ico {
  color: #9b3a3a;
}

.ub-board .mbb-card__pill--hit {
  background: var(--prm-bg-2);
  border-color: var(--prm-line-1);
  color: var(--prm-ink-60);
}

.ub-board .mbb-card__pill--opt {
  background: rgba(97, 93, 250, 0.09);
  border-color: rgba(97, 93, 250, 0.22);
  color: var(--prm-copper-dark);
}

/* 가격 — 풀 바, 왼쪽 레이블 / 오른쪽 금액 */

.ub-board .mbb-card__price {
  display: flex;

  align-items: baseline;

  justify-content: space-between;

  gap: 4px;

  background: var(--prm-bg-2);

  border: 1px solid var(--prm-line-1);

  border-radius: 9px;

  padding: 7px 10px;

  margin-bottom: 8px;

  transition: background 0.2s ease;
}

.ub-board .mbb-card:hover .mbb-card__price {
  background: var(--prm-bg-3);
}

.ub-board .mbb-card__price-label {
  color: var(--prm-ink-40);

  font-size: 0.68rem;

  font-weight: 600;

  letter-spacing: 0.03em;

  white-space: nowrap;
}

.ub-board .mbb-card__price-value {
  font-size: 1.0625rem;

  font-weight: 900;

  color: var(--prm-ink-100);

  letter-spacing: -0.04em;

  line-height: 1;
}

/* 구분선 */

.ub-board .mbb-card__rule {
  background: var(--prm-line-0);

  margin: 0 0 7px;

  height: 1px;
}

/* 버튼 — 2열 전체 너비 */

.ub-board .mbb-card__actions {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 6px;
}

.ub-board .mbb-card__btn {
  border-radius: var(--prm-r-btn);

  min-height: 40px;

  font-size: 0.8rem;

  font-weight: 700;

  letter-spacing: 0.02em;

  transition:
    background 0.22s ease,
    box-shadow 0.22s ease,
    border-color 0.22s ease,
    transform 0.14s ease;
}

.ub-board .mbb-card__btn:active {
  transform: scale(0.96);
}

/* 상세보기 */

.ub-board .mbb-card__btn--ghost {
  background: var(--prm-bg-2);

  border: 1px solid var(--prm-line-2);

  color: var(--prm-ink-60);
}

.ub-board .mbb-card__btn--ghost:hover {
  background: var(--prm-bg-3);

  border-color: var(--prm-line-3);

  color: var(--prm-ink-80);
}

.ub-board .mbb-card__btn--ghost .mbb-card__btn-ico {
  border-left-color: var(--prm-line-2);

  background: transparent;
}

/* 리뷰보기 — 핵심 copper CTA */

.ub-board .mbb-card__btn--primary {
  background: linear-gradient(135deg, #adafca 0%, #312e81 100%);

  border-color: transparent;

  color: #fff;

  box-shadow: none;
}

.ub-board .mbb-card__btn--primary:hover {
  background: linear-gradient(135deg, #d4a570 0%, #9b7354 100%);

  box-shadow: none;
}

.ub-board .mbb-card__btn--primary .mbb-card__btn-ico {
  border-left-color: rgba(255, 255, 255, 0.22);

  background: transparent;
}

/* ── 갤러리 그리드 패딩·간격 ─────────────────────────────── */

.ub-board .mbb-gallery {
  gap: var(--prm-p-lg);
}

@media (min-width: 576px) {
  .ub-board .mbb-gallery {
    gap: 1.1rem;
  }
}

@media (min-width: 1200px) {
  .ub-board .mbb-gallery {
    gap: 1.3rem;
  }
}

/* ── 지역 필터 ───────────────────────────────────────────── */

.ub-board .mbg-widget-region-filter-wrap.mbg-rf {
  margin-bottom: 1.25rem;
}

.ub-board .mbg-widget-region-filter-wrap.mbg-rf::before {
  background: rgba(255, 255, 255, 0.96);

  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  border: 1px solid var(--prm-line-1);

  box-shadow: none;

  border-radius: 14px;
}

.ub-board .mbg-rf__head-kicker {
  background: linear-gradient(135deg, #adafca 0%, #312e81 100%);

  color: #fff;
  border: none;

  box-shadow: none;
}

.ub-board .mbg-rf__head-title {
  color: var(--prm-ink-80);
}

.ub-board .mbg-rf__head-desc {
  color: var(--prm-ink-40);
}

/* ── 뷰 페이지 히어로 이미지 ─────────────────────────────── */

.ub-board .uv-mbb-hero__media img {
  filter: brightness(1.04) contrast(1.07) saturate(1.16) !important;

  transition: filter 0.4s ease !important;
}

.ub-board .uv-mbb-hero__media::after {
  content: "";

  position: absolute;
  inset: 0;

  background:
    radial-gradient(
      ellipse at 50% 50%,
      transparent 52%,
      rgba(15, 23, 42, 0.22) 100%
    ),
    linear-gradient(to bottom, transparent 55%, rgba(15, 23, 42, 0.18) 100%);

  border-radius: inherit;

  pointer-events: none;

  z-index: 1;
}

/* ── 뷰 상세 정보 카드 ───────────────────────────────────── */

.ub-board .uv-mbb-hero-info-card {
  border-color: var(--prm-line-1) !important;

  box-shadow: none;
}

.ub-board .uv-mbb-info-table th {
  background: var(--prm-bg-2);

  color: var(--prm-ink-60);

  font-size: 0.8125rem;
}

.ub-board .uv-mbb-info-table td {
  color: var(--prm-ink-80);
}

.ub-board .uv-mbb-info-table tr:not(:last-child) th,
.ub-board .uv-mbb-info-table tr:not(:last-child) td {
  border-bottom-color: var(--prm-line-0);
}

/* 전화 문의 버튼 */

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn--call {
  background: linear-gradient(
    135deg,
    #6366f1 0%,
    #4f46e5 55%,
    #4338ca 100%
  ) !important;

  border-color: transparent !important;

  color: #fff !important;

  box-shadow: none;

  transition:
    box-shadow 0.22s ease,
    filter 0.22s ease,
    transform 0.14s ease !important;
}

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn--call:hover {
  filter: brightness(1.06) !important;

  box-shadow: none;
}

.ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn--call:active {
  transform: scale(0.97) !important;
}

.ub-board
  .uv-mbb-hero__cta
  > .ub-btn.uv-mbb-contact-strip__btn:not(.uv-mbb-contact-strip__btn--call) {
  background: #eef2ff !important;

  border: 1px solid rgba(79, 70, 229, 0.22) !important;

  color: #3e3f5e !important;

  box-shadow: none !important;

  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease !important;
}

.ub-board
  .uv-mbb-hero__cta
  > .ub-btn.uv-mbb-contact-strip__btn:not(
    .uv-mbb-contact-strip__btn--call
  ):hover {
  background: #e0e7ff !important;

  border-color: rgba(79, 70, 229, 0.38) !important;

  color: #4338ca !important;
}

/* 코스안내 헤더: prm 크림/브라운 덮어쓰기 방지 — 인디고 고정 */

.ub-board .uv-mbb-course-head {
  background: linear-gradient(
    165deg,
    #ffffff 0%,
    #f5f7ff 48%,
    #eef2ff 100%
  ) !important;

  border-color: rgba(79, 70, 229, 0.14) !important;

  box-shadow: none;
}

.ub-board .uv-mbb-course-head__rail {
  background: linear-gradient(
    180deg,
    #a5b4fc 0%,
    #6366f1 42%,
    #4338ca 100%
  ) !important;
}

/* ── 국적 캡슐 색상 ───────────────────────────────────────── */

.ub-board .mbb-card__capsule--nation-kor {
  background: linear-gradient(165deg, #615dfa 0%, #615dfa 52%, #312e81 100%);
}

.ub-board .mbb-card__capsule--nation-tha {
  background: linear-gradient(165deg, #1a9e52 0%, #0d7a3e 52%, #0a5f32 100%);
}

.ub-board .mbb-card__capsule--nation-chn {
  background: linear-gradient(165deg, #38bdf8 0%, #0369a1 52%, #0c4a6e 100%);
}

.ub-board .mbb-card__capsule--nation-rus {
  background: linear-gradient(165deg, #a78bfa 0%, #6d28d9 52%, #4c1d95 100%);
}

/* ════════════════════════════════════════════════════════════

   ▶ 페이지네이션 — 프리미엄 리디자인

   ════════════════════════════════════════════════════════════ */

.ub-board .ub-pagination,
.ub-board .pagination {
  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  gap: 5px;

  list-style: none;

  margin: 28px 0 8px;

  padding: 0;
}

.ub-board .ub-pagination__item,
.ub-board .pagination .page-item {
  display: inline-block;
}

.ub-board .ub-pagination__link,
.ub-board .pagination .page-link {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 38px;

  height: 38px;

  padding: 0 10px;

  font-size: 0.8375rem;

  font-weight: 600;

  color: var(--prm-ink-60);

  text-decoration: none;

  background: var(--prm-bg-0);

  border: 1px solid var(--prm-line-2);

  border-radius: 10px;

  transition:
    background 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.12s ease;

  letter-spacing: 0.01em;
}

.ub-board .ub-pagination__link:hover,
.ub-board .pagination .page-link:hover {
  background: #eeecff;

  border-color: rgb(199 210 254 / 90%);

  color: var(--c-primary-h);

  box-shadow: none;

  transform: translateY(-1px);
}

.ub-board .ub-pagination__link.is-active,
.ub-board .pagination .page-item.active .page-link {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 52%, #4338ca 100%);

  border-color: transparent;

  color: #fff;

  font-weight: 700;

  box-shadow: none;

  transform: none;
}

/* 이전·다음 화살표 버튼 */

.ub-board .ub-pagination__link[rel="prev"],
.ub-board .ub-pagination__link[rel="next"],
.ub-board .pagination .page-item:first-child .page-link,
.ub-board .pagination .page-item:last-child .page-link {
  min-width: 38px;

  font-size: 0.8rem;

  background: #f8fafc;
}

/* ════════════════════════════════════════════════════════════

   ▶ 모바일 최적화

   ════════════════════════════════════════════════════════════ */

@media (max-width: 374px) {
  .ub-board .mbb-gallery {
    grid-template-columns: 1fr;

    gap: var(--prm-p-sm);
  }

  .ub-board .mbb-card__panel {
    padding: 10px 10px 8px;
  }

  .ub-board .mbb-card__sitename-value {
    font-size: 0.9rem;
  }
}

@media (max-width: 575.98px) {
  .ub-board .mbb-gallery {
    gap: 10px;
  }

  .ub-board .mbb-card__panel {
    padding: 11px 11px 9px;
  }

  .ub-board .mbb-card__sitename-value {
    font-size: 0.9375rem;
  }

  .ub-board .mbb-card__btn {
    min-height: 42px;
    font-size: 0.8125rem;
  }

  .ub-board .mbb-card__actions .mbb-card__btn-ico {
    display: none !important;
  }

  .ub-board .mbb-card__actions .mbb-card__btn-txt {
    padding: 0 0.5rem;
  }

  .ub-board .mbb-card__price-value {
    font-size: 1rem;
  }

  .ub-board .mbb-card__pill {
    padding: 0.2rem 0.44rem;
    font-size: 0.65rem;
  }

  .ub-board .mbb-card__pills {
    gap: 3px;
    margin-bottom: 7px;
  }

  .ub-board .mbg-widget-region-filter-wrap.mbg-rf .mbg-rf__form {
    padding: 0.85rem 0.85rem 0.9rem;
  }

  .ub-board .mbg-rf__head {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
  }

  .ub-board .mbg-rf__head-title {
    font-size: 0.9375rem;
  }

  .ub-board .mbg-rf__head-desc {
    font-size: 0.75rem;
  }

  .ub-board .mbb-card:hover {
    transform: none;
  }

  .ub-board .uv-mbb-hero__cta > .ub-btn.uv-mbb-contact-strip__btn {
    min-height: 50px;
    font-size: 0.9375rem;
    border-radius: 12px;
  }

  .ub-board .ub-pagination__link,
  .ub-board .pagination .page-link {
    min-width: 34px;
    height: 34px;
    font-size: 0.8rem;
    border-radius: 8px;
  }
}

@media (max-width: 767.98px) {
  .ub-board .mbb-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: var(--prm-p-md);
  }

  .ub-board .mbb-card__actions {
    gap: 5px;
  }
}

/* ════════════════════════════════════════════════════════════

   ▶ 최종 오버라이드(브라운 완전 제거)

   - LUXURY(prm) 토큰의 웜톤 잔존을 마지막에 쿨톤으로 강제

   - 글쓰기/뷰/목록 공통으로 브라운이 다시 올라오는 문제 방지

   ════════════════════════════════════════════════════════════ */

.ub-board {
  --prm-ink-100: #0f172a;

  --prm-ink-80: #1e293b;

  --prm-ink-60: #475569;

  --prm-ink-40: #94a3b8;

  --prm-ink-20: #cbd5e1;

  --prm-bg-0: #ffffff;

  --prm-bg-1: #ffffff;

  --prm-bg-2: #f8fafc;

  --prm-bg-3: #eeecff;

  --prm-line-0: rgb(15 23 42 / 5%);

  --prm-line-1: rgb(15 23 42 / 8%);

  --prm-line-2: rgb(15 23 42 / 14%);

  --prm-line-3: rgb(15 23 42 / 22%);

  /* 기존 copper(구리) 토큰도 인디고 계열로 재매핑 */

  --prm-copper: var(--c-cta-1);

  --prm-copper-h: var(--c-cta-2);

  --prm-copper-dark: var(--c-primary-h);

  --prm-copper-deep: #0f172a;

  --prm-sh-card: none;

  --prm-sh-hover: none;

  --prm-sh-sm: none;
}

/* ─────────────────────────────────────────
   UJB: 구인구직 목록 — 플랫 리스트 (카드/그리드 없음)
   - list.skin.php: .ublist-body.ujb-joblist > .ujb-job
───────────────────────────────────────── */

.ub-board .ublist-body.ujb-joblist,
.ub-board .ublist-body.ujb-webzine {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ub-board .ujb-job {
  margin: 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid rgb(15 23 42 / 7%);
}

.ub-board .ujb-job:last-child {
  border-bottom: 0;
}

.ub-board .ujb-job.ubr--notice {
  background: rgb(238 242 255 / 40%);
}

.ub-board .ujb-job.ubr--current {
  background: rgb(238 236 255 / 28%);
}

.ub-board .ujb-job__inner {
  padding: 16px 24px;
  margin: 0 auto;
}

.ub-board .ujb-job__row--top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.ub-board .ujb-job__col--main {
  flex: 1;
  min-width: 0;
}

.ub-board .ujb-job__col--aside {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  min-width: 120px;
}

.ub-board .ujb-job__admin {
  margin-bottom: 6px;
}

.ub-board .ujb-job__titleline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  line-height: 1.45;
}

/* 구인/구직 — 오렌지 계열 소형 뱃지 */
.ub-board .ujb-job__type {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 0 7px;
  border-radius: 6px;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  border: 1px solid rgb(234 88 12 / 32%);
  background: rgb(255 247 237);
  color: #c2410c;
}

.ub-board .ujb-job__type--seek {
  /* 구직: 연두 계열로 확실히 구분 */
  border-color: rgb(34 197 94 / 28%);
  background: rgb(236 253 245);
  color: #047857;
}

.ub-board .ujb-job__pill {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 6px;
  border-radius: 4px;
  font-size: 0.65rem;
  font-weight: 800;
}

.ub-board .ujb-job__pill--notice {
  background: #312e81;
  color: #eef2ff;
}

.ub-board .ujb-job__pill--current {
  background: #4f46e5;
  color: #ffffff;
}

.ub-board .ujb-job__subject {
  flex: 1;
  min-width: 140px;
  font-size: 0.9375rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
  text-decoration: none;
}

.ub-board .ujb-job__subject:hover {
  color: var(--c-primary-h, #4f46e5);
}

/* 상세: 한 줄 느낌 + 구분점 */
.ub-board .ujb-job__meta {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.5;
}

.ub-board .ujb-job__meta > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ub-board .ujb-job__meta i.sk-ico {
  width: 14px;
  text-align: center;
  /* 뷰페이지(.ujb-meta .sk-ico)와 동일 인디고 톤 */
  color: #6366f1;
  flex: 0 0 auto;
}

.ub-board .ujb-job__meta > span + span::before {
  content: "·";
  margin: 0px;
  color: rgb(15 23 42 / 22%);
  font-weight: 700;
}

/* 상태: 구인(모집중)=오렌지, 구직중=연두 */
.ub-board .ujb-job__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 800;
  text-decoration: none;
  /* 기본: 구인 모집중(오렌지 톤) */
  border: 1px solid rgb(234 88 12 / 26%);
  background: rgb(255 247 237);
  color: #c2410c;
}

.ub-board .ujb-job__status--open:hover {
  background: rgb(255 237 213);
  border-color: rgb(234 88 12 / 34%);
}

/* 구직중: 모집중과 색 분리(연두 톤) */
.ub-board .ujb-job__status--open.ujb-job__status--seek {
  border-color: rgb(34 197 94 / 26%);
  background: rgb(236 253 245 / 85%);
  color: #047857;
}

.ub-board .ujb-job__status--open.ujb-job__status--seek:hover {
  background: rgb(236 253 245);
  border-color: rgb(34 197 94 / 34%);
}

.ub-board .ujb-job__status--negotiating {
  border-color: rgb(217 119 6 / 28%);
  background: rgb(255 251 235 / 85%);
  color: #b45309;
}

.ub-board .ujb-job__status--closed {
  border-color: rgb(15 23 42 / 8%);
  background: #f8fafc;
  color: #94a3b8;
}

.ub-board .ujb-job__num {
  font-size: 0.6875rem;
  font-weight: 700;
  color: #94a3b8;
  line-height: 1.2;
}

.ub-board .ujb-job__chk input {
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
}

/* 선택(체크삭제 등): 구인 뱃지 앞 */
.ub-board .ujb-job__chk--lead {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  margin-right: 4px;
}

/* 본문 요약 + 작성자 (구분선) */
.ub-board .ujb-job__row--bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 0;
}

.ub-board .ujb-job--has-excerpt .ujb-job__row--bottom {
  border-top: 1px solid rgb(15 23 42 / 6%);
  margin-top: 10px;
  padding-top: 10px;
}

.ub-board .ujb-job:not(.ujb-job--has-excerpt) .ujb-job__row--bottom {
  margin-top: 8px;
  padding-top: 0;
}

.ub-board .ujb-job__excerpt {
  flex: 1;
  min-width: 0;
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ub-board .ujb-job__excerpt:empty {
  /* 요약이 비어도 우측 작성자 정렬 유지 */
  display: block;
  min-height: 1px;
}

.ub-board .ujb-job__author {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;
  color: #475569;
  font-weight: 600;
  gap: 10px; /* 레벨아이콘 ↔ 닉네임 간격 */
  margin-left: auto; /* 항상 오른쪽 끝으로 */
}

.ub-board .ujb-job__time {
  color: #94a3b8;
  font-weight: 600;
  font-size: 0.75rem;
  white-space: nowrap;
}

.ub-board .ujb-job__author a,
.ub-board .ujb-job__author span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

@media (max-width: 1199.98px) {
  .ub-board .ujb-job__inner {
    max-width: 100%;
    padding: 16px 18px;
  }
}

@media (max-width: 575.98px) {
  .ub-board .ujb-job__inner {
    padding: 14px 14px;
  }

  .ub-board .ujb-job__meta > span {
    gap: 0px;
  }

  .ub-board .ujb-job__row--top {
    /* 모바일 상단: 좌(제목) / 우(모집중) 한 줄 정렬 */
    flex-direction: row;
    align-items: center;
    gap: 12px;
  }

  .ub-board .ujb-job__col--aside {
    width: auto;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    align-self: auto;
  }

  /* 모바일에서 제목/메타를 한 덩어리로 정렬 */
  .ub-board .ujb-job__titleline {
    align-items: center;
  }

  .ub-board .ujb-job__subject {
    min-width: 0;
  }

  .ub-board .ujb-job__row--bottom {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  /* 모바일 하단: 본문(좌) + 작성자(우) 수평 정렬 */
  .ub-board .ujb-job__row--bottom {
    flex-direction: row;
    align-items: center;
  }

  .ub-board .ujb-job__excerpt {
    -webkit-line-clamp: 1;
  }

  .ub-board .ujb-job__author {
    justify-content: flex-end;
  }
}