/**
 * Acts 사역자 프로필 — 디자인 토큰 & 베이스
 * Solapi 디자인 시스템 기반
 *
 * @version 2.1.0
 * @location joyn-members-pro/modules/acts/assets/acts-profile-base.css
 */

/* ── 디자인 토큰 ─────────────────────────────────────────── */
.acts-p {
  /* 솔라피 브랜드 컬러 */
  --ap-primary:       #4541FF;
  --ap-primary-light: #A788FF;
  --ap-primary-dark:  #3730E3;
  --ap-primary-soft:  rgba(69,65,255,.08);
  --ap-primary-border:rgba(69,65,255,.22);

  /* 중성 컬러 */
  --ap-dark:   #222222;
  --ap-text:   #333333;
  --ap-muted:  #6B7280;
  --ap-bg:     #F5F6F8;
  --ap-white:  #FFFFFF;
  --ap-border: #E5E7EB;
  --ap-line:   rgba(0,0,0,.07);
  --ap-soft:   rgba(0,0,0,.03);

  /* 상태 컬러 */
  --ap-success: #10B981;
  --ap-warning: #F59E0B;
  --ap-error:   #EF4444;

  /* 레벨 컬러 */
  --ap-lv-beginner: #16a34a;
  --ap-lv-active:   #ca8a04;
  --ap-lv-pro:      #dc2626;
  --ap-lv-master:   #7c3aed;
  --ap-lv-elite:    #0891b2;

  /* 자동 반응형 Spacing (clamp) */
  --sp-xs: clamp(.25rem, .1rem + .5vw, .5rem);
  --sp-sm: clamp(.5rem,  .3rem + .6vw, .875rem);
  --sp-md: clamp(.875rem,.5rem + 1vw, 1.25rem);
  --sp-lg: clamp(1.25rem,.75rem + 1.5vw, 2rem);

  /* Typography */
  --fs-xs:  clamp(.75rem,  .7rem  + .15vw, .8125rem);
  --fs-sm:  clamp(.8125rem,.75rem + .2vw,  .9375rem);
  --fs-base:clamp(.9375rem,.875rem + .2vw, 1.0625rem);
  --fs-lg:  clamp(1rem,    .9rem  + .3vw,  1.25rem);
  --fs-xl:  clamp(1.125rem,1rem   + .4vw,  1.5rem);
  --fs-2xl: clamp(1.375rem,1.1rem + .7vw,  2rem);

  /* Border Radius */
  --r-sm:  8px;
  --r-md:  12px;
  --r-lg:  16px;
  --r-xl:  20px;
  --r-pill:999px;

  /* Shadows */
  --shadow-sm: 0 1px 4px rgba(0,0,0,.06);
  --shadow-md: 0 4px 16px rgba(0,0,0,.08);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.10);

  /* Font */
  --font: 'Pretendard', -apple-system, 'Apple SD Gothic Neo', sans-serif;

  /* Safe area */
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);

  /* 미디어·뉴스 등 리스트 썸네일 (접힘/펼침 공통, 반응형 동일 비율 = 기존 44px 대비 1.3배) */
  --ap-item-thumb-size: calc(44px * 1.3);
  --ap-item-thumb-icon-size: calc(18px * 1.3);
}

/* ── 리셋 + 베이스 ────────────────────────────────────────── */
.acts-p *,
.acts-p *::before,
.acts-p *::after { box-sizing: border-box; margin: 0; padding: 0; }

.acts-p {
  font-family: var(--font);
  font-size: var(--fs-base);
  color: var(--ap-text);
  background: var(--ap-bg);
  /* min-height: 100vh; → #actsProfileRoot 로 이동 */
  -webkit-font-smoothing: antialiased;
  width: 100%;
  overflow-x: hidden;
}

