/* 기능 UI — 디자인 토큰 위 동작 레이어 */
.page-live{
  /* 원본 1080 기준 좌우 97.5px */
  padding:
    calc(40 / 1080 * min(100vw, var(--design-max, 480px)))
    calc(97.5 / 1080 * min(100vw, var(--design-max, 480px)))
    calc(80 / 1080 * min(100vw, var(--design-max, 480px)));
  color: var(--color-text, #3f3a3b);
  font-family: 'Wanted Sans', system-ui, sans-serif;
  line-height: 1.45;
}
.page-live h1,
.page-live h2{ margin: 0; font-weight: 700; letter-spacing: -.02em; }
.live-title{
  margin: 0 0 calc(18 / 1080 * min(100vw, var(--design-max, 480px)));
  color: #3f3a3b;
  font-size: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  line-height: 1.25;
}
.live-title strong{
  font-size: calc(65 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
}
.live-caption{
  text-align: center;
  font-size: calc(35 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  color: #3f3a3b;
  margin: 0 0 calc(18 / 1080 * min(100vw, var(--design-max, 480px)));
}
.live-notice{
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fdecea;
  color: #7a4438;
  border-radius: 999px;
  padding: 10px 14px;
  font-size: .82rem;
  margin-bottom: 16px;
}
.live-notice b{ color: var(--color-primary); white-space: nowrap; }

.stamp-board-live{
  width: 100%;
  aspect-ratio: 885 / 400;
  background: #2f8463;
  border-radius: calc(30 / 1080 * min(100vw, var(--design-max, 480px)));
  box-sizing: border-box;
  padding:
    calc(122 / 1080 * min(100vw, var(--design-max, 480px)))
    calc(131.58 / 1080 * min(100vw, var(--design-max, 480px)));
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(2, minmax(0, 1fr));
  column-gap: calc(26.44 / 1080 * min(100vw, var(--design-max, 480px)));
  row-gap: calc(25.93 / 1080 * min(100vw, var(--design-max, 480px)));
  margin: 0 0 calc(20 / 1080 * min(100vw, var(--design-max, 480px)));
}
.stamp-cell-live{
  position: relative;
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stamp-cell-live .stamp-slot-bg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.stamp-cell-live.is-empty{
  opacity: .2;
}
.stamp-cell-live.is-done{
  opacity: 1;
}
.stamp-cell-live .num{
  position: relative;
  z-index: 1;
  color: #fff;
  font-weight: 600;
  font-size: calc(25 / 1080 * min(100vw, var(--design-max, 480px)));
  line-height: 1;
}
.stamp-cell-live .ico{
  position: relative;
  z-index: 1;
  width: 56%;
  height: 56%;
  object-fit: contain;
}

.live-actions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(19 / 885 * 100%);
  margin: 0 0 calc(24 / 1080 * min(100vw, var(--design-max, 480px)));
}

/* 배너구좌 — 가로 스와이프 슬라이드 (업로드 이미지 비율 유지) */
.banner-live{
  position: relative;
  width: 100%;
  height: auto;
  border-radius: calc(30 / 1080 * min(100vw, var(--design-max, 480px)));
  overflow: hidden;
  background: #e8e8e8;
  margin: 0 0 18px;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
  cursor: grab;
}
.banner-live.is-dragging{
  cursor: grabbing;
}
.banner-live-track{
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  transform: translate3d(0, 0, 0);
  transition: transform .4s cubic-bezier(.22, .8, .28, 1);
  will-change: transform;
}
.banner-live.is-dragging .banner-live-track{
  transition: none;
}
.banner-live-slide{
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
  height: auto;
  pointer-events: auto;
  align-self: flex-start;
}
.banner-live-slide a{
  display: block;
  width: 100%;
  line-height: 0;
}
.banner-live-slide img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
}
.banner-live-count{
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  min-width: 52px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(70,70,70,.55);
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.4;
  pointer-events: none;
}
.live-actions a,
.live-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: calc(96 / 1080 * min(100vw, var(--design-max, 480px)));
  padding: 10px 8px;
  border: 2px solid #bfbdbe;
  border-radius: calc(20 / 1080 * min(100vw, var(--design-max, 480px)));
  background: #fff;
  color: #3f3a3b;
  font-size: calc(35 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.live-btn.primary{
  background: var(--btn-primary-bg);
  border-color: var(--btn-primary-bg);
  color: #fff;
}
.live-btn:disabled,
.live-btn.is-disabled{
  opacity: .55;
  pointer-events: none;
}

.search-live{
  position: relative;
  display: block;
  width: 100%;
  height: calc(110.32 / 1080 * min(100vw, var(--design-max, 480px)));
  min-height: 44px;
  border: 2px solid #bfbdbe;
  border-radius: calc(55.16 / 1080 * min(100vw, var(--design-max, 480px)));
  margin-bottom: calc(18 / 1080 * min(100vw, var(--design-max, 480px)));
  box-sizing: border-box;
  background: #fff;
}
.search-live input{
  position: absolute;
  left: calc(98.32 / 1080 * min(100vw, var(--design-max, 480px)));
  right: calc(130 / 1080 * min(100vw, var(--design-max, 480px)));
  top: 0;
  bottom: 0;
  border: 0;
  outline: 0;
  font-size: max(16px, calc(35 / 1080 * min(100vw, var(--design-max, 480px))));
  font-weight: 500;
  color: #3f3a3b;
  background: transparent;
  min-width: 0;
  padding: 0;
}
.search-live input::placeholder{
  color: #3f3a3b;
  opacity: 1;
}
.search-live button{
  position: absolute;
  top: 50%;
  right: calc(72 / 1080 * min(100vw, var(--design-max, 480px)));
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  padding: 0;
  width: calc(39.2 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(39.2 / 1080 * min(100vw, var(--design-max, 480px)));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 0;
}
.search-live-icon{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.list-head-live{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.list-head-live h2{
  font-size: calc(45 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
}
.filter-live{
  display: inline-flex;
  background: #f0f0f0;
  border-radius: 999px;
  padding: 3px;
}
.filter-live button{
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: .78rem;
  font-weight: 700;
  color: #555;
  cursor: pointer;
}
.filter-live button.is-on{
  background: var(--color-primary);
  color: #fff;
}
.list-head-live__tools{
  display: flex;
  align-items: center;
  gap: 8px;
}
.filter-liked{
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  padding: 2px;
  margin: 0;
  cursor: pointer;
  line-height: 0;
}
.filter-liked__icon{
  display: block;
  width: calc(52 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(52 / 1080 * min(100vw, var(--design-max, 480px)));
  min-width: 22px;
  min-height: 22px;
  background: url('../images/common/heart-off.png') center / contain no-repeat;
}
.filter-liked.is-on .filter-liked__icon{
  background-image: url('../images/common/heart-on.png');
}
.biz-liked-empty{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  margin: 8px 0 16px;
  padding: 0 16px;
  text-align: center;
  color: #8a8686;
  font-size: calc(28 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.4;
}
.biz-liked-empty[hidden]{
  display: none !important;
}

.biz-grid-live{
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* 원본: 카드 간격 45px — 가로는 그리드폭 비율, 세로는 고정 px(높이 % 사용 시 줄마다 달라짐) */
  column-gap: calc(45 / 885 * 100%);
  row-gap: calc(45 / 1080 * min(100vw, var(--design-max, 480px)));
}
.home-partners-list{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  overflow: visible;
}
.home-partners-list > .biz-grid-live{
  flex: 0 0 auto;
}
.biz-card-live{
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  /* 카드 clip: 420 x 460, rx=30 */
  aspect-ratio: 420 / 460;
  border-radius: calc(30 / 1080 * min(100vw, var(--design-max, 480px)));
  overflow: hidden;
  background: #fff;
  border: 1px solid #eee;
}
.biz-card-live .biz-photo{
  position: relative;
  /* 원본 이미지 영역: 420.28 x 389.44 → 카드 높이비 389.44/460 */
  flex: 389.44 1 0;
  min-height: 0;
  background: #f3f3f3 center/cover no-repeat;
}
.biz-card-live .biz-photo::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: calc(178.16 / 389.44 * 100%);
  background: linear-gradient(180deg, rgba(4,0,0,.8) 0%, rgba(4,0,0,0) 100%);
  pointer-events: none;
  z-index: 1;
}
.biz-card-live .biz-name{
  position: absolute;
  left: 9.38%;
  right: 9.38%;
  top: calc(79 / 389.44 * 100%);
  z-index: 3;
  margin: 0;
  color: #fff;
  font-weight: 600;
  font-size: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  line-height: 1.2;
  text-shadow: 0 0 10px rgba(4,0,0,.85);
  white-space: pre-line;
  transform: translateY(-50%);
}
.biz-card-live .biz-dim{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 2;
}
.biz-card-live .biz-center{
  position: absolute;
  left: 8%;
  right: 8%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  text-align: center;
}
.biz-card-live .biz-status{
  display: inline-block;
  background: var(--color-primary, #ec6d56);
  color: #fff;
  font-weight: 700;
  font-size: .82rem;
  border-radius: 999px;
  padding: 8px 22px;
  white-space: nowrap;
}
.biz-card-live .biz-hours{
  display: block;
  margin-top: 8px;
  color: #fff;
  font-size: .68rem;
  font-weight: 600;
  text-shadow: 0 1px 3px rgba(0,0,0,.4);
}
.biz-card-live .biz-footer{
  position: relative;
  display: flex;
  align-items: center;
  /* 원본 하단바: 420 x 71 → 카드 높이비 71/460 */
  flex: 71 0 0;
  min-height: 0;
  background: var(--color-primary, #ec6d56);
  color: #fff;
  padding: 0 9.58%;
  font-size: calc(30 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  box-sizing: border-box;
}
.biz-card-live .biz-heart{
  position: absolute;
  top: 50%;
  right: 9.58%;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  font-size: 0;
  line-height: 0;
}
.biz-card-live .biz-heart__icon{
  display: block;
  width: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  min-width: 18px;
  min-height: 18px;
  background: url('../images/common/heart-off.svg') center / contain no-repeat;
}
.biz-card-live .biz-heart.is-on .biz-heart__icon{
  background-image: url('../images/common/heart-on.svg');
}
.biz-card-live .biz-heart.is-busy{
  opacity: .6;
  pointer-events: none;
}

/* 업체 리스트 페이지네이션 — 목록 그리드 바로 다음(일반 흐름) */
.biz-pager-live{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  max-width: 100%;
  margin: calc(28 / 1080 * min(100vw, var(--design-max, 480px))) auto 0;
  padding: 0 calc(16 / 1080 * min(100vw, var(--design-max, 480px))) calc(12 / 1080 * min(100vw, var(--design-max, 480px)));
  box-sizing: border-box;
  gap: calc(24 / 1080 * min(100vw, var(--design-max, 480px)));
  overflow: visible;
}
.biz-pager-live[hidden]{ display: none !important; }
.biz-pager-btn{
  flex: 0 0 auto;
  flex-shrink: 0;
  width: calc(86.24 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(86.24 / 1080 * min(100vw, var(--design-max, 480px)));
  min-width: 34px;
  min-height: 34px;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: pointer;
  line-height: 0;
  overflow: visible;
}
.biz-pager-btn svg{
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.biz-pager-btn:disabled{
  opacity: .35;
  cursor: default;
}
.biz-pager-num{
  flex: 0 0 auto;
  flex-shrink: 0;
  margin: 0;
  padding: 0 .1em;
  font-size: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  color: #7f7c7c;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.biz-pager-num #bizPagerCurrent{
  color: #ec6d56;
}
.biz-pager-slash{
  margin: 0 .15em;
}

/* 하단 사업자/재단 정보 — 원본 (페이지와 분리) */
.site-foot-live{
  display: block;
  text-align: center;
  font-size: .72rem;
  color: #9a9797;
  line-height: 1.7;
  padding: 28px 16px 32px;
  margin: 0;
  margin-top: auto;
  position: relative;
  z-index: 0;
  clear: both;
  background: #fff;
  flex-shrink: 0;
}
.site-foot-live p{ margin: 0; }
/* 페이지네이션이 없을 때도 목록과 간격 유지 */
.home-partners-list + .site-foot-live,
.biz-grid-live + .site-foot-live{
  padding-top: 36px;
}

/* 맨 위로 — 원본 플로팅 버튼 */
.scroll-top-live{
  position: fixed;
  z-index: 280;
  right: max(12px, calc(50% - var(--design-max, 480px) / 2 + 12px));
  bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom, 0) + 16px);
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 50%;
  background: var(--color-primary, #ec6d56);
  color: #fff;
  font-size: 1.25rem;
  line-height: 1;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
}
.scroll-top-live.is-show{ display: inline-flex; }

/* 상세 */
.page-header-live{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 12px 16px 14px;
  border-bottom: 1px solid #eee;
}
.page-header-live--store{
  border-bottom: 0;
  padding: calc(40 / 1080 * min(100vw, var(--design-max, 480px))) 16px calc(18 / 1080 * min(100vw, var(--design-max, 480px)));
}
.page-header-live .back{
  position: absolute;
  left: 12px;
  border: 0;
  background: none;
  font-size: 1.4rem;
  color: #8b8b8b;
  text-decoration: none;
  line-height: 1;
  padding: 4px 8px;
}
.page-header-live .tt{
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: #b7b7b7;
}
.page-header-live--store .tt{
  /* 디자인 st6: 50px / 1080 */
  font-size: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
  color: #808080;
  letter-spacing: -.02em;
}
.page-live.store-live,
.app-frame > .page-header-live + .page-live.store-live{
  /* 디자인: 상단 라운드 패널 + 코랄→화이트 그라데이션 */
  --store-pad-x: calc(97.5 / 1080 * min(100vw, var(--design-max, 480px)));
  margin-top: 0;
  padding: calc(40 / 1080 * min(100vw, var(--design-max, 480px))) var(--store-pad-x) calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  border-radius: calc(30 / 1080 * min(100vw, var(--design-max, 480px))) calc(30 / 1080 * min(100vw, var(--design-max, 480px))) 0 0;
  background:
    linear-gradient(
      180deg,
      rgba(236, 109, 86, .20) 0%,
      rgba(239, 133, 114, .33) 4%,
      rgba(242, 158, 143, .47) 8%,
      rgba(245, 181, 170, .60) 13%,
      rgba(248, 201, 193, .71) 18%,
      rgba(250, 218, 212, .80) 24%,
      rgba(252, 232, 228, .87) 30%,
      rgba(253, 242, 240, .93) 38%,
      rgba(254, 249, 248, .97) 47%,
      rgba(254, 253, 253, .99) 60%,
      #fff 97%
    );
  color: #3f3a3b;
}
.store-like-row{
  display: flex;
  align-items: center;
  /* 시안: 하트 y≈480, 상호 y≈570 — 하트만 단독 행 */
  margin: calc(8 / 1080 * min(100vw, var(--design-max, 480px))) 0 calc(18 / 1080 * min(100vw, var(--design-max, 480px)));
  padding-left: 0;
}
.store-title-row{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: calc(16 / 1080 * min(100vw, var(--design-max, 480px)));
  margin-bottom: calc(28 / 1080 * min(100vw, var(--design-max, 480px)));
}
.store-like{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  color: var(--color-primary, #ec6d56);
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  line-height: 1;
}
.store-like__icon{
  display: block;
  width: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  min-width: 22px;
  min-height: 22px;
  background: url('../images/common/heart-off-store.svg') center / contain no-repeat;
}
.store-like.is-on .store-like__icon{ background-image: url('../images/common/heart-on-store.svg'); }
.store-like:active{ transform: scale(.96); }
.store-like.is-busy{ opacity: .55; pointer-events: none; }
.store-stamp-btn{
  flex: 0 0 auto;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* 시안: 365×75, rx 37.5, font 45 */
  width: calc(365 / 1080 * min(100vw, var(--design-max, 480px)));
  min-height: calc(75 / 1080 * min(100vw, var(--design-max, 480px)));
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--color-primary, #ec6d56);
  color: #fff;
  font-family: inherit;
  font-size: calc(45 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
  letter-spacing: -.02em;
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.store-stamp-btn.is-done,
.store-stamp-btn:disabled{
  background: gray;
  cursor: default;
  opacity: 1;
}
.store-live__name,
.store-live h2{
  /* 디자인 st7: 50px SemiBold */
  flex: 1 1 auto;
  min-width: 0;
  font-size: calc(50 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.02em;
  color: #3f3a3b;
  margin: 0;
  white-space: pre-line;
}
.photo-track{
  display: flex;
  gap: calc(45 / 1080 * min(100vw, var(--design-max, 480px)));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* 시안: 사진 하단(1142) → 소개 baseline(1249) ≈ 107 */
  margin-bottom: calc(107 / 1080 * min(100vw, var(--design-max, 480px)));
  scrollbar-width: none;
}
.photo-track::-webkit-scrollbar{ display: none; }
.photo-track img{
  /* 디자인 사진: 420×460, rx 40 */
  flex: 0 0 calc((100% - 45 / 1080 * min(100vw, var(--design-max, 480px))) / 2);
  width: calc((100% - 45 / 1080 * min(100vw, var(--design-max, 480px))) / 2);
  aspect-ratio: 420 / 460;
  object-fit: cover;
  border-radius: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  background: #f3f3f3;
}
.store-live .desc{
  /* 시안 st4: WantedSans Medium 45px / #3f3a3b, 줄간 tspan +54 → 54/45 */
  font-family: 'Wanted Sans', WantedSans-Medium, sans-serif;
  font-size: calc(45 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  line-height: calc(54 / 45);
  letter-spacing: 0;
  color: #3f3a3b;
  /* 시안: 소개 2줄 baseline(1303) → 구분선(1378) ≈ 76 */
  margin: 0 0 calc(76 / 1080 * min(100vw, var(--design-max, 480px)));
  white-space: pre-wrap;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.store-live__divider{
  height: 0;
  border: 0;
  border-top: 1.5px solid #d4d3d3;
  /* 시안: 구분선(1378) → 메타(1477) ≈ 99 */
  margin: 0 0 calc(99 / 1080 * min(100vw, var(--design-max, 480px)));
}
.store-live__meta{
  margin-bottom: calc(28 / 1080 * min(100vw, var(--design-max, 480px)));
}
.store-live .meta-row{
  /* 디자인 st4: 40px — 값은 검정, 휴무만 코랄 */
  font-size: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: -.02em;
  color: #3f3a3b;
  margin: 0 0 calc(8 / 1080 * min(100vw, var(--design-max, 480px)));
}
.store-live .meta-row .meta-holiday{
  color: var(--color-primary, #ec6d56);
  font-weight: 500;
}
.store-notice{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--color-primary-soft, #f9d1cb);
  border-radius: calc(20 / 1080 * min(100vw, var(--design-max, 480px)));
  padding: calc(28 / 1080 * min(100vw, var(--design-max, 480px))) calc(24 / 1080 * min(100vw, var(--design-max, 480px)));
  margin-bottom: calc(36 / 1080 * min(100vw, var(--design-max, 480px)));
}
.store-notice p{
  margin: 0;
  font-size: calc(35 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.02em;
  color: #3f3a3b;
}
.store-btn-row{
  /* 업체와 무관 — 텍스트만 2×2 (아이콘 없음), 20R */
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(20 / 1080 * min(100vw, var(--design-max, 480px))) calc(19 / 1080 * min(100vw, var(--design-max, 480px)));
  width: calc(885 / 1080 * min(100vw, var(--design-max, 480px)));
  max-width: 100%;
  margin: 0 auto;
}
.store-btn-row a,
.store-btn-row button{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0;
  border: 2px solid #bfbdbe;
  border-radius: calc(20 / 1080 * min(100vw, var(--design-max, 480px)));
  background: #fff;
  box-sizing: border-box;
  padding: 0 calc(16 / 1080 * min(100vw, var(--design-max, 480px)));
  min-height: calc(96 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(96 / 1080 * min(100vw, var(--design-max, 480px)));
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(35 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  color: #333;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  letter-spacing: -.02em;
}
.store-btn-row .store-btn-ico{
  display: none !important;
}
.store-btn-row span{
  line-height: 1.2;
  white-space: nowrap;
}

/* 업체상세 — 방문리뷰 미리보기 (최근 5건) */
.store-visit-reviews{
  --rv: min(100vw, var(--design-max, 480px));
  width: 100%;
  margin: calc(40 / 1080 * var(--rv)) 0 0;
}
.store-visit-reviews__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(22 / 1080 * var(--rv)) calc(28 / 1080 * var(--rv));
  background: var(--color-primary-soft, #f9d1cb);
  border-radius: calc(20 / 1080 * var(--rv));
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(32 / 1080 * var(--rv));
  font-weight: 600;
  letter-spacing: -.02em;
}
.store-visit-reviews__list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.store-visit-reviews__item{
  display: flex;
  align-items: center;
  gap: calc(16 / 1080 * var(--rv));
  padding: calc(26 / 1080 * var(--rv)) calc(12 / 1080 * var(--rv));
  border-bottom: 1px solid #e8e6e6;
}
.store-visit-reviews__text{
  flex: 1;
  min-width: 0;
  margin: 0;
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(32 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.store-visit-reviews__date{
  flex: 0 0 auto;
  color: #7f7c7c;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(28 / 1080 * var(--rv));
  font-weight: 500;
  letter-spacing: -.02em;
  white-space: nowrap;
}
.store-visit-reviews__empty{
  padding: calc(36 / 1080 * var(--rv)) calc(12 / 1080 * var(--rv));
  text-align: center;
  color: #7f7c7c;
  font-size: calc(30 / 1080 * var(--rv));
  border-bottom: 1px solid #e8e6e6;
}
.store-visit-reviews__more{
  display: block;
  margin: calc(20 / 1080 * var(--rv)) auto 0;
  padding: calc(8 / 1080 * var(--rv)) 0;
  text-align: center;
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(32 / 1080 * var(--rv));
  font-weight: 500;
  text-decoration: none;
  letter-spacing: -.02em;
}

/* 모달/PIN — 시안 08-store-stamp-popup / 17-review-delete-popup */
.overlay-dim{
  position: fixed;
  inset: 0;
  z-index: 400;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  box-sizing: border-box;
}
.overlay-card{
  --rv: min(100vw, var(--design-max, 480px));
  width: calc(800 / 1080 * var(--rv));
  max-width: 100%;
  background: #fff;
  border: 2px solid #d4d3d3;
  border-radius: calc(30 / 1080 * var(--rv));
  padding:
    calc(47 / 1080 * var(--rv))
    calc(52 / 1080 * var(--rv))
    calc(47 / 1080 * var(--rv));
  box-sizing: border-box;
  text-align: center;
}
.overlay-card p{
  margin: 0 0 calc(40 / 1080 * var(--rv));
  min-height: 0;
  display: block;
  text-align: center;
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.35;
  word-break: keep-all;
}
.overlay-card .row{
  display: flex;
  gap: calc(27 / 1080 * var(--rv));
}
.overlay-card .row .live-btn{
  flex: 1;
  min-width: 0;
  height: calc(95 / 1080 * var(--rv));
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: calc(47.5 / 1080 * var(--rv));
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 500;
  background: #eae9e9;
  color: #3f3a3b;
}
.overlay-card .row .live-btn.primary{
  background: #ec6d56;
  border: 0;
  color: #fff;
}
/* 단일 확인 버튼 (커피쿠폰 준비중 등) — 시안: 335×95, rx 47.5, #eae9e9 */
.overlay-card > .live-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(335 / 1080 * var(--rv));
  max-width: 100%;
  height: calc(95 / 1080 * var(--rv));
  min-height: 44px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: calc(47.5 / 1080 * var(--rv));
  background: #eae9e9;
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  box-sizing: border-box;
}
.overlay-card > .live-btn.primary{
  background: #eae9e9;
  border: 0;
  color: #3f3a3b;
}

.pin-page{ padding-top: 8px; position: relative; }
.pin-page .sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}
.pin-page .pin-store{
  text-align: center;
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--color-primary);
  margin: 18px 0 8px;
}
.pin-page .pin-guide{
  text-align: center;
  color: #555;
  font-size: .95rem;
  margin-bottom: 18px;
}
/* 시안 10-stamp-password: 비밀번호 전달 안내 (회색 보조 문구) */
.pin-page .pin-note{
  text-align: center;
  color: gray;
  font-size: .88rem;
  line-height: 1.6;
  margin: -8px 0 18px;
}
/* 원본: 연분홍 박스(#ffe4e1) + 빈 점(#f29c97) / 입력 시 커피콩 이미지 */
.pin-dots{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(70 / 1080 * min(100vw, var(--design-max, 480px)));
  margin: 18px auto 22px;
  width: calc(885 / 1080 * min(100vw, var(--design-max, 480px)));
  max-width: 100%;
  min-height: calc(160 / 1080 * min(100vw, var(--design-max, 480px)));
  padding: 22px 18px;
  box-sizing: border-box;
  background: #ffe4e1;
  border-radius: calc(60 / 1080 * min(100vw, var(--design-max, 480px)));
  cursor: pointer;
}
.pin-dots i{
  position: relative;
  width: calc(87.66 / 1080 * min(100vw, var(--design-max, 480px)));
  height: calc(87.66 / 1080 * min(100vw, var(--design-max, 480px)));
  min-width: 28px;
  min-height: 28px;
  max-width: 44px;
  max-height: 44px;
  border-radius: 50%;
  background: #f29c97;
  display: block;
  flex: 0 0 auto;
  overflow: hidden;
}
.pin-dots i::after{
  content: "";
  position: absolute;
  inset: 0;
  background: url('../images/common/pin-fill.svg') center / contain no-repeat;
  opacity: 0;
  transform: scale(.86);
  transition: opacity .12s ease, transform .12s ease;
}
.pin-dots i.on{
  background: transparent;
}
.pin-dots i.on::after{
  opacity: 1;
  transform: scale(1);
}
.pin-msg{
  text-align: center;
  min-height: 1.4em;
  font-size: .88rem;
  color: #c0392b;
  margin: 0 0 10px;
}
.pin-msg.ok{ color: var(--color-stamp-green); }
.pin-geo-gate{
  text-align: center;
  font-size: .95rem;
  font-weight: 700;
  color: #c0392b;
  margin: -8px 0 14px;
}
.pin-geo-gate[hidden]{
  display: none !important;
}
.pin-page.is-geo-locked .pin-dots{
  cursor: default;
  opacity: .55;
  pointer-events: none;
}
/* 스탬프 비밀번호 화면 위치 확인 표시 */
.pin-geo{
  margin: 0 auto 14px;
  padding: 12px 16px;
  width: calc(885 / 1080 * min(100vw, var(--design-max, 480px)));
  max-width: 100%;
  box-sizing: border-box;
  border-radius: 14px;
  background: #f6f5f4;
  color: #3f3a3b;
  font-size: .84rem;
  line-height: 1.7;
  text-align: center;
}
.pin-geo p{ margin: 0; }
.pin-geo span{
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.pin-geo.is-near{
  background: #e8f5e9;
}
.pin-geo-request{
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: var(--brand-green, #2f8463);
  color: #fff;
  font-family: inherit;
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
}
.pin-geo-request[hidden]{
  display: none !important;
}

.pin-native-input{
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  border: 0;
  padding: 0;
  margin: 0;
  caret-color: transparent;
  color: transparent;
  background: transparent;
  -webkit-text-security: disc;
}
.pin-dots{ cursor: pointer; }
.keypad{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 320px;
  margin: 0 auto;
}
.keypad button{
  border: 0;
  background: #f5f5f5;
  border-radius: 14px;
  min-height: 56px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #333;
  cursor: pointer;
}
.keypad button.ghost{ background: transparent; font-size: .95rem; color: #888; }

/* 리스트/리뷰/굿즈 */
.list-card{
  border: 1px solid #eee;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 10px;
  background: #fff;
}
.list-card .name{ font-weight: 700; margin-bottom: 4px; }
.list-card .sub{ font-size: .82rem; color: #888; }
.goods-pair{ display: grid; gap: 12px; }
.goods-card-live{
  border: 1px solid #eee;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  gap: 14px;
  align-items: center;
}
.goods-card-live .icon{
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: #f6f6f6;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.goods-card-live .icon img{ width: 34px; height: 34px; object-fit: contain; }
.goods-card-live .info{ flex: 1; min-width: 0; }
.goods-card-live .info h3{ margin: 0 0 4px; font-size: 1rem; }
.goods-card-live .info p{ margin: 0; font-size: .8rem; color: #777; }
/* 굿즈교환 상태 배지 — 시안: 교환하기/교환완료/미획득 */
.goods-card-live .goods-badge{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  min-height: 36px;
  padding: 8px 14px;
  border: 0;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: -.02em;
  white-space: nowrap;
  color: #fff;
  line-height: 1.2;
  cursor: default;
}
.goods-card-live .goods-badge--exchange{
  background: var(--btn-primary-bg, #ec6d56);
  cursor: pointer;
}
.goods-card-live .goods-badge--done{
  background: var(--btn-success-bg, #39b54a); /* 교환완료 초록 */
}
.goods-card-live .goods-badge--locked{
  background: #b0b0b0;
}
.goods-card-live .status{
  font-size: .78rem;
  font-weight: 700;
  color: #999;
  white-space: nowrap;
}
.goods-card-live .status.ok{ color: var(--btn-success-bg, #39b54a); }
.goods-card-live .status.action{ color: var(--color-primary); }

/* ── 리뷰 페이지 (원본 아트보드 1080 기준) ── */
:root {
  --rv: min(100vw, var(--design-max, 480px));
}

/* ── 적립 리스트 / 굿즈 교환 (원본 아트보드 1080 기준) ──
   시안의 제목 + 유의사항 영역만 아트보드로 깔고 카드는 HTML 로 반복 렌더한다 */
.artboard.list-head-artboard {
  flex: 0 0 auto;
  position: relative;
}

/* 적립 리스트 유의사항 안내 — SVG 박스 안 HTML 오버레이 */
.stamp-list-notice {
  position: absolute;
  left: calc(98 / 1080 * 100%);
  top: calc((520 - 180) / 549.02 * 100%);
  width: calc(885 / 1080 * 100%);
  box-sizing: border-box;
  padding: 0 calc(70 / 1080 * var(--rv, min(100vw, 480px)));
  pointer-events: none;
  z-index: 2;
  text-align: center;
}
.stamp-list-notice p {
  margin: 0;
  font-family: 'Wanted Sans', WantedSans-Medium, sans-serif;
  font-size: calc(36 / 1080 * var(--rv, min(100vw, 480px)));
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: -0.03em;
  color: #4a4546;
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-align: center;
}
.stamp-list-notice p + p {
  margin-top: calc(18 / 1080 * var(--rv, min(100vw, 480px)));
}

.stamp-log-section,
.goods-exchange-section {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  gap: calc(27.84 / 1080 * var(--rv));
  padding: calc(27.84 / 1080 * var(--rv)) 0 calc(60 / 1080 * var(--rv));
  background: #fff;
}

/* 적립 카드 — 885x290, 좌측 여백 98 */
.stamp-log-card {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: calc(885 / 1080 * var(--rv));
  height: calc(290 / 1080 * var(--rv));
  margin: 0 auto;
  border: calc(2 / 1080 * var(--rv)) solid #d4d3d3;
  border-radius: calc(30 / 1080 * var(--rv));
  background: #fff;
  color: inherit;
  text-decoration: none;
}
.stamp-log-card__name {
  position: absolute;
  left: calc(62.52 / 1080 * var(--rv));
  top: calc(42.78 / 1080 * var(--rv));
  right: calc(46 / 1080 * var(--rv));
  margin: 0;
  font-size: calc(50 / 1080 * var(--rv));
  font-weight: 600;
  line-height: 1;
  color: #3f3a3b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stamp-log-card__heart { font-weight: 400; }
.stamp-log-card__heart.is-on { color: #ec6d56; }
.stamp-log-card__meta {
  position: absolute;
  left: calc(64.03 / 1080 * var(--rv));
  top: calc(149.58 / 1080 * var(--rv));
}
.stamp-log-card__meta::before {
  content: '';
  position: absolute;
  left: calc(-18.03 / 1080 * var(--rv));
  top: calc(-25.05 / 1080 * var(--rv));
  width: calc(793 / 1080 * var(--rv));
  border-top: calc(2 / 1080 * var(--rv)) solid #d4d3d3;
}
.stamp-log-card__meta p {
  margin: 0;
  font-size: calc(35 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.stamp-log-card__meta p + p { margin-top: calc(16.83 / 1080 * var(--rv)); }
.stamp-log-card__meta .k { color: #3f3a3b; }
.stamp-log-card__meta .v { color: gray; }
.stamp-log-card__state {
  position: absolute;
  left: calc(632.53 / 1080 * var(--rv));
  top: calc(173.07 / 1080 * var(--rv));
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 600;
  line-height: 1;
  color: #ec6d56;
  white-space: nowrap;
}
.stamp-log-empty,
.goods-empty {
  margin: calc(80 / 1080 * var(--rv)) 0;
  text-align: center;
  font-size: calc(35 / 1080 * var(--rv));
  color: #7f7c7c;
}

/* 굿즈 카드 — 885x290, 좌측 배지 + 제목/기간 + 상태 알약 */
.goods-item {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: calc(885 / 1080 * var(--rv));
  height: calc(290 / 1080 * var(--rv));
  margin: 0 auto;
  padding: 0;
  border: calc(2 / 1080 * var(--rv)) solid #d4d3d3;
  border-radius: calc(60 / 1080 * var(--rv));
  background: #fff;
  text-align: left;
  font: inherit;
  color: inherit;
}
button.goods-item { cursor: pointer; }
.goods-item__badge {
  position: absolute;
  left: calc(64.18 / 1080 * var(--rv));
  top: calc(62.33 / 1080 * var(--rv));
  width: calc(171.98 / 1080 * var(--rv));
  height: calc(165.33 / 1080 * var(--rv));
  object-fit: contain;
  display: block;
}
.goods-item__name {
  position: absolute;
  left: calc(305.05 / 1080 * var(--rv));
  top: calc(40.4 / 1080 * var(--rv));
  right: calc(30 / 1080 * var(--rv));
  margin: 0;
  font-size: calc(50 / 1080 * var(--rv));
  font-weight: 600;
  line-height: 1;
  color: #3f3a3b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.goods-item__period {
  position: absolute;
  left: calc(274.16 / 1080 * var(--rv));
  top: calc(105.21 / 1080 * var(--rv));
  margin: 0;
  font-size: calc(35 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.goods-item__period .k { color: #3f3a3b; }
.goods-item__period .v { color: #999; }
.goods-item__pill {
  position: absolute;
  left: calc(421.31 / 1080 * var(--rv));
  top: calc(171.63 / 1080 * var(--rv));
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(250 / 1080 * var(--rv));
  height: calc(75 / 1080 * var(--rv));
  border-radius: calc(37.5 / 1080 * var(--rv));
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 600;
  line-height: 1;
  color: #fff;
}
.goods-item__pill--locked { background: gray; }
.goods-item__pill--ready { background: #ec6d56; }
.goods-item__pill--done { background: #2f8463; }
/* 헤더 아트보드는 콘텐츠 높이만 차지 (기본 .artboard 의 flex-grow 해제) */
.artboard.review-header-artboard {
  flex: 0 0 auto;
  position: relative;
}

.page-live.review-list-section {
  display: block;
  flex: 1 0 auto;
  padding: calc(34 / 1080 * var(--rv)) calc(99.35 / 1080 * var(--rv))
           calc(160 / 1080 * var(--rv));
}
.review-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: calc(45.71 / 1080 * var(--rv));
  border: 2px solid #d4d3d3;
  border-radius: calc(40 / 1080 * var(--rv));
  padding: calc(51.28 / 1080 * var(--rv)) calc(50 / 1080 * var(--rv));
  margin-bottom: calc(25.68 / 1080 * var(--rv));
  background: #fff;
}
.review-card__avatar {
  flex: 0 0 calc(127.96 / 1080 * var(--rv));
  width: calc(127.96 / 1080 * var(--rv));
  height: calc(127.96 / 1080 * var(--rv));
}
.review-card__avatar svg { display: block; width: 100%; height: 100%; }
.review-card__body { flex: 1 1 auto; min-width: 0; }
.review-card__author {
  margin: 0;
  font-size: calc(50 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.25;
  color: #3f3a3b;
}
.review-card__date {
  margin: calc(12 / 1080 * var(--rv)) 0 0;
  font-size: calc(35 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.2;
  color: gray;
}
.review-card__content {
  margin: calc(46 / 1080 * var(--rv)) 0 0;
  font-size: calc(40 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.45;
  color: #3f3a3b;
  white-space: pre-wrap;
  word-break: break-word;
}
.review-card__tools {
  position: absolute;
  top: calc(50 / 1080 * var(--rv));
  right: calc(44 / 1080 * var(--rv));
  display: flex;
  gap: calc(42 / 1080 * var(--rv));
}
.review-card__tool-btn {
  width: calc(34 / 1080 * var(--rv));
  height: calc(34 / 1080 * var(--rv));
  min-width: 16px;
  min-height: 16px;
  border: 0;
  padding: 0;
  background: none;
  cursor: pointer;
}
.review-card__tool-btn svg { display: block; width: 100%; height: 100%; }

/* 하단 고정 리뷰 작성 바 */
.review-compose-fixed {
  --rv: min(100vw, var(--design-max, 480px));
  position: fixed;
  z-index: 250;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: var(--design-max, 480px);
  bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom, 0));
  padding: calc(28 / 1080 * var(--rv)) 0;
  background: #fff;
  box-sizing: border-box;
}
.review-compose-bar {
  display: flex;
  align-items: center;
  gap: calc(45.7 / 1080 * var(--rv));
  padding-left: calc(128.53 / 1080 * var(--rv));
  padding-right: calc(124.84 / 1080 * var(--rv));
}
.review-compose-bar__avatar {
  flex: 0 0 calc(94.48 / 1080 * var(--rv));
  width: calc(94.48 / 1080 * var(--rv));
  height: calc(94.48 / 1080 * var(--rv));
}
.review-compose-bar__avatar svg { display: block; width: 100%; height: 100%; }
.review-compose-bar__pill {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: calc(94.47 / 1080 * var(--rv));
  min-height: 34px;
  padding: 0 calc(26.06 / 1080 * var(--rv)) 0 calc(52.79 / 1080 * var(--rv));
  border: 2px solid #d4d3d3;
  border-radius: 999px;
  background: #fff;
  cursor: pointer;
}
.review-compose-bar__label {
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(40 / 1080 * var(--rv));
  font-weight: 500;
  color: gray;
}
.review-compose-bar__pen {
  flex: 0 0 calc(65.04 / 1080 * var(--rv));
  width: calc(65.04 / 1080 * var(--rv));
  height: calc(65.04 / 1080 * var(--rv));
}
.review-compose-bar__pen svg { display: block; width: 100%; height: 100%; }

/* 이미 리뷰를 작성한 경우: 아바타·펜 없는 전체 폭 안내 pill */
.review-written-notice {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(94.47 / 1080 * var(--rv));
  min-height: 34px;
  margin: 0 calc(124.84 / 1080 * var(--rv)) 0 calc(128.54 / 1080 * var(--rv));
  border: 2px solid #d4d3d3;
  border-radius: 999px;
  font-size: calc(40 / 1080 * var(--rv));
  font-weight: 500;
  color: gray;
  white-space: nowrap;
}

/* ── 리뷰 글쓰기 카드 (주황 테두리) ── */
.review-write-card {
  position: relative;
  border: 2px solid #ec6d56;
  border-radius: calc(40 / 1080 * var(--rv));
  padding: calc(51.6 / 1080 * var(--rv)) calc(110 / 1080 * var(--rv))
           calc(51.6 / 1080 * var(--rv)) calc(67.02 / 1080 * var(--rv));
  margin-bottom: calc(25.68 / 1080 * var(--rv));
  min-height: calc(325.14 / 1080 * var(--rv));
  box-sizing: border-box;
  background: #fff;
}
.review-write-card textarea {
  display: block;
  width: 100%;
  border: 0;
  outline: none;
  resize: none;
  overflow: hidden;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(40 / 1080 * var(--rv));
  font-weight: 500;
  color: gray;
  line-height: 1.45;
  min-height: calc(174 / 1080 * var(--rv));
  padding: 0;
  background: transparent;
}
.review-write-card textarea::placeholder { color: #b8b8b8; opacity: 1; }
.review-write-card__send {
  position: absolute;
  right: calc(37.13 / 1080 * var(--rv));
  bottom: calc(28.8 / 1080 * var(--rv));
  width: calc(65.04 / 1080 * var(--rv));
  height: calc(65.04 / 1080 * var(--rv));
  min-width: 30px;
  min-height: 30px;
  border: 0;
  background: none;
  padding: 0;
  cursor: pointer;
}
.review-write-card__send svg { display: block; width: 100%; height: 100%; }
.compose-fixed{
  position: sticky;
  bottom: 0;
  background: #fff;
  border-top: 1px solid #eee;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom,0));
}
.compose-fixed textarea{
  width: 100%;
  min-height: 110px;
  border: 1px solid #e5e5e5;
  border-radius: 14px;
  padding: 12px;
  resize: vertical;
  font-size: .95rem;
  font-family: inherit;
}
.compose-fixed .row{
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
  gap: 8px;
}
.empty-msg{
  text-align: center;
  color: #999;
  padding: 28px 12px;
  font-size: .92rem;
}

/* 공지 리스트 */
.notice-live{
  padding-top: 8px;
  flex: 1 0 auto;
  background: #fff;
}
.notice-row{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 2px;
  border-bottom: 1px solid #eee;
  text-decoration: none;
  color: inherit;
}
.notice-row:last-child{ border-bottom: 0; }
.notice-row__ico{
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  margin-top: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.notice-row__dot{
  display: block;
  width: 8px;
  height: 8px;
  object-fit: contain;
}
.notice-row--top .notice-row__title{
  font-weight: 700;
}
.notice-row__body{
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.notice-row__title{
  font-size: .95rem;
  font-weight: 600;
  color: #3f3a3b;
  line-height: 1.45;
  word-break: keep-all;
}
.notice-row__date{
  font-size: .78rem;
  color: #9a9a9a;
}
.notice-view-live__title{
  margin: 0 0 8px;
  font-size: 1.12rem;
  font-weight: 800;
  line-height: 1.45;
  color: #222;
  word-break: keep-all;
}
.notice-view-live__date{
  margin: 0 0 18px;
  font-size: .82rem;
  color: #9a9a9a;
}
.notice-view-live__body{
  font-size: .95rem;
  line-height: 1.7;
  color: #3f3a3b;
  word-break: keep-all;
}
.notice-view-live__body p{ margin: 0 0 .8em; }
.notice-view-live__body img{ max-width: 100%; height: auto; }
.notice-view-live__body a{ color: var(--color-primary); }
.done-box{
  text-align: center;
  padding: 40px 16px 20px;
}
.done-box h2{
  font-size: 1.25rem;
  margin: 0 0 10px;
  color: var(--color-stamp-green);
}
.done-box p{ color: #555; margin: 0 0 22px; }

/* store sheet 모달 스타일 (인라인 확인) */
.modal-sheet-actions{ margin-top: 8px; }

.complete-live{ text-align: center; padding-top: 12px; }
.complete-live .badge-ok{
  width: 64px;
  height: 64px;
  margin: 12px auto 16px;
  border-radius: 50%;
  background: var(--color-stamp-green, #177959);
  color: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.complete-live h2{
  font-size: 1.25rem;
  margin: 0 0 8px;
  line-height: 1.4;
}
.complete-live .sub{ color: #666; margin: 0; font-size: .92rem; }

.mylist-live .visit-item,
.mylist-live .list-card{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.mylist-live .visit-item .t,
.mylist-live .list-card .t{
  flex-shrink: 0;
  font-size: .78rem;
  font-weight: 700;
  color: var(--color-stamp-green, #177959);
}

.rating-row{
  display: flex;
  gap: 6px;
  margin-bottom: 12px;
}
.rating-row button{
  border: 0;
  background: none;
  font-size: 1.6rem;
  color: #ddd;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
}
.rating-row button.on{ color: var(--color-primary, #e25b4c); }

.review-form-live textarea{
  width: 100%;
  min-height: 140px;
  border: 1px solid #e5e5e5;
  border-radius: 14px;
  padding: 12px;
  resize: vertical;
  font-size: .95rem;
  font-family: inherit;
  margin-bottom: 8px;
  box-sizing: border-box;
}
.review-form-live .live-btn{ width: 100%; }

.overlay-dim[hidden]{ display: none !important; }

/* 메인 — SVG 아트보드(상단) + 동적 업체 목록(하단) */
.home-top-artboard {
  flex: 0 0 auto;
}

/* 커피스탬프 슬롯: 적립된 개수만큼만 도장을 채운다 */
.home-top-artboard [data-stamp-slot][data-on] {
  opacity: 1;
}
/* 기본스탬프 이미지가 슬롯을 덮을 때 SVG 슬롯 테두리는 숨김 */
.home-top-artboard [data-stamp-slot][data-stamp-covered] {
  opacity: 0 !important;
}
.home-top-artboard [data-stamp-num][data-on],
.home-top-artboard [data-stamp-goods][data-on],
.home-top-artboard [data-stamp-mark]:not([data-on]) {
  display: none;
}

/* 굿즈 슬롯을 획득하면 초록 배경 */
.home-top-artboard [data-goods-earned] path {
  fill: #2f8463 !important;
}

/* 시즌관리에 굿즈를 등록하면 시안에 그려진 볼펜·머그컵은 등록 아이콘으로 대체한다 */
.home-top-artboard.has-slot-goods [data-stamp-goods] {
  display: none;
}

/* 굿즈 순번에 해당하는 스탬프 칸에 올리는 획득·미획득 아이콘.
   좌표 기준을 아트보드 높이가 아니라 SVG 뷰박스(1080x1440) 비율에 맞춘다 */
.stamp-slot-goods-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  aspect-ratio: 1080 / 970;
  z-index: 3;
  pointer-events: none;
}
.stamp-slot-goods {
  position: absolute;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}
/* 기본스탬프 아이콘 — 슬롯을 빈틈없이 덮음 */
.stamp-slot-goods.is-stamp-cover {
  object-fit: cover;
}
.stamp-slot-goods-label {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2vw;
  font-weight: 700;
  color: #5a3e2b;
  text-align: center;
  line-height: 1.2;
  word-break: keep-all;
  background: rgba(255,255,255,0.75);
  border-radius: 50%;
}
.stamp-slot-goods-label.is-earned {
  color: #fff;
  background: rgba(180, 90, 40, 0.8);
}

/* 적립완료 / 교환완료 — 확인 버튼 */
.complete-artboard {
  position: relative;
}
.complete-confirm-btn {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: calc((1520 - 180) / 1877.31 * 100%);
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(520 / 1080 * 100%);
  max-width: 280px;
  height: calc(96 / 1080 * min(100vw, var(--design-max, 480px)));
  min-height: 44px;
  border-radius: 999px;
  background: var(--btn-primary-bg, #ec6d56);
  color: #fff;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 600;
  letter-spacing: -0.02em;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(236, 109, 86, 0.28);
}
.complete-confirm-btn:active {
  background: var(--btn-primary-hover, #e0553c);
}

.home-banner-overlay {
  /* legacy — 흐름 배너로 대체됨 */
  display: none;
}
.home-search-overlay {
  display: none;
}

/* 보드 아래: 배너 → 검색 → (업체리스트) 문서 흐름 */
.home-flow-section {
  --rv: min(100vw, var(--design-max, 480px));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(28 / 1080 * var(--rv));
  padding:
    calc(24 / 1080 * var(--rv))
    0
    calc(20 / 1080 * var(--rv));
  background: #fff;
  box-sizing: border-box;
}
.home-flow-section .home-banner-flow.banner-live {
  position: relative;
  left: auto;
  top: auto;
  width: calc(885 / 1080 * 100%);
  max-width: 100%;
  height: auto;
  margin: 0; /* gap 으로 간격 유지 */
  z-index: 1;
  border-radius: calc(30 / 1080 * var(--rv));
  background: #e8e8e8;
  overflow: hidden;
}
.home-flow-section .banner-live-track {
  height: auto;
  min-height: 0;
}
.home-search-flow {
  position: relative;
  display: block;
  width: calc(875.65 / 1080 * 100%);
  height: calc(110.32 / 1080 * var(--rv));
  min-height: 48px;
  box-sizing: border-box;
  border: calc(2 / 1080 * var(--rv)) solid #d4d3d3;
  border-radius: 999px;
  background: #fff;
  /* flex padding 대신 시안 좌표로 입력/아이콘 배치 */
  padding: 0;
}
.home-search-flow input {
  position: absolute;
  left: calc(98 / 1080 * var(--rv));
  /* 아이콘(39.2) + 오른쪽 여백(~92) */
  right: calc(140 / 1080 * var(--rv));
  top: 0;
  bottom: 0;
  border: 0;
  background: transparent;
  padding: 0;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: max(16px, calc(35 / 1080 * var(--rv)));
  font-weight: 500;
  color: #3f3a3b;
  outline: none;
  min-width: 0;
}
.home-search-flow input::placeholder {
  color: #3f3a3b;
  opacity: 1;
  font-size: max(16px, calc(35 / 1080 * var(--rv)));
}
.home-search-flow button {
  position: absolute;
  top: 50%;
  /* 시안: 박스 우측단(975.33) − 아이콘 우측(883.77) ≈ 91.6 */
  right: calc(92 / 1080 * var(--rv));
  transform: translateY(-50%);
  flex: none;
  width: calc(39.2 / 1080 * var(--rv));
  height: calc(39.2 / 1080 * var(--rv));
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  -webkit-tap-highlight-color: transparent;
}
.home-search-flow button img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}
.page-live.home-partners-section {
  flex: 1 0 auto;
  padding-top: calc(16 / 1080 * min(100vw, var(--design-max, 480px)));
}

/* 공통 안내/확인 모달 (시안 17-review-delete-popup) */
.coupon-confirm-dim {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(40 / 1080 * min(100vw, var(--design-max, 480px)));
  background: rgba(0, 0, 0, 0.7);
  box-sizing: border-box;
}
.coupon-confirm-dim[hidden] {
  display: none !important;
}
body.coupon-confirm-open {
  overflow: hidden;
}
.coupon-confirm-modal {
  --rv: min(100vw, var(--design-max, 480px));
  width: calc(800 / 1080 * var(--rv));
  max-width: 100%;
  background: #fff;
  border: 2px solid #d4d3d3;
  border-radius: calc(30 / 1080 * var(--rv));
  padding:
    calc(47 / 1080 * var(--rv))
    calc(52 / 1080 * var(--rv))
    calc(47 / 1080 * var(--rv));
  box-sizing: border-box;
  text-align: center;
}
.coupon-confirm-modal__msg {
  margin: 0 0 calc(40 / 1080 * var(--rv));
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3f3a3b;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 500;
  line-height: 1.35;
  word-break: keep-all;
}
.coupon-confirm-modal__btns {
  display: flex;
  gap: calc(27 / 1080 * var(--rv));
}
.coupon-confirm-modal__btn {
  flex: 1;
  min-width: 0;
  border: 0;
  cursor: pointer;
  height: calc(95 / 1080 * var(--rv));
  min-height: 44px;
  padding: 0;
  border-radius: calc(47.5 / 1080 * var(--rv));
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(45 / 1080 * var(--rv));
  font-weight: 500;
}
.coupon-confirm-modal__btn--cancel {
  background: #eae9e9;
  color: #3f3a3b;
}
.coupon-confirm-modal__btn--ok {
  background: #ec6d56;
  color: #fff;
}
.coupon-confirm-dim:not(.is-confirm) .coupon-confirm-modal__btns {
  justify-content: center;
}
.coupon-confirm-dim:not(.is-confirm) .coupon-confirm-modal__btn--ok {
  flex: 0 1 auto;
  min-width: 55%;
}

/* 메인 상단 공지 — 뉴스 티커(위로 아웃 / 아래서 인) */
.home-notice-overlay {
  position: absolute;
  z-index: 5;
  /* 스탬프 보드(st95: x97.5 width885)와 동일 가로 */
  left: 9.028%;
  top: 3.61%;
  width: 81.944%;
  height: 10.31%;
  display: flex;
  align-items: center;
  /* 「공지」라벨·벨 아이콘(st108 안쪽)과 겹치지 않게 */
  padding-left: 18.5%;
  padding-right: 3%;
  box-sizing: border-box;
  text-decoration: none;
  color: inherit;
}
.home-notice-ticker {
  position: relative;
  display: block;
  flex: 1;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}
.home-notice-ticker__item {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: grid;
  align-items: center;
  margin: 0;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: calc(32 / 1080 * min(100vw, var(--design-max, 480px)));
  font-weight: 500;
  color: #3f3a3b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: translateY(100%);
  opacity: 0;
  transition: transform 0.45s ease, opacity 0.45s ease;
  pointer-events: none;
}
.home-notice-ticker__item.is-active {
  transform: translateY(0);
  opacity: 1;
}
.home-notice-ticker__item.is-out {
  transform: translateY(-100%);
  opacity: 0;
}

.home-closed {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 16px 20px 24px;
}
.home-closed-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 8px 14px 8px 16px;
  background: #f3f0ea;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  box-sizing: border-box;
}
.home-closed-notice__label {
  flex-shrink: 0;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #2f8463;
}
.home-closed-notice .home-notice-ticker {
  position: relative;
  flex: 1;
  min-width: 0;
  height: 28px;
}
.home-closed-notice .home-notice-ticker__item {
  font-size: 14px;
  padding: 0;
}
.home-closed-msg {
  margin: 56px 12px 0;
  text-align: center;
  font-family: 'Wanted Sans', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #3f3a3b;
  line-height: 1.7;
}