body {
  background: #fff;
  color: #25262b;
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.store-renewal-shell {
  width: 100%;
  max-width: none;
  min-height: 100vh;
  padding-left: 0;
  padding-right: 0;
  background: #fff;
  color: #25262b;
}

.store-container {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}

.store-intro {
  background: #f2f2f2;
}

.store-intro-inner {
  min-height: 260px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding-top: 46px;
  padding-bottom: 46px;
}

.store-intro h1 {
  margin: 0 0 22px;
  color: #25262b;
  font-size: var(--moneying-public-display-size, 58px);
  line-height: var(--moneying-public-display-leading, 1.24);
  font-weight: var(--moneying-public-display-weight, 700);
  letter-spacing: var(--moneying-public-display-tracking, .01em);
}

.store-intro p {
  margin: 0;
  color: #41434a;
  font-size: var(--moneying-public-lead-size, 23px);
  line-height: var(--moneying-public-lead-leading, 1.55);
  font-weight: var(--moneying-public-lead-weight, 500);
  letter-spacing: var(--moneying-public-lead-tracking, -.015em);
}

.store-muted-button {
  min-width: 78px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border-radius: 999px;
  background: #8b8b8b;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}

.store-content {
  padding-top: 58px;
  padding-bottom: 112px;
}

.store-search {
  width: 306px;
  height: 44px;
  margin: 0 0 34px auto;
  display: flex;
  align-items: center;
  border: 1px solid #a8a9ad;
  border-radius: 999px;
  background: #fff;
  overflow: hidden;
}

.store-search input {
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0 4px 0 20px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #25262b;
  font-size: 14px;
}

.store-search input::placeholder { color: #999ba0; }
.store-search button { width: 50px; height: 100%; color: #65676c; }

.store-featured {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 26px;
}

.store-feature-card {
  position: relative;
  min-height: 0;
  aspect-ratio: 1.65 / 1;
  border-radius: 22px;
  overflow: hidden;
  background: #e9ecef;
  isolation: isolate;
}

.store-feature-media,
.store-feature-media img,
.store-feature-media video,
.store-image-placeholder { width: 100%; height: 100%; }
.store-feature-media img,
.store-feature-media video { display: block; object-fit: cover; transition: transform .35s ease; }
.store-feature-card:hover .store-feature-media img { transform: scale(1.025); }
.store-feature-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.12) 52%, rgba(0,0,0,.88) 100%);
}
.store-feature-copy { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 26px; color: #fff; }
.store-feature-copy h2 {
  margin: 0 0 11px;
  font-size: clamp(19px, 1.75vw, 27px);
  line-height: 1.25;
  font-weight: 750;
  letter-spacing: -.035em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.store-feature-copy p,
.store-product-card > p { display: flex; align-items: center; gap: 9px; margin: 0; }
.store-feature-copy p { font-size: 13px; color: rgba(255,255,255,.9); }
.store-feature-copy p i,
.store-product-card > p i { width: 1px; height: 13px; background: currentColor; opacity: .45; }
.store-feature-copy p strong { font-weight: 700; }

.store-category-tabs {
  margin: 68px auto 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--moneying-section-tab-gap, 0px);
}
.store-category-tabs button {
  position: relative;
  padding: 10px var(--moneying-section-tab-pad, 22px);
  color: #606268;
  font-size: 17px;
  font-weight: 500;
  white-space: nowrap;
}
.store-category-tabs button.is-active { color: #25262b; font-weight: 750; }
.store-category-tabs button.is-active::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  width: 6px;
  height: 6px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: #c3ff00;
}
.store-category-tabs > span { width: 1px; height: 16px; background: #cfd0d3; }

.store-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 27px;
  row-gap: 48px;
}
.store-product-card[hidden] { display: none; }
.store-product-card { min-width: 0; color: #25262b; }
.store-product-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 20px;
  overflow: hidden;
  background: #eef1f5;
}
.store-product-thumb img,
.store-product-thumb video { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .3s ease; }
.store-product-card:hover .store-product-thumb img { transform: scale(1.02); }
.store-product-card h3 {
  min-height: 48px;
  margin: 18px 2px 8px;
  color: #25262b;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 750;
  letter-spacing: -.03em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.store-product-card > p { margin: 0 2px; color: #6e7076; font-size: 13px; }
.store-product-card > p strong { color: #25262b; font-weight: 700; }
.store-image-placeholder { display: flex; align-items: center; justify-content: center; background: #e9edf2; color: #a7aab0; }
.store-image-placeholder span { font-size: 14px; font-weight: 800; letter-spacing: -.03em; }
.store-play-mark {
  position: absolute; inset: 50% auto auto 50%; width: 48px; height: 48px;
  transform: translate(-50%, -50%); display: grid; place-items: center;
  border-radius: 50%; background: rgba(255,255,255,.86); color: #25262b;
}

.store-empty { padding: 90px 20px; text-align: center; color: #8a8c92; font-size: 15px; }
.store-pagination { min-height: 34px; margin-top: 70px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.store-pagination[hidden] { display: none; }
.store-pagination button,
.store-pagination span {
  min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #5d5f65; font-size: 13px; font-weight: 600;
}
.store-pagination button.is-active { background: #c3ff00; color: #25262b; }
.store-pagination button:disabled { opacity: .3; }

.store-seller-cta {
  min-height: 150px;
  margin-top: 78px;
  padding: 34px 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border-radius: 22px;
  background: #c3ff00;
}
.store-seller-cta h2 { margin: 0 0 10px; color: #25262b; font-size: 24px; line-height: 1.25; font-weight: 800; letter-spacing: -.035em; }
.store-seller-cta p { margin: 0; color: #35373c; font-size: 14px; line-height: 1.55; }
.store-seller-cta > a {
  min-width: 158px; height: 48px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; background: #fff; color: #25262b; font-size: 14px; font-weight: 750; white-space: nowrap;
}

/* 상품 상세 페이지 */
.store-detail-renewal { background: #fff; color: #25262b; }
.store-detail-renewal > a { color: #74767b !important; }
.store-detail-renewal .text-white,
.store-detail-renewal .text-zinc-200,
.store-detail-renewal .text-zinc-300 { color: #25262b !important; }
.store-detail-renewal .text-zinc-400 { color: #62646a !important; }
.store-detail-renewal .text-zinc-500,
.store-detail-renewal .text-zinc-600 { color: #8a8c91 !important; }
.store-detail-renewal .bg-zinc-900,
.store-detail-renewal .bg-zinc-900\/60,
.store-detail-renewal .bg-zinc-800,
.store-detail-renewal .bg-zinc-800\/40 { background: #fff !important; }
/* 전자책·크롬 익스텐션 상세도 같은 화이트 톤을 쓴다(2026-08-31 대표).
   위 규칙이 안 잡던 변형만 보탠다 — 히어로 그라디언트와 투명도 배경. */
.store-detail-renewal .bg-zinc-900\/95,
.store-detail-renewal .bg-zinc-900\/40,
.store-detail-renewal .bg-zinc-800\/60 { background: #fff !important; }
/* 형광 노랑 위의 글자는 검정이어야 읽힌다 — text-white 일괄 치환에서 되살린다. */
.store-detail-renewal .bg-\[\#c4ff00\] { color: #16181d !important; }
/* 라임 글씨는 흰 배경에서 대비 1.19:1 로 사실상 안 읽힌다(2026-08-31 대표).
   버튼 '배경'은 그대로 두고 **글자색만** 4.5:1 을 넘는 짙은 라임으로 바꾼다. */
.store-detail-renewal .text-\[\#c4ff00\] { color: #5f7f00 !important; }
/* 보라도 흰 배경에서 2.72:1 로 흐리다 — 같은 계열의 짙은 톤으로. */
.store-detail-renewal .text-violet-400 { color: #7c3aed !important; }
.store-detail-renewal .border-zinc-800,
.store-detail-renewal .border-zinc-700,
.store-detail-renewal .divide-zinc-800\/60 > :not([hidden]) ~ :not([hidden]) { border-color: #e4e5e7 !important; }
.store-detail-renewal .product-description h1,
.store-detail-renewal .product-description h2,
.store-detail-renewal .product-description h3,
.store-detail-renewal .product-description strong { color: #25262b !important; }
.store-detail-renewal .product-description p,
.store-detail-renewal .product-description li { color: #4d4f55 !important; }
.store-detail-renewal #detTabs { justify-content: center; border-color: #dedfe2 !important; gap: 24px; }
.store-detail-renewal .det-tab { position: relative; padding-left: 18px; padding-right: 18px; color: #696b70; border: 0 !important; }
.store-detail-renewal .det-tab.active { color: #25262b; font-weight: 750; }
.store-detail-renewal .det-tab.active::before {
  content: ""; position: absolute; top: 2px; left: 50%; width: 6px; height: 6px;
  transform: translateX(-50%); border-radius: 50%; background: #c3ff00;
}
.store-detail-renewal .lg\:sticky { border-color: #dadbde !important; box-shadow: none; }
.store-detail-renewal .store-purchase-guide { background: #f5f5f5 !important; border-color: transparent !important; }
.store-detail-renewal .store-intro-collapsed { position: relative; max-height: 720px; overflow: hidden; }
.store-detail-renewal .store-intro-collapsed::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px;
  background: linear-gradient(transparent, #fff); pointer-events: none;
}
.store-detail-renewal .store-intro-collapsed.is-open { max-height: none; }
.store-detail-renewal .store-intro-collapsed.is-open::after { display: none; }
.store-detail-renewal .store-intro-more {
  width: 100%; height: 50px; margin: 18px 0 34px; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; background: #c3ff00; color: #25262b; font-size: 14px; font-weight: 750;
}
.store-detail-renewal + .fixed,
.store-detail-renewal .store-mobile-purchase { background: rgba(255,255,255,.96) !important; border-color: #dedfe2 !important; color: #25262b; }

/* 판매자 상품 등록·수정 */
.store-form-renewal { background: #fff; color: #25262b; }
.store-form-renewal [class*="bg-zinc-900"],
.store-form-renewal [class*="bg-zinc-800"] { background: #fff !important; }
.store-form-renewal [class*="border-zinc-8"],
.store-form-renewal [class*="border-zinc-7"],
.store-form-renewal [class*="border-zinc-6"] { border-color: #e1e2e4 !important; }
.store-form-renewal .text-white,
.store-form-renewal .text-zinc-200,
.store-form-renewal .text-zinc-300 { color: #25262b !important; }
.store-form-renewal .text-zinc-400 { color: #65676d !important; }
.store-form-renewal .text-zinc-500,
.store-form-renewal .text-zinc-600 { color: #92949a !important; }
.store-form-renewal input,
.store-form-renewal select,
.store-form-renewal textarea { background: #fff !important; color: #25262b !important; border-color: #dedfe2 !important; }
/* ⚠️ 이 입력칸은 JS(store-product-form-renewal.js)가 만든다. tailwind.config.js 의
   content 에 static/js 가 없어서 거기 적은 유틸리티 클래스는 purge 로 사라질 수 있다
   (지금 살아 있는 건 같은 클래스를 쓰는 템플릿이 있어서일 뿐이다).
   테두리가 없으면 판매자가 입력칸인지 못 알아본다(2026-09-02 대표) → CSS 로 고정한다. */
.store-form-renewal #thumbnail-video-url.store-thumb-video-input {
  border: 1px solid #dedfe2;
  border-radius: 12px;
  padding: 12px 16px;
}

.store-form-renewal input:focus,
.store-form-renewal select:focus,
.store-form-renewal textarea:focus { border-color: #a9db00 !important; box-shadow: 0 0 0 1px #a9db00; }
.store-form-renewal form > div[class*="rounded-2xl"] { box-shadow: none; }
.store-detail-renewal .product-description iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: 14px; margin: 20px 0; }
.store-detail-renewal .product-description .cta-block { margin: 24px 0; padding: 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid #e1e2e5; border-radius: 14px; background: #f7f8f9; }
.store-detail-renewal .product-description .cta-title { color: #25262b; font-size: 18px; font-weight: 800; }
.store-detail-renewal .product-description .cta-btn { padding: 11px 18px; border-radius: 9px; background: #c3ff00; color: #17181c; font-weight: 800; text-decoration: none; }

@media (max-width: 900px) and (min-width: 768px) {
  .store-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .store-container { width: min(100% - 32px, 1180px); }
  /* 높이·여백은 공용 .moneying-archive-hero-inner 가 갖는다(나중에 로드돼 이긴다).
     여기 숫자는 아무 효과가 없어 지웠다 — 남겨 두면 고쳐도 안 바뀐다(2026-09-10 검수). */
  .store-intro-inner { align-items: flex-end; }
  .store-intro h1 { margin-bottom: 16px; font-size: var(--moneying-public-display-size, clamp(34px, 9.4vw, 44px)); }
  .store-intro p { font-size: var(--moneying-public-lead-size, 16px); }
  .store-muted-button { align-self: flex-start; min-width: 68px; height: 38px; padding: 0 16px; }
  .store-content { padding-top: 34px; padding-bottom: 72px; }
  .store-search { width: 100%; margin-bottom: 26px; }
  .store-featured { grid-template-columns: 1fr; gap: 16px; }
  .store-feature-card { border-radius: 16px; aspect-ratio: 1.45 / 1; }
  .store-feature-copy { left: 20px; right: 20px; bottom: 18px; }
  .store-feature-copy h2 { font-size: 20px; }
  .store-category-tabs { margin: 42px -6px 34px;
  gap: var(--moneying-section-tab-gap, 0px); overflow-x: auto; justify-content: flex-start; padding: 0 6px; scrollbar-width: none; }
  .store-category-tabs::-webkit-scrollbar { display: none; }
  .store-category-tabs button { font-size: 15px; }
  .store-category-tabs > span { flex: 0 0 1px; }
  .store-grid { grid-template-columns: 1fr; row-gap: 36px; }
  .store-product-thumb { border-radius: 16px; }
  .store-product-card h3 { min-height: 0; font-size: 17px; }
  .store-pagination { margin-top: 46px; }
  .store-seller-cta { margin-top: 54px; padding: 28px 24px; align-items: flex-start; flex-direction: column; border-radius: 18px; }
  .store-seller-cta h2 { font-size: 21px; }
  .store-seller-cta > a { width: 100%; }
  .store-detail-renewal #detTabs { justify-content: flex-start; gap: 4px; overflow-x: auto; }
  .store-form-renewal * { min-width: 0; }
  .store-form-renewal [class~="items-end"] { flex-wrap: wrap; }
  .store-form-renewal [class~="items-end"] > input { flex-basis: 100%; }
  .store-form-renewal [class~="items-end"] > label {
    width: 100%;
    text-align: center;
  }
}

@media (max-width: 1023px) {
  .store-detail-renewal .store-detail-layout { display: flex; flex-direction: column; }
  .store-detail-renewal .store-detail-main { display: contents; }
  .store-detail-renewal .store-detail-main > * { order: 4; }
  .store-detail-renewal .store-detail-hero { order: 1; }
  .store-detail-renewal .store-detail-sidebar { order: 2; }
  .store-detail-renewal .store-detail-tabs { order: 3; }
  .store-detail-renewal .det-pane { order: 4; }
  .store-detail-renewal .store-intro-more { order: 5; }
  .store-detail-renewal .store-seller-info { order: 6; }
  .store-detail-renewal .store-purchase-guide { order: 7; }
}

/* 제휴 추천 카드 (2026-09-10) — 우리가 파는 상품이 아니라는 걸 카드에서 바로 알린다.
   강사 초빙 전까지 스토어 구색을 채우는 용도라 일반 상품과 나란히 놓이므로,
   뱃지와 이동 표시가 없으면 회원이 우리에게 환불을 요구하게 된다. */
/* ⚠️공정위 추천·보증 심사지침 — 경제적 이해관계는 **명확히** 밝혀야 한다.
   반투명 검정은 밝은 썸네일 위에서 묻혔다(2026-09-10 대표 지적). 불투명 + 테두리로
   어떤 썸네일 위에서도 읽히게 한다. 크기도 한 단계 키운다. */
.store-aff-badge {
  position: absolute; top: 10px; left: 10px; z-index: 2;
  padding: 4px 9px; border-radius: 999px;
  /* 흰 배경 + 검정 테두리는 투박했다(2026-09-11 대표). 반투명 다크 위에
     블러를 얹으면 어떤 썸네일에서도 읽히면서 카드에 녹아든다. */
  background: rgba(17,17,19,.72);
  -webkit-backdrop-filter: saturate(140%) blur(6px);
  backdrop-filter: saturate(140%) blur(6px);
  color: rgba(255,255,255,.95);
  border: 0;
  box-shadow: 0 1px 6px rgba(0,0,0,.28);
  font-size: 10.5px; font-weight: 700; letter-spacing: .02em; line-height: 1.3;
}
.store-aff-go {
  display: inline-flex; align-items: center; gap: 5px;
  margin-top: 7px; color: #6b6e75;
  font-size: 11.5px; font-weight: 800;
}
.store-aff-go i { font-size: 9px; }

/* 할인 표시 (2026-09-10) — 정상가 입력칸은 있었는데 카드가 안 쓰고 있었다.
   할인율을 먼저 보여주는 게 국내 커머스 관행이라 눈에 먼저 들어온다. */
.store-product-card > p .store-price-off { color: #e8452c; font-weight: 800; }
.store-product-card > p .store-price-was {
  color: #a7aab0; font-size: 12px; font-weight: 600; text-decoration: line-through;
}

/* 추천(큰) 카드의 광고 표시 — 어두운 그라디언트 위라 색을 따로 잡는다.
   ⚠️가장 눈에 띄는 자리에 표시가 없으면 공정위 지침에 걸린다(2026-09-11). */
.store-feature-card { position: relative; }
.store-feature-card .store-aff-badge { top: 14px; left: 14px; }
.store-aff-go--on-media { color: rgba(255,255,255,.82); margin-top: 4px; }
.store-feature-card .store-price-was { color: rgba(255,255,255,.6); }
.store-feature-card .store-price-off { color: #ff8a6b; }