/* 프로필 페이지: 스크롤바 공간 예약·수평 오버플로우 차단 — 화면 좌측 이동·움찔 방지 */
/* #actsProfileRoot 기준 — body 클래스 미적용(캐시/경로) 시에도 동작 */
html:has(#actsProfileRoot),
html:has(body.jmp-acts-minister-profile-page) {
  overflow-x: hidden !important;
  overflow-y: scroll;
  scrollbar-gutter: stable;
}
body:has(#actsProfileRoot),
body.jmp-acts-minister-profile-page {
  overflow-x: hidden !important;
  max-width: 100%;
}

/* 워드프레스 테마 패딩·오버플로우 제거 */
body.jmp-acts-minister-profile-page #content,
body.jmp-acts-minister-profile-page .site-content,
body.jmp-acts-minister-profile-page .entry-content,
body.jmp-acts-minister-profile-page .content-area,
body.jmp-acts-minister-profile-page #main,
body.jmp-acts-minister-profile-page .site-main,
body.jmp-acts-minister-profile-page main,
body.jmp-acts-minister-profile-page #primary,
body.jmp-acts-minister-profile-page .content,
body.jmp-acts-minister-profile-page .site-inner,
body.jmp-acts-minister-profile-page .page-content,
body:has(#actsProfileRoot) #content,
body:has(#actsProfileRoot) .site-content,
body:has(#actsProfileRoot) .entry-content,
body:has(#actsProfileRoot) #main,
body:has(#actsProfileRoot) .site-main {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow-x: hidden !important;
}

/* ── Remix Icon (테마 remixicon 스타일 + .jmp-acts-ri 정렬·크기) ── */
.acts-p .jmp-acts-ri {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  letter-spacing: normal;
  flex-shrink: 0;
}
.acts-p .jmp-acts-ri--xs  { font-size: 14px; }
.acts-p .jmp-acts-ri--sm  { font-size: 16px; }
.acts-p .jmp-acts-ri--lg  { font-size: 24px; }
.acts-p .jmp-acts-ri--xl  { font-size: 32px; }

/* ── 페이지 레이아웃 (화면 꽉 차게) ───────────────────────── */
.acts-p__page {
  position: relative;
  z-index: 1;
  max-width: 100%;
  margin: 0;
  padding: 0 20px calc(80px + var(--safe-b));
}
@media (min-width: 961px) {
  .acts-p__page {
    max-width: 960px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* ── 카드 ─────────────────────────────────────────────────── */
.acts-p__card {
  background: var(--ap-white);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  margin-top: var(--sp-sm);
}

/* ── 섹션 헤더 (화면 꽉 차게) ─────────────────────────────── */
.acts-p__sec-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-sm);
  padding: clamp(10px, 2vw, 16px) clamp(12px, 2vw, 20px);
  border-bottom: 1px solid var(--ap-border);
}
.acts-p__sec-head h3 {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-dark);
  display: flex;
  align-items: center;
  gap: 6px;
}
.acts-p__sec-head h3 .jmp-acts-ri { font-size: 18px; color: var(--ap-primary); }
.acts-p__sec-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.acts-p__sec-body { padding: clamp(10px, 2vw, 16px) clamp(12px, 2vw, 20px); }

/* ── 빈 상태 ──────────────────────────────────────────────── */
.acts-p__empty {
  text-align: center;
  padding: var(--sp-lg) var(--sp-md);
  color: var(--ap-muted);
}
.acts-p__empty .jmp-acts-ri { font-size: 40px; opacity: .35; display: block; margin: 0 auto var(--sp-sm); }
.acts-p__empty p  { font-size: var(--fs-sm); }

/* ── 토스트 ───────────────────────────────────────────────── */
.acts-p__toast {
  position: fixed;
  left: 50%;
  bottom: calc(72px + var(--safe-b));
  transform: translateX(-50%) translateY(10px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s, transform .2s;
  background: var(--ap-dark);
  color: #fff;
  padding: 10px 18px;
  border-radius: var(--r-pill);
  font-size: var(--fs-sm);
  font-weight: 600;
  z-index: 9999;
  max-width: min(90vw, 320px);
  white-space: nowrap;
  box-shadow: var(--shadow-lg);
}
.acts-p__toast.is-show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ── 스크롤 탑 버튼 (페이지 상단으로 이동) — 오른쪽 하단, 완전한 원형, 테마 영향 차단 ── */
.acts-p__scroll-top,
.acts-p .ap-scroll-top {
  position: fixed !important;
  left: auto !important;
  right: 18px !important;
  bottom: calc(76px + var(--safe-b, 0px));
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: none;
  background: var(--ap-primary) !important;
  color: #fff !important;
  cursor: pointer;
  display: flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(69,65,255,.35);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .25s, transform .25s;
  pointer-events: none;
  z-index: 88;
  appearance: none;
  font: inherit;
  box-sizing: border-box;
}
.acts-p__scroll-top.is-on,
.acts-p .ap-scroll-top.is-on {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.acts-p .ap-scroll-top .jmp-acts-ri { font-size: 22px; color: #fff !important; }

/* FAB(글추가)와 겹침 방지: 사역자 본인 프로필에서는 스크롤 탑을 왼쪽에 배치 */
#actsProfileRoot:has(.ap-fab) .ap-scroll-top {
  left: 18px !important;
  right: auto !important;
}

/* ── 루트 컨테이너에만 min-height 100vh 적용 ── */
#actsProfileRoot {
  min-height: 100vh;
}

/* 영상·QR 모달: 루트 밖에 두는 경우에도 동작. acts-profile-design 미로드 시 최소 오버레이 */
.acts-profile-video-modal,
.acts-profile-qr-modal {
  position: fixed;
  inset: 0;
  z-index: 100020;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  box-sizing: border-box;
}
.acts-profile-qr-modal {
  padding: 1.5rem;
  z-index: 100019;
}
.acts-profile-video-modal[hidden],
.acts-profile-qr-modal[hidden] {
  display: none !important;
}
.acts-profile-video-modal-backdrop,
.acts-profile-qr-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  cursor: pointer;
}
.acts-profile-video-modal-content,
.acts-profile-qr-modal-content {
  position: relative;
  z-index: 1;
  max-width: 100%;
  box-sizing: border-box;
}
/**
 * Acts 사역자 프로필 — 컴포넌트 (버튼·배지·통계·아이템)
 * Solapi 디자인 기반
 *
 * @version 2.1.0
 * @location joyn-members-pro/modules/acts/assets/acts-profile-components.css
 */

/* ── 버튼 베이스 ──────────────────────────────────────────── */
.acts-p .ap-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  font-weight: 700;
  font-family: var(--font);
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  color: var(--ap-text);
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s, box-shadow .15s, background .15s, border-color .15s;
  white-space: nowrap;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  line-height: 1.4;
}
.acts-p .ap-btn:hover  { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.acts-p .ap-btn:active { transform: scale(.97); }

/* Primary */
.acts-p .ap-btn--primary {
  background: var(--ap-primary);
  border-color: var(--ap-primary);
  color: #fff;
  box-shadow: 0 4px 14px rgba(69,65,255,.28);
}
.acts-p .ap-btn--primary:hover { box-shadow: 0 6px 20px rgba(69,65,255,.38); }

/* Ghost / Outline */
.acts-p .ap-btn--ghost {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}

/* Muted */
.acts-p .ap-btn--muted {
  background: var(--ap-soft);
  border-color: var(--ap-border);
  color: var(--ap-muted);
}

/* Danger */
.acts-p .ap-btn--danger {
  background: rgba(239,68,68,.08);
  border-color: rgba(239,68,68,.2);
  color: var(--ap-error);
}

/* Size variants */
.acts-p .ap-btn--sm { padding: 6px 12px; font-size: var(--fs-xs); border-radius: var(--r-sm); }
.acts-p .ap-btn--lg { padding: 12px 22px; font-size: var(--fs-base); border-radius: var(--r-lg); }
.acts-p .ap-btn--icon {
  width: 36px; height: 36px;
  padding: 0;
  justify-content: center;
  border-radius: var(--r-md);
}
.acts-p .ap-btn--full { width: 100%; justify-content: center; }

/* Disabled */
.acts-p .ap-btn[disabled],
.acts-p .ap-btn--disabled {
  opacity: .42;
  pointer-events: none;
  cursor: not-allowed;
}

/* ── 레벨 배지 ────────────────────────────────────────────── */
.acts-p .ap-lv {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  font-weight: 700;
  border: 1px solid;
}
.acts-p .ap-lv--beginner { background: rgba(22,163,74,.10);  border-color: rgba(22,163,74,.25);  color: var(--ap-lv-beginner); }
.acts-p .ap-lv--active   { background: rgba(202,138,4,.10);  border-color: rgba(202,138,4,.25);  color: var(--ap-lv-active); }
.acts-p .ap-lv--pro      { background: rgba(220,38,38,.09);  border-color: rgba(220,38,38,.22);  color: var(--ap-lv-pro); }
.acts-p .ap-lv--master   { background: rgba(124,58,237,.10); border-color: rgba(124,58,237,.24); color: var(--ap-lv-master); }
.acts-p .ap-lv--elite    { background: rgba(8,145,178,.10);  border-color: rgba(8,145,178,.24);  color: var(--ap-lv-elite); }

/* 레벨 아이콘 칩 (이름 옆) */
.acts-p .ap-lv-icon {
  width: 28px; height: 28px;
  border-radius: 9px;
  border: 1px solid;
  display: grid;
  place-items: center;
  font-size: 14px;
  flex-shrink: 0;
}
.acts-p .ap-lv-icon.ap-lv--beginner { background: rgba(22,163,74,.10);  border-color: rgba(22,163,74,.25);  color: var(--ap-lv-beginner); }
.acts-p .ap-lv-icon.ap-lv--active   { background: rgba(202,138,4,.10);  border-color: rgba(202,138,4,.25);  color: var(--ap-lv-active); }
.acts-p .ap-lv-icon.ap-lv--pro      { background: rgba(220,38,38,.09);  border-color: rgba(220,38,38,.22);  color: var(--ap-lv-pro); }
.acts-p .ap-lv-icon.ap-lv--master   { background: rgba(124,58,237,.10); border-color: rgba(124,58,237,.24); color: var(--ap-lv-master); }
.acts-p .ap-lv-icon.ap-lv--elite    { background: rgba(8,145,178,.10);  border-color: rgba(8,145,178,.24);  color: var(--ap-lv-elite); }

/* 아바타 하단 레벨 뱃지 */
.acts-p .ap-avatar-lv {
  position: absolute;
  bottom: 2px; right: 2px;
  width: 26px; height: 26px;
  border-radius: 50%;
  border: 2.5px solid var(--ap-white);
  display: grid;
  place-items: center;
  font-size: 13px;
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
  z-index: 2;
}

/* ── 통계 그리드 ──────────────────────────────────────────── */
.acts-p .ap-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-top: 10px;
}
@media (max-width: 480px) {
  .acts-p .ap-stats { grid-template-columns: repeat(2, 1fr); }
}
.acts-p .ap-stat {
  background: var(--ap-white);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-md);
  padding: 10px 6px;
  text-align: center;
  box-shadow: var(--shadow-sm);
  transition: transform .15s, box-shadow .15s;
}
.acts-p .ap-stat:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.acts-p .ap-stat__num {
  font-size: var(--fs-lg);
  font-weight: 900;
  letter-spacing: -.5px;
  line-height: 1.1;
  color: var(--ap-dark);
}
.acts-p .ap-stat__label {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ap-muted);
  margin-top: 3px;
}

/* ── 콘텐츠 아이템 카드 ───────────────────────────────────── */
.acts-p .ap-item {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-sm);
  padding: var(--sp-sm) var(--sp-md);
  border-bottom: 1px solid var(--ap-border);
  transition: background .14s;
}
.acts-p .ap-item:last-child { border-bottom: none; }
.acts-p .ap-item:hover { background: var(--ap-soft); }

.acts-p .ap-item__thumb {
  width: var(--ap-item-thumb-size);
  height: var(--ap-item-thumb-size);
  border-radius: var(--r-sm);
  border: 1px solid var(--ap-border);
  background: var(--ap-soft);
  display: grid;
  place-items: center;
  font-size: var(--ap-item-thumb-icon-size);
  color: var(--ap-muted);
  flex-shrink: 0;
  overflow: hidden;
}
.acts-p .ap-item__thumb img { width: 100%; height: 100%; object-fit: cover; }

.acts-p .ap-item__body { flex: 1; min-width: 0; }
.acts-p .ap-item__title {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-dark);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}
/* 영상 탭: 썸네일·제목 클릭으로 펼침( JS: js-item-expand-hit ) */
.acts-p #ap-panel-video .js-item-expand-hit { cursor: pointer; }
.acts-p .ap-item__meta {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  font-weight: 500;
  margin-top: 3px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.acts-p .ap-item__meta .jmp-acts-ri { font-size: 13px; }
.acts-p .ap-item__actions { flex-shrink: 0; display: flex; gap: 6px; align-items: center; }

/* ── 심플 리스트 모드(접힘 상태) ─────────────────────────── */
/* 기본: 제목 + 우측 버튼. HTML Maker 등 썸네일이 있으면 목록에서도 썸네일 표시 */
.acts-p .ap-item:not(.is-expanded) { align-items: center; gap: 0; }
.acts-p .ap-item:not(.is-expanded).ap-item--has-list-thumb { gap: var(--sp-sm); }
.acts-p .ap-item:not(.is-expanded) .ap-item__thumb:not(.ap-item__thumb--has) { display: none; }
.acts-p .ap-item:not(.is-expanded) .ap-item__thumb.ap-item__thumb--has { display: grid; }
.acts-p .ap-item:not(.is-expanded) .ap-item__meta { display: none; }
.acts-p .ap-item__content--collapsed { display: none !important; }
.acts-p .ap-pin-badge { display: none; }

/*
 * 펼친 상태(더보기): 우측 액션을 절대 배치 → 본문 열이 카드 전체 폭 사용
 * (데스크톱에서 flex 형제 .ap-item__actions 때문에 HTML Maker iframe 가로가 줄어들던 문제 수정)
 */
.acts-p .ap-item.is-expanded {
  /* 펼침 시 액션(더보기·수정·핀·삭제) 한 줄 — 본문 우측 여백 */
  --ap-item-actions-strip: min(220px, 46vw);
  position: relative;
  flex-direction: row;
  align-items: flex-start;
  gap: 0;
  padding-top: 40px;
}
/*
 * 비 HM + ap-item__head-row: 썸네일·제목·액션 = 한 박스 가로 한 줄, 본문은 아래 행(풀블리드)
 * (:has 미지원 브라우저는 일정 등 레거시 행 레이아웃 유지)
 */
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) {
  flex-direction: column;
  align-items: stretch;
  gap: var(--sp-sm);
}
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--sp-md);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-sm);
}
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__head-main {
  flex: 0 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__title {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__meta {
  flex-shrink: 0;
  margin-top: 0;
}
.acts-p .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__actions {
  margin-left: auto;
  flex-shrink: 0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}
.acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) {
  flex-direction: column;
  align-items: stretch;
  gap: var(--sp-md);
  padding-top: var(--sp-sm);
}
.acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__body {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding-right: 0 !important;
  flex: none;
}
.acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__actions {
  position: static;
  max-width: none;
  overflow: visible;
}
.acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__body > .ap-item__content--full {
  width: calc(100% + 2 * var(--sp-md));
  max-width: none;
  margin-left: calc(-1 * var(--sp-md));
  margin-right: calc(-1 * var(--sp-md));
  margin-top: 0;
  padding-right: 0 !important;
  box-sizing: border-box;
}
.acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__title {
  white-space: nowrap;
}
.acts-p .ap-item.is-expanded .ap-item__title { white-space: normal; }
.acts-p .ap-item.is-expanded .ap-item__body {
  width: 100%;
  flex: 1 1 100%;
  min-width: 0;
  max-width: 100%;
  padding-right: var(--ap-item-actions-strip);
  box-sizing: border-box;
}
.acts-p .ap-item.is-expanded .ap-item__actions {
  position: absolute;
  top: 10px;
  right: 12px;
  left: auto;
  width: max-content;
  max-width: min(var(--ap-item-actions-strip), calc(100% - var(--ap-item-thumb-size) - 1.25rem));
  justify-content: flex-end;
  flex-wrap: nowrap;
  align-items: center;
  margin-top: 0;
  gap: 4px;
  z-index: 2;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
/*
 * HTML Maker( html_public_url ) 카드: 상단 헤더 박스 + 본문(임베드) 영역 분리
 */
.acts-p .ap-item--hm-inline {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: var(--sp-md);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-sm);
}
/* HM 펼침: 제목 박스와 본문 시각적 분리 */
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__hm-header {
  margin-bottom: 0;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header .ap-item__thumb {
  flex-shrink: 0;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header-main {
  flex: 0 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header-main .ap-item__title {
  flex: 0 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header-main .ap-item__meta {
  flex-shrink: 0;
  margin-top: 0;
}
/* 펼침 시에도 HM 상단 머리글 제목은 한 줄(말줄임) 유지 */
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__hm-header-main .ap-item__title {
  white-space: nowrap;
}
.acts-p .ap-item--hm-inline .ap-item__hm-header .ap-item__actions {
  position: static;
  flex-shrink: 0;
  margin-left: auto;
  max-width: none;
  justify-content: flex-end;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}
.acts-p .ap-item--hm-inline .ap-item__body--hm {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 0;
  margin: 10px 0 0;
  border: none;
  background: transparent;
  box-sizing: border-box;
}
.acts-p .ap-item--hm-inline.is-expanded .ap-item__body--hm {
  margin-top: var(--sp-md);
  padding-top: var(--sp-md);
  border-top: 1px solid var(--ap-border);
}
.acts-p .ap-item--hm-inline .ap-item__content--full {
  margin-top: 0;
  padding: 0;
  width: 100%;
  max-width: none;
}
/* 펼침: 헤더가 박스 안에 버튼을 포함하므로 카드 상단 여백·절대 액션 제거 */
.acts-p .ap-item.is-expanded.ap-item--hm-inline {
  flex-direction: column;
  align-items: stretch;
  padding-top: var(--sp-sm);
}
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__body--hm {
  padding-right: 0;
  flex: none;
  /* 카드 좌우 패딩까지 본문(영상·HM)이 쓰도록 풀블리드 */
  width: calc(100% + 2 * var(--sp-md));
  max-width: none;
  margin-left: calc(-1 * var(--sp-md));
  margin-right: calc(-1 * var(--sp-md));
  box-sizing: border-box;
}
/* HM 본문: 카드 좌우 패딩만큼 확장 후 임베드 내부 가로 패딩 0 */
.acts-p .ap-item__hm-embed-zone {
  width: calc(100% + 2 * var(--sp-md));
  max-width: none;
  margin-left: calc(-1 * var(--sp-md));
  margin-right: calc(-1 * var(--sp-md));
  box-sizing: border-box;
  padding: 0;
  border: none;
  background: transparent;
}
.acts-p .ap-item__hm-embed-zone .ap-item__inline-hm-php {
  border: none;
  background: transparent;
  margin-top: 0;
  border-radius: 0;
}
.acts-p .ap-item__hm-embed-zone .jmp-hm-page,
.acts-p .ap-item__hm-embed-zone .jmp-hm-embed {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.acts-p .ap-item__hm-embed-zone .jmp-hm-block {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* HM 펼침: 본문 래퍼가 이미 풀블리드 — 임베드는 100%만 사용(이중 음수마진 방지) */
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__inline-html-wrap,
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__inline-hm-php,
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__inline-video-wrap {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}
.acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__hm-embed-zone {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* 프로필 안 HM 커버: 한 화면에 정보가 몰리지 않게 타이포·여백만 살짝 조정 */
.acts-p .ap-item__inline-hm-php .jmp-hm-cover__meta {
  padding: 14px 12px 12px;
}
.acts-p .ap-item__inline-hm-php .jmp-hm-cover__title {
  font-size: clamp(17px, 4.2vw, 20px);
  line-height: 1.28;
}
.acts-p .ap-item__inline-hm-php .jmp-hm-cover__type-badge {
  margin-bottom: 6px;
}

/* ── 모바일·태블릿 ── */
@media (max-width: 768px) {
  .acts-p .ap-item { padding: 10px 12px; }

  .acts-p .ap-item:not(.is-expanded) { justify-content: space-between; }

  .acts-p .ap-item.is-expanded {
    /* 모바일도 액션 버튼 가로 한 줄(필요 시 본문과 줄바꿈만, 버튼끼리 세로 쌓임 방지) */
    --ap-item-actions-strip: min(240px, 78vw);
  }

  .acts-p .ap-item__content--full { margin-top: 0 !important; }
  .acts-p .ap-item__section-label { margin-top: 4px !important; }
  .acts-p .ap-item__content-text {
    margin-top: 4px !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* 영상·강의 탭: 펼침 하단 링크 열기 행 비표시(캐시 HTML 대비) */
  .acts-p #ap-panel-video .ap-item__media-link,
  .acts-p #ap-panel-lectures .ap-item__media-link {
    display: none !important;
  }
  .acts-p .ap-item__inline-video-wrap,
  .acts-p .ap-item__inline-html-wrap,
  .acts-p .ap-item__inline-hm-php {
    border-radius: 10px;
    margin-top: 4px !important;
  }

  /* HM 카드: 모바일도 ap-item 좌우 12px 패딩에 맞춰 존 확장 */
  .acts-p .ap-item__hm-embed-zone {
    width: calc(100% + 24px);
    margin-left: -12px;
    margin-right: -12px;
  }

  /* 펼침 본문 풀블리드: 모바일 패딩 12px에 맞춤 */
  .acts-p .ap-item.is-expanded.ap-item--hm-inline .ap-item__body--hm {
    width: calc(100% + 24px);
    margin-left: -12px;
    margin-right: -12px;
  }
  .acts-p .ap-item.is-expanded:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__body > .ap-item__content--full {
    width: calc(100% + 24px);
    margin-left: -12px;
    margin-right: -12px;
  }

  /* iframe 폴백만 고정 최소 높이 — PHP 인라인은 본문 높이만큼만 쓰고 페이지 스크롤 사용 */
  .acts-p .ap-item.is-expanded .ap-item__inline-html-wrap {
    min-height: min(1200px, 95vh);
  }
  .acts-p .ap-item.is-expanded .ap-item__inline-html-iframe {
    height: min(1400px, 95vh);
    min-height: min(900px, 90vh);
  }
  .acts-p .ap-item__media-thumb-xl {
    border-radius: 10px;
    margin-top: 4px !important;
  }

  /* 방문자: 핀만 숨김(삭제는 HTML에 있을 때만 — 편집권한자 모바일에서도 보이게) */
  .acts-p:not(.is-own) .ap-item__actions .js-pin-toggle {
    display: none !important;
  }

  /* 본인: 수정·삭제·핀 등이 가로로 넘치지 않게(모바일 전 구간) */
  .acts-p.is-own .ap-item:not(.ap-item--hm-inline):has(> .ap-item__head-row) > .ap-item__head-row .ap-item__actions {
    flex-wrap: wrap;
    row-gap: 4px;
    max-width: 100%;
    justify-content: flex-end;
  }
  .acts-p.is-own .ap-item--hm-inline .ap-item__hm-header .ap-item__actions {
    flex-wrap: wrap;
    row-gap: 4px;
    max-width: 100%;
    justify-content: flex-end;
  }
  .acts-p.is-own .ap-item.is-expanded .ap-item__actions {
    max-width: min(360px, calc(100vw - 20px));
  }

  /*
   * 접힘 + head-row: 루트 overflow-x:hidden 때문에 액션이 잘리는 경우 방지
   * (수정 버튼이 있으면 삭제·핀·펼치기까지 한 줄에 못 넣을 때 다음 줄)
   */
  .acts-p .ap-item:not(.is-expanded):not(.ap-item--hm-inline):has(> .ap-item__head-row):has(.ap-item__actions .js-item-edit) > .ap-item__head-row {
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .acts-p .ap-item:not(.is-expanded):not(.ap-item--hm-inline):has(> .ap-item__head-row):has(.ap-item__actions .js-item-edit) > .ap-item__head-row .ap-item__actions {
    flex: 1 1 100%;
    max-width: 100%;
    justify-content: flex-end;
    margin-left: 0;
  }
  .acts-p .ap-item:not(.is-expanded).ap-item--hm-inline .ap-item__hm-header:has(.ap-item__actions .js-item-edit) {
    flex-wrap: wrap;
    row-gap: 8px;
  }
  .acts-p .ap-item:not(.is-expanded).ap-item--hm-inline .ap-item__hm-header:has(.ap-item__actions .js-item-edit) .ap-item__actions {
    flex: 1 1 100%;
    max-width: 100%;
    justify-content: flex-end;
    margin-left: 0;
  }
}

/* ── 리스트 펼치기 (내용/링크 확장) ─────────────────────────── */
.acts-p .ap-item__content--full { display: none; }
.acts-p .ap-item__content--full {
  color: var(--ap-dark);
  font-size: var(--fs-xs);
  line-height: 1.5;
  margin-top: 4px;
  white-space: normal;
}
.acts-p .ap-item__content--collapsed {
  color: var(--ap-dark);
  font-size: var(--fs-xs);
  line-height: 1.5;
  margin-top: 4px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.acts-p .ap-item.is-expanded .ap-item__content--full { display: block; }
.acts-p .ap-item.is-expanded .ap-item__content--collapsed { display: none; }

/* HTML Maker 인라인: WebKit 기본 iframe 폭(300px)·flex 자식 min-width 완화 */
.acts-p .ap-item.is-expanded .ap-item__content--full {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.acts-p .ap-item__section-label {
  font-size: var(--fs-xs);
  font-weight: 800;
  color: var(--ap-muted);
  margin-top: 6px;
}
.acts-p .ap-item__section-label:first-child { margin-top: 0; }

.acts-p .ap-item__content-text {
  margin-top: 6px;
  color: var(--ap-dark);
  font-size: var(--fs-xs);
  line-height: 1.6;
}

.acts-p .ap-item__inline-video-wrap {
  margin-top: 6px;
  width: 100%;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: #000;
  aspect-ratio: 16 / 9;
  position: relative;
}
.acts-p .ap-item__inline-video-iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  position: absolute;
  inset: 0;
}

.acts-p .ap-item__inline-html-wrap {
  margin-top: 6px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: var(--ap-soft);
  border: 1px solid var(--acts-border);
  min-height: 900px;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.acts-p .ap-item__inline-html-iframe {
  width: 100% !important;
  min-width: 100%;
  max-width: 100%;
  height: min(1100px, 95vh);
  min-height: 900px;
  border: none;
  display: block;
  box-sizing: border-box;
}

/* HTML Maker: 서버/REST 인라인 PHP 조각 (.jmp-hm-embed) — 내부 스크롤 없이 페이지 기본 스크롤 */
.acts-p .ap-item__inline-hm-php {
  margin-top: 6px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-radius: var(--r-sm);
  overflow: visible;
  background: var(--ap-soft);
  border: 1px solid var(--acts-border);
  min-height: 0;
  position: relative;
}
.acts-p .ap-item__inline-hm-php .jmp-hm-embed {
  max-width: 100%;
  overflow: visible;
}

.acts-p .ap-item__media-thumb-xl {
  margin-top: 6px;
  width: 100%;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: var(--ap-soft);
  aspect-ratio: 16 / 9;
}
.acts-p .ap-item__media-thumb-xl img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 영상·강의 탭: 펼침 하단 링크 열기 행 비표시(캐시 HTML 대비) */
.acts-p #ap-panel-video .ap-item__media-link,
.acts-p #ap-panel-lectures .ap-item__media-link {
  display: none !important;
}

.acts-p .ap-item__link-full { display: none; }
.acts-p .ap-item__link-full {
  margin-top: 6px;
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  word-break: break-word;
}
.acts-p .ap-item.is-expanded .ap-item__link-full { display: block; }
.acts-p .ap-item__link-full a {
  color: var(--ap-primary);
  text-decoration: none;
  font-weight: 700;
}
.acts-p .ap-item__link-full a:hover { text-decoration: underline; }

.acts-p .js-item-expand-toggle {
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

/* 모바일: 더보기/접기 글자 숨김 — 이 블록은 위 기본 .js-item-expand-toggle 보다 뒤에 두어 덮어쓰기 */
@media (max-width: 768px) {
  .acts-p .js-item-expand-toggle {
    gap: 0;
    padding-left: 8px;
    padding-right: 8px;
  }
  .acts-p .js-item-expand-toggle .js-item-expand-text {
    display: none !important;
  }
}

/* 좁은 폭: 펼침 액션줄 여유(768 구간과 중첩 가능) */
@media (max-width: 480px) {
  .acts-p.is-own .ap-item.is-expanded {
    --ap-item-actions-strip: min(340px, calc(100vw - 28px));
  }
  .acts-p.is-own .ap-item.is-expanded .ap-item__actions {
    max-width: min(340px, calc(100vw - 20px));
  }
  .acts-p .ap-item.is-expanded .ap-item__actions .ap-btn--sm {
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* ── 태그 / 칩 ────────────────────────────────────────────── */
.acts-p .ap-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  font-weight: 700;
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  color: var(--ap-muted);
}
.acts-p .ap-tag--accent {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}

/* ── 페이지네이션 ─────────────────────────────────────────── */
.acts-p .ap-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: var(--sp-md);
  flex-wrap: wrap;
}
.acts-p .ap-pager a,
.acts-p .ap-pager span {
  width: 34px; height: 34px;
  display: grid;
  place-items: center;
  border-radius: var(--r-sm);
  font-size: var(--fs-xs);
  font-weight: 700;
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  color: var(--ap-muted);
  text-decoration: none;
  transition: background .14s, color .14s, border-color .14s;
}
.acts-p .ap-pager a:hover {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}
.acts-p .ap-pager span.current {
  background: var(--ap-primary);
  border-color: var(--ap-primary);
  color: #fff;
}
.acts-p .ap-pager .ap-pager__arrow { width: auto; padding: 0 10px; gap: 4px; }

/* ── 미니 패널 (바텀시트 내부 / 소개 섹션) ─────────────────── */
.acts-p .ap-mini {
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-md);
  padding: var(--sp-sm) var(--sp-md);
  margin-top: var(--sp-sm);
}
.acts-p .ap-mini__title {
  font-size: var(--fs-xs);
  font-weight: 800;
  color: var(--ap-muted);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.acts-p .ap-mini__title .jmp-acts-ri { font-size: 14px; }
.acts-p .ap-mini__text {
  font-size: var(--fs-sm);
  line-height: 1.65;
  color: var(--ap-text);
  font-weight: 500;
}

/* ── SNS 버튼 ─────────────────────────────────────────────── */
.acts-p .ap-sns { display: flex; gap: 8px; flex-wrap: wrap; }
.acts-p .ap-sns__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: var(--r-pill);
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  color: var(--ap-text);
  font-size: var(--fs-sm);
  font-weight: 600;
  text-decoration: none;
  transition: border-color .15s, background .15s, transform .12s, color .15s;
}
.acts-p .ap-sns__btn:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.acts-p .ap-sns__btn.sns-instagram:hover { border-color: #ee2a7b; color: #ee2a7b; background: rgba(238,42,123,.06); }
.acts-p .ap-sns__btn.sns-youtube:hover   { border-color: rgba(255,0,0,.35); color: #ff0000; background: rgba(255,0,0,.06); }
.acts-p .ap-sns__btn.sns-website:hover   { border-color: var(--ap-primary-border); color: var(--ap-primary); background: var(--ap-primary-soft); }

/* ── 인라인 알림 배너 ─────────────────────────────────────── */
.acts-p .ap-notice {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 14px;
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: var(--sp-sm);
}
.acts-p .ap-notice .jmp-acts-ri { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
.acts-p .ap-notice--info    { background: var(--ap-primary-soft); border: 1px solid var(--ap-primary-border); color: var(--ap-primary); }
.acts-p .ap-notice--success { background: rgba(16,185,129,.08); border: 1px solid rgba(16,185,129,.2); color: var(--ap-success); }
.acts-p .ap-notice--warn    { background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.2); color: var(--ap-warning); }
/**
 * Acts 사역자 프로필 — 상단바 · 히어로 · 탭 내비게이션
 * Solapi 디자인 기반
 *
 * @version 2.1.0
 * @location joyn-members-pro/modules/acts/assets/acts-profile-layout.css
 */

/* ── 상단 네비바 (화면 꽉 차게) ───────────────────────────── */
.acts-p .ap-topbar {
  position: sticky;
  top: 0;
  z-index: 100;
  background: color-mix(in srgb, var(--ap-bg) 85%, transparent);
  backdrop-filter: blur(16px) saturate(1.4);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid var(--ap-border);
  margin-left: calc(-1 * clamp(8px, 2vw, 20px));
  margin-right: calc(-1 * clamp(8px, 2vw, 20px));
  padding: 0 clamp(8px, 2vw, 20px);
}
.acts-p .ap-topbar__inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 11px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-sm);
}
.acts-p .ap-topbar__left  { display: flex; align-items: center; gap: 10px; min-width: 0; order: 1; }
.acts-p .ap-topbar__right { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-shrink: 0; margin-left: auto; order: 2; }

/* 로고 */
.acts-p .ap-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  font-size: var(--fs-lg);
  letter-spacing: .2px;
  text-decoration: none;
  color: var(--ap-dark) !important;
  white-space: nowrap;
}
.acts-p .ap-logo::before {
  content: '';
  width: 9px; height: 9px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ap-primary), var(--ap-primary-light));
  box-shadow: 0 0 0 4px var(--ap-primary-soft);
  flex-shrink: 0;
}
.acts-p .ap-logo span {
  font-weight: 500;
  opacity: .65;
  font-size: var(--fs-base);
}

/* 빵부스러기 */
.acts-p .ap-breadcrumb {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  font-weight: 600;
  overflow: hidden;
}
.acts-p .ap-breadcrumb a { color: var(--ap-muted); text-decoration: none; white-space: nowrap; }
.acts-p .ap-breadcrumb a:hover { color: var(--ap-text); }
.acts-p .ap-breadcrumb__sep { opacity: .4; }
.acts-p .ap-breadcrumb__cur {
  color: var(--ap-dark);
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 120px;
}
@media (max-width: 480px) { .acts-p .ap-breadcrumb { display: none; } }

/* 상단 대시보드 바로가기 (본인·관리자·편집자만) — 원형 버튼 */
.acts-p .ap-topbar .ap-topbar__icon.ap-topbar__dashboard {
  box-sizing: border-box;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid var(--ap-border);
  background: var(--ap-white) !important;
  color: var(--ap-muted) !important;
  display: grid !important;
  place-items: center;
  text-decoration: none;
  transition: background .14s, transform .12s;
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-topbar .ap-topbar__icon.ap-topbar__dashboard:hover { background: var(--ap-soft) !important; color: var(--ap-text) !important; }
.acts-p .ap-topbar .ap-topbar__icon.ap-topbar__dashboard:active { transform: scale(.9); }
.acts-p .ap-topbar .ap-topbar__icon.ap-topbar__dashboard .jmp-acts-ri { font-size: 20px; }

/* ── 히어로 섹션 (페이지에 자연스럽게 녹아드는 스타일) ──────────── */
.acts-p .ap-hero {
  background: transparent;
  margin-top: 0;
  overflow: visible;
  position: relative;
}
/* 배너 영역 — 배경 이미지 + 하단 페이드 (페이지 배경으로 자연스럽게) */
/* 배너 — 그룹 mission-banner-v2와 동일 160px */
.acts-p .ap-hero__banner {
  height: 160px;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: linear-gradient(135deg, var(--ap-primary-soft) 0%, rgba(167,136,255,.12) 100%);
  background-size: cover;
  /* 상단 기준: 세로로 잘릴 때 머리·로고 등이 잘리지 않도록 */
  background-position: top center;
  position: relative;
}
.acts-p .ap-hero__banner::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 80px;
  background: linear-gradient(to bottom, transparent, var(--ap-bg));
  pointer-events: none;
}
.acts-p .ap-hero__inner {
  /* 좌우 패딩은 .acts-p__page(20px)에서 담당 — 중복 패딩 제거 */
  padding: 0 0 clamp(16px, 3vw, 24px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 0;
  position: relative;
  margin-top: -80px;
}
.acts-p .ap-hero__inner > * { position: relative; z-index: 1; }

/* 메인 행: 아바타(좌) + 액션 버튼(우) — 그룹 프로필(MG)과 높이 맞춤 */
.acts-p .ap-hero__main {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-bottom: 14px;
}

/* 아바타 — 그룹 프로필과 동일 88px */
.acts-p .ap-avatar-wrap {
  position: relative;
  width: 88px;
  height: 88px;
  flex-shrink: 0;
}
.acts-p .ap-avatar {
  width: 100%; height: 100%;
  border-radius: 22px;
  object-fit: cover;
  border: 3px solid var(--ap-bg);
  box-shadow: 0 4px 20px rgba(0,0,0,.12);
}
.acts-p .ap-avatar-lv {
  bottom: 4px; right: 4px;
}

/* 액션 버튼 — 우측, 프로필 하단에 맞춤 */
.acts-p .ap-hero__main .ap-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: flex-end;
  align-items: flex-end;
  margin-top: 0;
  width: auto;
  max-width: 100%;
}
.acts-p .ap-hero__main .ap-hero__actions .ap-hero__action.is-primary {
  flex: 1 1 100%;
  min-width: 140px;
}
@media (max-width: 480px) {
  .acts-p .ap-hero__main .ap-hero__actions {
    flex: 1;
    justify-content: flex-end;
  }
  .acts-p .ap-hero__main .ap-hero__actions .ap-hero__action.is-primary {
    flex: 1 1 100%;
  }
}

/* 프로필 정보: 이름 + 레벨 · 메타 — 그룹과 동일 간격 */
.acts-p .ap-hero__info {
  width: 100%;
  margin-bottom: 0;
}
.acts-p .ap-hero__name-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}
.acts-p .ap-hero__name {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.5px;
  line-height: 1.2;
  color: var(--ap-dark);
  margin: 0;
}
.acts-p .ap-hero__level-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  font-size: var(--fs-xs);
  font-weight: 700;
  white-space: nowrap;
}
.acts-p .ap-hero__level-badge.ap-lv--beginner { background: rgba(22,163,74,.12); color: #15803d; }
.acts-p .ap-hero__level-badge.ap-lv--active { background: rgba(202,138,4,.12); color: #a16207; }
.acts-p .ap-hero__level-badge.ap-lv--pro { background: rgba(220,38,38,.12); color: #b91c1c; }
.acts-p .ap-hero__level-badge.ap-lv--master { background: rgba(124,58,237,.12); color: #6d28d9; }
.acts-p .ap-hero__level-badge.ap-lv--elite { background: rgba(8,145,178,.12); color: #0e7490; }
.acts-p .ap-hero__level-badge .jmp-acts-ri { font-size: 14px; }
.acts-p .ap-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 14px;
  gap: 6px;
  font-size: 13px;
  color: var(--ap-muted);
}
.acts-p .ap-hero__meta-sep {
  color: var(--ap-border);
  font-weight: 400;
  margin: 0 2px;
}
.acts-p .ap-hero__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.acts-p .ap-hero__meta-item .jmp-acts-ri { font-size: 13px; }
.acts-p .ap-hero__meta-js { color: var(--ap-primary); font-weight: 600; }

/* 멤버가입 버튼 — 그린 액센트 (그룹 프로필 스타일) */
.acts-p .ap-hero__action.acts-profile-cta-join-free,
.acts-p .ap-hero__action.acts-profile-cta-join-paid {
  background: rgba(34,197,94,.1);
  border-color: rgba(34,197,94,.35);
  color: #16a34a;
}
.acts-p .ap-hero__action.acts-profile-cta-join-free:hover,
.acts-p .ap-hero__action.acts-profile-cta-join-paid:hover {
  background: rgba(34,197,94,.18);
  border-color: rgba(34,197,94,.5);
}
/* 언팔로우 — 빨간 위험 스타일 */
.acts-p .ap-hero__action.acts-profile-cta-leave {
  background: rgba(239,68,68,.10);
  border-color: rgba(239,68,68,.35);
  color: #dc2626;
}
.acts-p .ap-hero__action.acts-profile-cta-leave:hover {
  background: rgba(239,68,68,.16);
  border-color: rgba(239,68,68,.55);
  color: #b91c1c;
}

/* 더보기 버튼 — 그룹 mission-intro-btn과 동일 */
.acts-p .ap-hero__more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 0;
  margin-bottom: 6px;
  padding: 11px 14px;
  border-radius: 10px;
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  font-size: 13px;
  font-weight: 500;
  color: var(--ap-text);
  cursor: pointer;
  transition: background .14s, border-color .14s, color .14s;
  font-family: var(--font);
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-hero__more:hover { background: var(--ap-primary-soft); border-color: var(--ap-primary-border); color: var(--ap-primary); }
.acts-p .ap-hero__more-left { display: flex; align-items: center; gap: 7px; }

/* 액션 버튼 (기본: 메인 내 우측) */
.acts-p .ap-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.acts-p .ap-hero__action {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 36px;
  height: 36px;
  padding: 0 10px;
  border-radius: var(--r-md);
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  color: var(--ap-text);
  font-size: var(--fs-xs);
  font-weight: 700;
  font-family: var(--font);
  cursor: pointer;
  text-decoration: none;
  transition: transform .14s, box-shadow .14s, background .14s;
  white-space: nowrap;
  box-shadow: var(--shadow-sm);
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.acts-p .ap-hero__action:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.acts-p .ap-hero__action:active { transform: scale(.96); }
/* 아이콘 전용 버튼 — 정사각형, 텍스트 숨김 */
.acts-p .ap-hero__action.ap-hero__action--icon-only {
  width: 36px;
  min-width: 36px;
  height: 36px;
  padding: 0;
  flex: 0 0 auto;
}
/* 히어로 액션 아이콘 — 기준 18px 대비 130% (모바일·데스크톱 공통) */
.acts-p .ap-hero__action .jmp-acts-ri { font-size: calc(18px * 1.3); }
.acts-p .ap-hero__action.ap-hero__action--icon-only .jmp-acts-ri { font-size: calc(18px * 1.3); }
.acts-p .ap-hero__main .ap-hero__actions .ap-hero__action.is-primary.ap-hero__action--icon-only {
  flex: 0 0 auto;
  min-width: 36px;
}
.acts-p .ap-hero__action.is-primary {
  background: var(--ap-primary);
  border-color: var(--ap-primary);
  color: #fff;
  box-shadow: 0 4px 14px rgba(69,65,255,.28);
}
.acts-p .ap-hero__action.is-primary:hover { box-shadow: 0 6px 20px rgba(69,65,255,.38); }
.acts-p .ap-hero__action.is-ghost {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}

/* 퀵 탭 칩 */
.acts-p .ap-navchips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-top: 10px;
  width: 100%;
}
.acts-p .ap-navchip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 10px;
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--ap-text);
  font-family: var(--font);
  cursor: pointer;
  white-space: nowrap;
  transition: transform .14s, box-shadow .14s, background .14s, border-color .14s, color .14s;
  box-shadow: var(--shadow-sm);
  -webkit-tap-highlight-color: transparent;
  text-decoration: none;
}
.acts-p .ap-navchip:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}
.acts-p .ap-navchip .jmp-acts-ri { font-size: 14px; opacity: .6; }

/* ── 탭 내비게이션 — 그룹 mission-tabs-bar와 동일 ───────────── */
.acts-p .ap-tabs {
  position: sticky;
  top: var(--ap-topbar-h, 57px);
  z-index: 90;
  /* 데스크톱에서 흰 띠가 과하게 길게 보이지 않도록 페이지 배경과 동일하게 */
  background: var(--ap-bg);
  border-bottom: 1px solid var(--ap-border);
  margin-top: 4px;
  margin-bottom: 0;
  margin-left: -20px;
  margin-right: -20px;
  padding: 0 20px;
}
.acts-p .ap-tabs__inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
}
/* 화살표: has-overflow 시 고정 폭 유지, visibility로 표시/숨김 — 레이아웃 움찔 방지 */
.acts-p .ap-tabs__arrow {
  display: none;
  align-items: center;
  width: 36px;
  min-width: 36px;
  padding: 0 6px;
  border: none;
  background: transparent;
  color: var(--ap-muted);
  cursor: pointer;
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-tabs__inner.has-overflow .ap-tabs__arrow {
  display: flex;
}
.acts-p .ap-tabs__arrow.is-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.acts-p .ap-tabs__arrow .jmp-acts-ri { font-size: 20px; }

.acts-p .ap-tabs__bar {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  overscroll-behavior-y: none;
  gap: 0;
  flex: 1;
  min-width: 0;
  scrollbar-width: none;
}
.acts-p .ap-tabs__bar::-webkit-scrollbar { display: none; }

#actsProfileRoot .ap-tab {
  /* Astra/테마 button 기본값 완전 차단 */
  all: unset;
  box-sizing: border-box;
  /* 탭 스타일 — 그룹 mission-tab-item과 동일 */
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 14px 12px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ap-muted);
  font-family: var(--font);
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  cursor: pointer;
  white-space: nowrap;
  transition: color .15s;
  -webkit-tap-highlight-color: transparent;
  flex-shrink: 0;
  position: relative;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: normal;
  -webkit-appearance: none;
}
#actsProfileRoot .ap-tab:hover   { color: var(--ap-primary); }
#actsProfileRoot .ap-tab.is-active {
  color: var(--ap-primary);
  font-weight: 700;
}
#actsProfileRoot .ap-tab.is-active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 20%;
  right: 20%;
  height: 2.5px;
  border-radius: 2px;
  background: var(--ap-primary);
}
#actsProfileRoot .ap-tab .jmp-acts-ri { font-size: 15px; }

/* ── 탭 패널 ──────────────────────────────────────────────── */
.acts-p .ap-panels { margin-top: 6px; }
.acts-p .ap-panel { display: none; }
.acts-p .ap-panel.is-active { display: block; }

/* ── 하단 고정 CTA (방문자) ───────────────────────────────── */
.acts-p .ap-bottombar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 85;
  padding: 10px 14px calc(10px + var(--safe-b));
  background: color-mix(in srgb, var(--ap-bg) 90%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--ap-border);
  display: none;
}
.acts-p .ap-bottombar.is-visible { display: block; }
.acts-p .ap-bottombar__inner {
  max-width: 960px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.acts-p .ap-bottombar__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 13px;
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  font-weight: 800;
  font-family: var(--font);
  cursor: pointer;
  border: 1px solid var(--ap-border);
  background: var(--ap-white);
  color: var(--ap-text);
  text-decoration: none;
  transition: transform .14s;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-bottombar__cta:active { transform: scale(.97); }
.acts-p .ap-bottombar__cta.is-primary {
  background: var(--ap-primary);
  border-color: var(--ap-primary);
  color: #fff;
  box-shadow: 0 4px 16px rgba(69,65,255,.28);
}
.acts-p .ap-bottombar__cta.is-ghost {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
  color: var(--ap-primary);
}

/* ── 바텀 시트 ────────────────────────────────────────────── */
.acts-p .ap-sheet-overlay {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: rgba(0,0,0,.45);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s, visibility .25s;
}
.acts-p .ap-sheet-overlay.is-open { opacity: 1; visibility: visible; }
.acts-p .ap-sheet {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9999;
  max-height: 85vh;
  background: var(--ap-white);
  border-radius: var(--r-xl) var(--r-xl) 0 0;
  box-shadow: 0 -8px 40px rgba(0,0,0,.18);
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.acts-p .ap-sheet.is-open { transform: translateY(0); }
.acts-p .ap-sheet__head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--ap-border);
  position: relative;
}
.acts-p .ap-sheet__handle {
  position: absolute;
  top: 8px; left: 50%;
  transform: translateX(-50%);
  width: 34px; height: 4px;
  border-radius: 2px;
  background: var(--ap-border);
}
.acts-p .ap-sheet__title {
  font-size: var(--fs-base);
  font-weight: 800;
  color: var(--ap-dark);
}
.acts-p .ap-sheet__close {
  position: absolute;
  right: 12px; top: 50%;
  transform: translateY(-50%);
  width: 34px; height: 34px;
  border: none;
  background: var(--ap-soft);
  color: var(--ap-muted);
  border-radius: 50%;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .14s;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-sheet__close:hover { background: var(--ap-border); }
.acts-p .ap-sheet__body {
  overflow-y: auto;
  padding: var(--sp-md);
  -webkit-overflow-scrolling: touch;
  background: var(--ap-bg);
}
/**
 * Acts 사역자 프로필 — 인라인 콘텐츠 에디터
 * 대시보드 없이 탭 내에서 직접 등록 가능한 폼 UI
 *
 * @version 2.1.0
 * @location joyn-members-pro/modules/acts/assets/acts-profile-editor.css
 */

/* ── 인라인 에디터 컨테이너 ───────────────────────────────── */
.acts-p .ap-editor {
  border: 2px dashed var(--ap-primary-border);
  border-radius: var(--r-lg);
  background: var(--ap-primary-soft);
  margin-bottom: var(--sp-md);
  overflow: hidden;
  display: none; /* JS로 .is-open 추가 시 block */
}
.acts-p .ap-editor.is-open { display: block; }

.acts-p .ap-editor__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--ap-primary-soft);
  border-bottom: 1px solid var(--ap-primary-border);
}
.acts-p .ap-editor__title {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: var(--fs-sm);
  font-weight: 800;
  color: var(--ap-primary);
}
.acts-p .ap-editor__title .jmp-acts-ri { font-size: 18px; }
.acts-p .ap-editor__close {
  width: 30px; height: 30px;
  border: none;
  background: var(--ap-primary-border);
  color: var(--ap-primary);
  border-radius: 50%;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .14s;
  flex-shrink: 0;
}
.acts-p .ap-editor__close:hover { background: rgba(69,65,255,.2); }

.acts-p .ap-editor__body {
  padding: var(--sp-md);
  background: var(--ap-white);
}

/* 영상 추가 — 단계형 카드 (링크 → HTML Maker 연결 → 블록 편집기) */
.acts-p .ap-field--video-flow {
  margin-bottom: var(--sp-md);
}
.acts-p .ap-field--video-flow > .ap-flow-card + .ap-flow-card {
  margin-top: var(--sp-sm);
}
.acts-p .ap-flow-card {
  border: 1.5px solid var(--ap-border);
  border-radius: var(--r-md);
  background: var(--ap-soft);
  overflow: hidden;
}
.acts-p .ap-flow-card__head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  background: var(--ap-white);
  border-bottom: 1px solid var(--ap-border);
}
.acts-p .ap-flow-card__badge {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: var(--r-sm);
  background: var(--ap-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  display: grid;
  place-items: center;
  line-height: 1;
}
.acts-p .ap-flow-card__title {
  font-size: var(--fs-sm);
  font-weight: 800;
  color: var(--ap-dark);
  letter-spacing: .2px;
  margin: 0;
}
.acts-p .ap-flow-card__sub {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  margin: 4px 0 0;
  line-height: 1.45;
  font-weight: 500;
}
.acts-p .ap-flow-card__body {
  padding: 14px;
  background: var(--ap-white);
}
.acts-p .ap-flow-card__body > .ap-label:first-child {
  margin-top: 0;
}
.acts-p .ap-flow-card__hint {
  margin-top: 8px;
  margin-bottom: 0;
}
.acts-p .ap-field--flush {
  margin-bottom: 0;
}
.acts-p .ap-flow-card__body .ap-field--flush + .ap-field--flush {
  margin-top: var(--sp-sm);
}
.acts-p .ap-video-flow-summary {
  margin-top: var(--sp-sm);
  margin-bottom: 0;
  padding: 10px 12px;
  border-radius: var(--r-sm);
  background: var(--ap-primary-soft);
  border: 1px solid var(--ap-primary-border);
  color: var(--ap-dark);
  font-weight: 600;
}

/* 프로필 에디터 — HTML Maker 피커를 폼 톤에 맞춤 */
.acts-p .ap-editor .acts-hm-picker-group .acts-hm-picker-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.acts-p .ap-editor .acts-hm-picker-group .acts-input {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
  border: 1.5px solid var(--ap-border);
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  font-family: var(--font);
  font-weight: 500;
  color: var(--ap-dark);
  background: var(--ap-white);
}
.acts-p .ap-editor .acts-hm-picker-group .acts-input:focus {
  border-color: var(--ap-primary);
  box-shadow: 0 0 0 3px var(--ap-primary-soft);
  outline: none;
}
.acts-p .ap-editor .acts-hm-picker-group a.acts-hm-edit-btn.hero-btn {
  flex-shrink: 0;
  white-space: nowrap;
}
.acts-p .ap-editor .acts-hm-picker-group .acts-dashboard-hint {
  color: var(--ap-muted);
  font-size: var(--fs-xs);
}

/* HTML Maker 「새로 만들기」— 테마 button/a 스타일 무력화, 프로필 에디터 톤 */
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  margin: 14px 0 0;
  padding: 10px 18px;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--ap-primary);
  border-radius: var(--r-md);
  background: var(--ap-primary);
  color: #fff !important;
  font-family: var(--font), system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: var(--fs-sm);
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(69, 65, 255, 0.28);
  transition: transform 0.15s, box-shadow 0.15s, background 0.15s, border-color 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn:hover {
  background: var(--ap-primary);
  filter: brightness(1.06);
  box-shadow: 0 6px 18px rgba(69, 65, 255, 0.36);
  transform: translateY(-1px);
  color: #fff !important;
}
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn:active {
  transform: scale(0.98);
  box-shadow: 0 2px 10px rgba(69, 65, 255, 0.22);
}
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn:focus-visible {
  outline: 2px solid var(--ap-primary);
  outline-offset: 2px;
}
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn .ri-file-code-line,
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn i {
  color: inherit !important;
  font-size: 1.2em;
  line-height: 1;
}
.acts-p .ap-editor .acts-hm-picker-group button.jmp-hm-create-btn.acts-hm-create-btn .jmp-hm-create-btn__label {
  color: inherit !important;
}

/* HTML Maker 피커 숨김 라벨 (테마에 screen-reader-text 없을 때 대비) */
.acts-p .ap-editor .screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  word-wrap: normal !important;
  border: 0;
}

.acts-p .ap-flow-card--composer .acts-hm-video-composer--profile {
  margin: 0;
}
.acts-p .ap-flow-card--composer .acts-hm-video-composer__iframe {
  display: block;
  width: 100%;
  min-height: 360px;
  border: 1.5px solid var(--ap-border);
  border-radius: var(--r-md);
  background: var(--ap-soft);
}
@media (max-width: 767px) {
  .acts-p .ap-flow-card--composer .acts-hm-video-composer__iframe {
    min-height: 280px;
  }
}

/* ── 폼 그룹 ──────────────────────────────────────────────── */
.acts-p .ap-field {
  margin-bottom: var(--sp-md);
}
.acts-p .ap-field:last-child { margin-bottom: 0; }
.acts-p .ap-label {
  display: block;
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--ap-dark);
  margin-bottom: 6px;
  letter-spacing: .2px;
}
.acts-p .ap-label .ap-req {
  color: var(--ap-error);
  margin-left: 2px;
}

/* 입력 필드 공통 */
.acts-p .ap-input,
.acts-p .ap-textarea,
.acts-p .ap-select {
  width: 100%;
  padding: 10px 12px;
  border: 1.5px solid var(--ap-border);
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  font-family: var(--font);
  font-weight: 500;
  color: var(--ap-dark);
  background: var(--ap-white);
  transition: border-color .15s, box-shadow .15s;
  outline: none;
  line-height: 1.5;
  -webkit-appearance: none;
}
.acts-p .ap-input:focus,
.acts-p .ap-textarea:focus,
.acts-p .ap-select:focus {
  border-color: var(--ap-primary);
  box-shadow: 0 0 0 3px var(--ap-primary-soft);
}
.acts-p .ap-input::placeholder,
.acts-p .ap-textarea::placeholder {
  color: var(--ap-muted);
  font-weight: 400;
}
.acts-p .ap-textarea {
  min-height: 100px;
  resize: vertical;
}
.acts-p .ap-select {
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
}

/* 인라인 그리드 */
.acts-p .ap-field-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--sp-sm);
}

/* 힌트 */
.acts-p .ap-hint {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  margin-top: 4px;
  font-weight: 500;
}
@media (max-width: 767px) {
  .acts-p .ap-hint--desktop-only {
    display: none !important;
  }
}

/* 파일 업로드 영역 */
.acts-p .ap-upload {
  border: 1.5px dashed var(--ap-border);
  border-radius: var(--r-md);
  padding: 18px;
  text-align: center;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  background: var(--ap-soft);
}
.acts-p .ap-upload:hover {
  border-color: var(--ap-primary-border);
  background: var(--ap-primary-soft);
}
.acts-p .ap-upload .jmp-acts-ri { font-size: 28px; color: var(--ap-muted); display: block; margin-bottom: 6px; }
.acts-p .ap-upload__label {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--ap-muted);
}
.acts-p .ap-upload__label strong { color: var(--ap-primary); }
.acts-p .ap-upload input[type="file"] {
  position: absolute;
  opacity: 0;
  width: 0; height: 0;
}

/* 에디터 푸터 */
.acts-p .ap-editor__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sp-sm);
  padding: 12px 16px;
  background: var(--ap-bg);
  border-top: 1px solid var(--ap-border);
}

/* 저장 상태 스피너 */
.acts-p .ap-spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(255,255,255,.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: apSpin .6s linear infinite;
  display: inline-block;
}
@keyframes apSpin { to { transform: rotate(360deg); } }

/* ── 등록하기 FAB (Floating Action Button) ──────────────────── */
.acts-p .ap-fab {
  position: fixed;
  bottom: calc(72px + var(--safe-b));
  right: 18px;
  z-index: 87;
  display: none;
  align-items: center;
  gap: 7px;
  padding: 12px 18px;
  background: var(--ap-primary);
  color: #fff;
  border: none;
  border-radius: var(--r-pill);
  font-size: var(--fs-sm);
  font-weight: 800;
  font-family: var(--font);
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(69,65,255,.38);
  transition: transform .15s, box-shadow .15s;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-fab.is-visible { display: flex; }
.acts-p .ap-fab:hover  { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(69,65,255,.46); }
.acts-p .ap-fab:active { transform: scale(.96); }
.acts-p .ap-fab .jmp-acts-ri { font-size: 20px; }

/* ── 에디터가 열려 있을 때 FAB 숨김 ──────────────────────── */
.acts-p .ap-fab.is-editor-open { display: none !important; }

/* 모바일: 플로팅 추가(FAB) 비표시 — ID까지 포함해 테마 !important 대비 */
@media (max-width: 768px) {
  #actsProfileRoot #apFab,
  #actsProfileRoot #apFab.is-visible,
  .acts-p .ap-fab,
  .acts-p .ap-fab.is-visible {
    display: none !important;
  }
  /* FAB 미표시 시 스크롤 탑을 오른쪽(기본)으로 */
  #actsProfileRoot:has(.ap-fab) .ap-scroll-top,
  #actsProfileRoot:has(#apFab) .ap-scroll-top {
    left: auto !important;
    right: 18px !important;
  }
}

/* ── 콘텐츠 아이템 (에디터 내부) 삭제 버튼 ─────────────────── */
.acts-p .ap-item__del {
  width: 28px; height: 28px;
  border: none;
  background: rgba(239,68,68,.08);
  color: var(--ap-error);
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .14s;
  flex-shrink: 0;
}
.acts-p .ap-item__del:hover { background: rgba(239,68,68,.15); }
.acts-p .ap-item__del .jmp-acts-ri { font-size: 16px; }

/* ── 섹션 헤더 내 쓰기 버튼 ──────────────────────────────── */
.acts-p .ap-write-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 12px;
  border-radius: var(--r-pill);
  border: 1px solid var(--ap-primary-border);
  background: var(--ap-primary-soft);
  color: var(--ap-primary);
  font-size: var(--fs-xs);
  font-weight: 700;
  font-family: var(--font);
  cursor: pointer;
  transition: background .15s, transform .12s;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.acts-p .ap-write-btn:hover {
  background: var(--ap-primary);
  color: #fff;
  transform: translateY(-1px);
}
.acts-p .ap-write-btn .jmp-acts-ri { font-size: 14px; }
.acts-p .ap-write-btn--playlist {
  border-color: var(--ap-border);
  background: var(--ap-soft);
  color: var(--ap-dark);
}
.acts-p .ap-write-btn--playlist:hover {
  background: var(--ap-primary);
  color: #fff;
  border-color: var(--ap-primary);
}
.acts-p .ap-write-btn--playlist .jmp-acts-ri--sm { font-size: 15px; }

/* ═══════════════════════════════════════════════════════════
   대표 콘텐츠 (Pinned) — 에디터 옵션 + 배지 + 탭 레이아웃
   ═══════════════════════════════════════════════════════════ */

/* ── 핀 체크박스 필드 ────────────────────────────────────── */
.ap-pin-field {
  background: var(--ap-primary-soft);
  border: 1px solid var(--ap-primary-border);
  border-radius: var(--r-md);
  padding: 11px 14px;
  margin-top: var(--sp-sm);
}
.ap-pin-field--hm-video {
  background: var(--ap-soft);
  border-color: var(--ap-border);
}
.ap-pin-field--hm-video .ap-pin-label-inner {
  color: var(--ap-dark);
}
.ap-pin-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}
.ap-pin-label input[type="checkbox"] {
  width: 17px;
  height: 17px;
  accent-color: var(--ap-primary);
  cursor: pointer;
  flex-shrink: 0;
  border-radius: 4px;
}
.ap-pin-label-inner {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-primary);
}
.ap-pin-label-inner .jmp-acts-ri { font-size: 17px; }

/* ── 아이템 목록 핀 배지 ─────────────────────────────────── */
.ap-pin-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--ap-primary);
  color: #fff;
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: 4px;
}

/* ── 대표 콘텐츠 탭: 섹션 구분 ───────────────────────────── */
.ap-pinned-section {
  border-top: 1px solid var(--ap-border);
  padding: var(--sp-md);
}
.ap-pinned-section:first-child { border-top: none; }

.ap-pinned-section__head {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: var(--fs-sm);
  font-weight: 800;
  color: var(--ap-dark);
  margin-bottom: var(--sp-sm);
}
.ap-pinned-section__head .jmp-acts-ri { font-size: 17px; color: var(--ap-primary); }
.ap-pinned-section__count {
  font-size: var(--fs-xs);
  font-weight: 700;
  padding: 1px 8px;
  border-radius: var(--r-pill);
  background: var(--ap-primary-soft);
  color: var(--ap-primary);
  margin-left: 4px;
}

/* ── 핀 리스트 (음원·자료·일정) ──────────────────────────── */
.ap-pinned-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ap-pinned-list__item {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  padding: 10px 12px;
  background: var(--ap-soft);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-md);
  transition: background .14s, border-color .14s;
}
.ap-pinned-list__item:hover {
  background: var(--ap-primary-soft);
  border-color: var(--ap-primary-border);
}
.ap-pinned-list__item--today {
  border-color: var(--ap-primary-border) !important;
  background: var(--ap-primary-soft) !important;
}
.ap-pinned-list__icon {
  width: 38px;
  height: 38px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  font-size: 18px;
  flex-shrink: 0;
}
.ap-pinned-list__body { flex: 1; min-width: 0; }
.ap-pinned-list__title {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-dark);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}
.ap-pinned-list__desc {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  font-weight: 500;
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 핀 그리드 (영상·스토어) ─────────────────────────────── */
.ap-pinned-grid {
  display: grid;
  gap: var(--sp-sm);
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
@media (min-width: 600px) {
  .ap-pinned-grid--video { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
  .ap-pinned-grid--shop  { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}
.ap-pinned-card {
  display: flex;
  flex-direction: column;
  background: var(--ap-white);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-md);
  overflow: hidden;
  text-decoration: none;
  color: var(--ap-text);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
button.ap-pinned-card {
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
  padding: 0;
  margin: 0;
  border: 1px solid var(--ap-border);
}
.ap-pinned-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
  border-color: var(--ap-primary-border);
}

/* 영상 썸네일 */
.ap-pinned-card__thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  background: var(--ap-soft);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ap-pinned-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ap-pinned-card__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.30);
  opacity: 0;
  transition: opacity .15s;
}
.ap-pinned-card:hover .ap-pinned-card__play { opacity: 1; }
.ap-pinned-card__play .jmp-acts-ri {
  font-size: 40px;
  color: #fff;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.4));
}

/* 스토어 썸네일 */
.ap-pinned-card__thumb--shop {
  aspect-ratio: 4/3;
}
.ap-pinned-card__thumb-icon {
  font-size: 36px !important;
  color: var(--ap-muted);
  opacity: .4;
}

/* 카드 텍스트 */
.ap-pinned-card__title {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-dark);
  padding: 8px 10px 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-pinned-card__price {
  font-size: var(--fs-xs);
  font-weight: 800;
  color: var(--ap-primary);
  padding: 0 10px 3px;
}
.ap-pinned-card__desc {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  padding: 0 10px 10px;
  line-height: 1.45;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* Joyn LMS — 사역자 프로필 「강의」탭: 강사 공개 강의 그리드 */
.ap-lms-teaching {
  margin-bottom: var(--sp-md);
}
.ap-lms-teaching__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-bottom: var(--sp-sm);
  font-size: var(--fs-sm);
  font-weight: 700;
  color: var(--ap-dark);
}
.ap-lms-teaching__head .jmp-acts-ri {
  color: var(--ap-primary);
}
.ap-lms-teaching__count {
  margin-left: auto;
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ap-muted);
  background: var(--ap-soft);
  padding: 2px 8px;
  border-radius: 999px;
}
.ap-lms-teaching__refresh {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 0;
  white-space: nowrap;
}
.ap-lms-teaching__head .ap-lms-teaching__refresh {
  font-size: var(--fs-xs);
  font-weight: 600;
}
@media (min-width: 480px) {
  .ap-lms-teaching__head .ap-lms-teaching__count {
    margin-left: auto;
  }
  .ap-lms-teaching__head .ap-lms-teaching__refresh {
    margin-left: 4px;
  }
}
.ap-lms-teaching__synced {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  margin: 0 0 var(--sp-sm);
  line-height: 1.4;
}
.ap-lms-teaching__empty-hint {
  font-size: var(--fs-xs);
  color: var(--ap-muted);
  margin: 0 0 var(--sp-sm);
  line-height: 1.45;
}
.ap-lms-teaching--empty .ap-lms-teaching__grid:empty {
  min-height: 0;
}
.ap-lms-teaching__subhead {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ap-muted);
  margin: var(--sp-md) 0 var(--sp-sm);
  padding-top: var(--sp-sm);
  border-top: 1px solid var(--ap-border);
}
.ap-lms-teaching__grid {
  display: grid;
  gap: var(--sp-sm);
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}
@media (min-width: 600px) {
  .ap-lms-teaching__grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  }
}
a.ap-lms-teaching__card {
  display: flex;
  flex-direction: column;
  background: var(--ap-white);
  border: 1px solid var(--ap-border);
  border-radius: var(--r-md);
  overflow: hidden;
  text-decoration: none;
  color: var(--ap-text);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
a.ap-lms-teaching__card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: var(--ap-primary-border);
}
.ap-lms-teaching__thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  background: var(--ap-soft);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ap-lms-teaching__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ap-lms-teaching__thumb-fallback.jmp-acts-ri {
  font-size: 36px;
  color: var(--ap-muted);
  opacity: 0.45;
}
.ap-lms-teaching__card-title {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--ap-dark);
  padding: 8px 10px 10px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── 일정 날짜 블록 ──────────────────────────────────────── */
.ap-pinned-sched-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 42px;
  background: var(--ap-primary-soft);
  border: 1px solid var(--ap-primary-border);
  border-radius: var(--r-sm);
  padding: 6px 8px;
  flex-shrink: 0;
}
.ap-pinned-sched-date__month {
  font-size: var(--fs-xs);
  font-weight: 700;
  color: var(--ap-primary);
  line-height: 1;
}
.ap-pinned-sched-date__day {
  font-size: var(--fs-xl);
  font-weight: 900;
  color: var(--ap-dark);
  line-height: 1.1;
}
.ap-pinned-sched-date__dow {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: var(--ap-muted);
  margin-top: 1px;
}

/* ── 사역자 프로필(#actsProfileRoot) 모바일: vw 제거 + 본문 최소 16px ─────────
 * 원인: iOS/Android에서 첫 로드 뷰포트와 터치 후 뷰포트가 달라지면
 * vw 기반 clamp() 값이 바뀌어 리플로우 시 크기가 튐.
 * 히어로 표시 이름(.ap-hero__name)은 20px로 유지(이름만 기존 크기).
 * 참고: docs/MOBILE-FONT-SHIFT-ANALYSIS.md
 */
@media (max-width: 768px) {
  #actsProfileRoot.acts-p {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    /* px 고정: rem은 html font-size에 의존, iOS에서 루트가 바뀌면 다시 튐 */
    --sp-xs:  6px;
    --sp-sm:  10px;
    --sp-md:  14px;
    --sp-lg:  20px;
    --fs-xs:  16px;
    --fs-sm:  16px;
    --fs-base: 16px;
    --fs-lg:  18px;
    --fs-xl:  20px;
    --fs-2xl: 22px;
  }

  #actsProfileRoot .ap-input,
  #actsProfileRoot .ap-textarea,
  #actsProfileRoot .ap-select {
    font-size: 16px !important;
  }

  /* var(--fs-*)를 쓰지 않는 고정 px 보강 */
  /* 이름 아래 교회·특기·팔로워 줄은 모바일 12px (본문 입력 16px 규칙과 별도) */
  #actsProfileRoot .ap-hero__meta { font-size: 12px; }
  #actsProfileRoot .ap-hero__more { font-size: 16px; }
  #actsProfileRoot .ap-hero__level-badge .jmp-acts-ri { font-size: 16px; }
  #actsProfileRoot .ap-tab { font-size: 16px; }
  #actsProfileRoot .ap-tab .jmp-acts-ri { font-size: 17px; }
  #actsProfileRoot .jmp-acts-ri--xs { font-size: 16px; }
  /* 히어로 메타 내 아이콘은 --xs 전역(16px)보다 우선해 본문과 동일 12px */
  #actsProfileRoot .ap-hero__meta .jmp-acts-ri,
  #actsProfileRoot .ap-hero__meta-item .jmp-acts-ri { font-size: 12px; }
  #actsProfileRoot .ap-hero__name { font-size: 20px; }

  /* 영상·QR 모달(테마/별도 CSS가 있어도 프로필 페이지는 16px 이상) */
  .acts-profile-video-modal .acts-profile-video-modal-title,
  .acts-profile-qr-modal .acts-profile-qr-modal-title { font-size: 18px; }
  .acts-profile-qr-modal .acts-profile-qr-caption,
  .acts-profile-qr-modal .acts-profile-qr-share-feedback { font-size: 16px; }
}
/* ==========================================================
 * Acts 사역자 프로필 — 서포트(shop) 미션 스타일 카드
 *
 * 마켓: 정사각 썸네일 그리드 카드 (NEW/인기 뱃지 우상단)
 * 티켓: 가로형 리스트 카드 (장소·일정·시간 메타 + 가격·신청가능 우측)
 *
 * @location joyn-members-pro/modules/acts/assets/acts-profile-shop.css
 * ========================================================== */

/* =====================================================
   마켓 그리드
   ===================================================== */
.ap-shop-market-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 0;
}
@media (max-width: 768px) {
    .ap-shop-market-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}
@media (max-width: 380px) {
    .ap-shop-market-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
}

.ap-shop-market-card {
    position: relative;
    background: var(--acts-surface, #ffffff);
    border: 1px solid var(--acts-border, rgba(28,24,20,0.08));
    border-radius: 12px;
    overflow: hidden;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.ap-shop-market-card:hover {
    transform: translateY(-1px);
    border-color: rgba(28,24,20,0.16);
    box-shadow: 0 4px 12px rgba(28,24,20,0.06);
}
.ap-shop-market-card--pinned {
    border-color: var(--acts-gold, #D4A853);
}

.ap-shop-market-card__link,
.ap-shop-market-card__link--nolink {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.ap-shop-market-card__link--nolink {
    cursor: default;
}

.ap-shop-market-card__thumb {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--acts-bg, #f4f1eb);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.ap-shop-market-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ap-shop-market-card__thumb-fallback {
    color: var(--acts-text-muted, #908a80);
    opacity: 0.6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ap-shop-market-card__thumb-fallback i,
.ap-shop-market-card__thumb-fallback .jmp-acts-ri--md {
    font-size: 32px;
    line-height: 1;
}

.ap-shop-market-card__badge {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 10px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    z-index: 2;
}
.ap-shop-market-card__badge--new {
    background: var(--acts-blue, #4A7BF7);
    color: #ffffff;
}
.ap-shop-market-card__badge--popular {
    background: #E24B4A;
    color: #ffffff;
}

.ap-shop-market-card__pin {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 22px;
    height: 22px;
    background: rgba(255,255,255,0.95);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--acts-gold-dark, #B08930);
    z-index: 2;
}
.ap-shop-market-card__pin i,
.ap-shop-market-card__pin .jmp-acts-ri--xs { font-size: 12px; }

.ap-shop-market-card__info {
    padding: 10px 12px 12px;
}
.ap-shop-market-card__title {
    font-size: 13px;
    font-weight: 500;
    color: var(--acts-text, #1a1814);
    margin: 0 0 4px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}
.ap-shop-market-card__price {
    font-size: 13px;
    font-weight: 600;
    color: var(--acts-text, #1a1814);
    margin: 0;
}

.ap-shop-market-card__actions {
    display: flex;
    gap: 4px;
    padding: 0 8px 8px;
    justify-content: flex-end;
    border-top: 1px dashed var(--acts-border, rgba(28,24,20,0.08));
    margin-top: 4px;
    padding-top: 6px;
}

/* =====================================================
   티켓 리스트
   ===================================================== */
.ap-shop-tickets-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
}

.ap-shop-ticket-card {
    background: var(--acts-surface, #ffffff);
    border: 1px solid var(--acts-border, rgba(28,24,20,0.08));
    border-radius: 12px;
    overflow: hidden;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ap-shop-ticket-card:hover {
    border-color: rgba(28,24,20,0.16);
    box-shadow: 0 2px 8px rgba(28,24,20,0.04);
}
.ap-shop-ticket-card--pinned {
    border-color: var(--acts-gold, #D4A853);
}

.ap-shop-ticket-card__link,
.ap-shop-ticket-card__link--nolink {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 12px;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}
.ap-shop-ticket-card__link--nolink {
    cursor: default;
}

.ap-shop-ticket-card__thumb {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: var(--acts-bg, #f4f1eb);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.ap-shop-ticket-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ap-shop-ticket-card__thumb-fallback {
    color: var(--acts-text-muted, #908a80);
    opacity: 0.6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ap-shop-ticket-card__thumb-fallback i,
.ap-shop-ticket-card__thumb-fallback .jmp-acts-ri--md { font-size: 22px; }

.ap-shop-ticket-card__main {
    flex: 1 1 auto;
    min-width: 0;
}
.ap-shop-ticket-card__title {
    font-size: 14px;
    font-weight: 600;
    color: var(--acts-text, #1a1814);
    margin: 0 0 2px;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ap-shop-ticket-card__pin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: var(--acts-gold-dark, #B08930);
    flex-shrink: 0;
}
.ap-shop-ticket-card__pin i,
.ap-shop-ticket-card__pin .jmp-acts-ri--xs { font-size: 12px; }

.ap-shop-ticket-card__venue {
    font-size: 12px;
    color: var(--acts-text-dim, #57524a);
    margin: 0 0 6px;
    line-height: 1.4;
}
.ap-shop-ticket-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 11px;
    color: var(--acts-text-muted, #908a80);
}
.ap-shop-ticket-card__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.ap-shop-ticket-card__meta-item i,
.ap-shop-ticket-card__meta-item .jmp-acts-ri--xs {
    font-size: 12px;
    opacity: 0.8;
}

.ap-shop-ticket-card__side {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    text-align: right;
    min-width: 80px;
}
.ap-shop-ticket-card__price {
    font-size: 13px;
    font-weight: 600;
    color: var(--acts-text, #1a1814);
    white-space: nowrap;
}
.ap-shop-ticket-card__price--free {
    color: var(--acts-green, #34C68A);
}
.ap-shop-ticket-card__price--unset {
    color: var(--acts-text-muted, #908a80);
    font-weight: 500;
}
.ap-shop-ticket-card__badge-open {
    font-size: 10px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(52, 198, 138, 0.12);
    color: var(--acts-green, #34C68A);
    line-height: 1.4;
    white-space: nowrap;
}

/* v1.6.2 support badge additions (shop.css 동기화) */
.ap-shop-market-card__badge--recommended {
  background: rgba(74, 183, 179, 0.13);
  color: #4AB7B3;
}
.ap-shop-market-card__badge--soldout {
  background: rgba(240, 90, 90, 0.12);
  color: #F05A5A;
}
.ap-shop-ticket-card__badge-open--closed {
  background: rgba(240, 90, 90, 0.12);
  color: #F05A5A;
}

/* v1.6.x — 티켓 카드 사이드 영역 뱃지 (마켓 카드와 동일한 동작 패턴)
   우선순위: 마감 > 추천/신규/인기 > 출력 없음 — 뱃지가 없는 카드는 가격만 노출
   색 톤·사이즈는 마켓 카드와 동일 */
.ap-shop-ticket-card__badge {
    font-size: 10px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    line-height: 1.4;
    letter-spacing: 0.02em;
    white-space: nowrap;
}
.ap-shop-ticket-card__badge--recommended {
    background: rgba(74, 183, 179, 0.13);
    color: #4AB7B3;
}
.ap-shop-ticket-card__badge--new {
    background: var(--acts-blue, #4A7BF7);
    color: #ffffff;
}
.ap-shop-ticket-card__badge--popular {
    background: #E24B4A;
    color: #ffffff;
}

.ap-shop-ticket-card__actions {
    display: flex;
    gap: 4px;
    padding: 0 12px 10px;
    justify-content: flex-end;
    border-top: 1px dashed var(--acts-border, rgba(28,24,20,0.08));
    padding-top: 8px;
}

/* =====================================================
   모바일 반응형 (티켓 카드)
   ===================================================== */
@media (max-width: 480px) {
    .ap-shop-ticket-card__link,
    .ap-shop-ticket-card__link--nolink {
        gap: 10px;
        padding: 10px;
    }
    .ap-shop-ticket-card__thumb {
        width: 52px;
        height: 52px;
    }
    .ap-shop-ticket-card__title { font-size: 13px; }
    .ap-shop-ticket-card__venue { font-size: 11px; }
    .ap-shop-ticket-card__meta { gap: 8px; font-size: 10px; }
    .ap-shop-ticket-card__side { min-width: 64px; }
    .ap-shop-ticket-card__price { font-size: 12px; }
}

/* =====================================================
   v1.6.5 — 공통 HTML 불러오기 베이스 스타일
   partial(ap-html-import-fields.php)에서 디자인 인라인 style을 제거했으므로
   양쪽 컨텍스트(대시보드·프로필 인라인) 모두에서 사용할 베이스를 정의.
   기존 zip 1.6.1 partial에 박혀있던 값과 시각적으로 동일.
   ===================================================== */
.ap-acts-htmlimport__hint {
    margin-top: 0;
    margin-bottom: 8px;
}
.ap-acts-htmlimport__dropzone {
    border: 2px dashed rgba(0, 0, 0, 0.12);
    border-radius: 10px;
    padding: 12px;
    margin-top: 4px;
}
.ap-acts-htmlimport__dropzone .ap-acts-htmlimport__notice {
    margin-top: 8px;
    margin-bottom: 0;
}
.ap-acts-htmlimport__dropzone .ap-acts-htmlimport__filename-line {
    margin-top: 4px;
    margin-bottom: 0;
}
.ap-acts-htmlimport__preview {
    margin-top: 10px;
}
.ap-acts-htmlimport__preview-iframe {
    width: 100%;
    height: 42vh;
    min-height: 240px;
    border: 1px solid var(--ap-border, rgba(0, 0, 0, 0.12));
    border-radius: var(--r-sm, 8px);
    background: #fff;
}

/* =====================================================
   v1.6.5 — 프로필 인라인 에디터 전용 wrapper 스타일
   대시보드(.acts-write-html-tools)와 시각 톤 통일을 위해 같은 wrapper 클래스 + 프로필 한정 클래스 사용.
   - profile-tab-news.php / profile-tab-schedule.php / profile-tab-media.php 에서
     <div class="acts-write-html-tools ap-profile-html-tools"> 로 partial을 감쌈
   - 대시보드 CSS(acts-dashboard.css의 .acts-dashboard-wrap .acts-write-html-tools 스코프)는
     건드리지 않음 — .acts-dashboard-wrap에 격리되어 프로필에는 적용 안 됨
   - 프로필은 .ap-editor .ap-profile-html-tools 스코프에서 동일한 톤을 직접 적용
   ===================================================== */
.ap-editor .ap-profile-html-tools {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--ap-border, rgba(0, 0, 0, 0.08));
    position: relative;
    z-index: 1;
}
.ap-editor .ap-profile-html-tools .ap-acts-htmlimport {
    margin-bottom: 12px;
}
.ap-editor .ap-profile-html-tools .ap-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: var(--acts-text, #1f2937);
    font-weight: 500;
    margin-bottom: 6px;
}
.ap-editor .ap-profile-html-tools .ap-hint {
    font-size: 0.8rem;
    color: var(--acts-text-dim, #6b7280);
    margin-top: 0;
    margin-bottom: 8px;
    line-height: 1.5;
}
/* dropzone — 대시보드와 동일 톤 (acts-dashboard.css L1519~ 복제) */
.ap-editor .ap-profile-html-tools .ap-acts-htmlimport__dropzone {
    border: 2px dashed rgba(99, 102, 241, 0.2) !important;
    border-radius: 8px;
    padding: 12px !important;
    background: rgba(99, 102, 241, 0.02);
    margin-top: 4px;
}
/* HTML Maker 「새로 만들기」 거대 버튼 숨김 — 대시보드와 동일 처리 (acts-dashboard.css L1587~ 복제) */
.ap-editor .ap-profile-html-tools .acts-hm-create-btn,
.ap-editor .ap-profile-html-tools .jmp-hm-create-btn,
.ap-editor .ap-profile-html-tools .acts-hm-picker-group button.jmp-hm-create-btn {
    display: none !important;
}
/* 버튼들 — 테마 button 스타일 덮어쓰기 (이전 v1.6.1 보강 유지) */
.ap-editor .ap-profile-html-tools .ap-btn,
.ap-editor .ap-profile-html-tools button.ap-btn {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
    padding: 8px 14px !important;
    margin: 0 6px 6px 0 !important;
    border: 1px solid rgba(99, 102, 241, 0.25) !important;
    border-radius: 6px !important;
    background: #fff !important;
    color: #4f46e5 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    position: relative;
    z-index: 2;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
}
.ap-editor .ap-profile-html-tools .ap-btn:hover {
    background: rgba(99, 102, 241, 0.06) !important;
    border-color: rgba(99, 102, 241, 0.5) !important;
}
.ap-editor .ap-profile-html-tools .ap-btn--muted {
    background: rgba(99, 102, 241, 0.08) !important;
    color: #4f46e5 !important;
    border-color: rgba(99, 102, 241, 0.3) !important;
}
.ap-editor .ap-profile-html-tools .ap-btn--ghost {
    background: transparent !important;
    color: #6b7280 !important;
    border-color: transparent !important;
}
.ap-editor .ap-profile-html-tools .ap-btn--ghost:hover {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(99, 102, 241, 0.2) !important;
}

.ap-editor .ap-acts-thumbnail-field .ap-acts-thumbnail-preview img {
    background: #fff;
}

/* =====================================================
   v1.6.1 hotfix — 인라인 에디터 안의 hidden file input이
   display:none 부모 컨텍스트에서 .click() 무시되는 문제 해결
   (display:none 대신 화면 밖으로 보내서 input은 인터랙션 가능 상태 유지)
   ===================================================== */
.ap-editor input[type="file"][data-acts-htmlimport-file] {
    /* 마크업의 inline style="display:none" 을 덮어씀 */
    display: block !important;
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
    /* pointer-events: none 제거 — .click() 후 다이얼로그 트리거를 막고 있었음 */
}
