/* ==========================================================================
   WILD MOMENTUM — wm.css (v2)
   외주본(style.css·shop.css·…)에 없는 '우리만 있는 기능'을 외주본 디자인 언어로 입힌다.
   외주본 규칙 그대로: 흑백(#111 글자 · #ddd/#eee 선 · #777/#888/#999 보조 · 흰 바탕),
   강조색은 할인율 #b34635 · 카카오 #fee500 뿐, 기본 글자 15px, 굵기 650, 모서리 직각(원형 아이콘만 50%).
   외주본 파일은 손대지 않는다(중복 정리본 그대로). 덮어쓸 때는 여기서만.
   ========================================================================== */

/* ── 공통 보정 ───────────────────────────────────────────── */
/* 본 사이트 기본 동작(assets/css/main.css 첫머리)에서 그대로 가져온 것:
   가로 넘침은 html 에서 잘라낸다(body 에 주면 상세 오른쪽 sticky 가 깨짐) ·
   하이브리드 앱(WebView) 좌우 튕김 방지 · 한글은 어절 단위로만 줄바꿈, 아주 긴 영문/URL 만 예외로 끊음 */
html { -webkit-text-size-adjust: 100%; overflow-x: clip; overscroll-behavior-x: none; }
body { overscroll-behavior-x: none; word-break: keep-all; overflow-wrap: break-word; }
[hidden] { display: none !important; }
.hidden { display: none !important; }   /* 페이지 스크립트가 쓰는 옛 이름 */
.mobile-nav[hidden] { display: none !important; }
.wm-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tile { position: absolute; inset: 0; background: linear-gradient(160deg, var(--t1, #1a1a1a), var(--t2, #0a0a0a)); }

/* 알림(토스트) — 외주본 .toast 모양 그대로, main.js 의 show 토글로 나타난다 */
.toast { display: none; }
.toast.show { display: block; }

/* ── 헤더: 다크모드 버튼 · 회원 이니셜 · 메가메뉴 칸 수 ─────────── */
.wm-theme-btn .icon-sun { display: none; }
[data-theme="dark"] .wm-theme-btn .icon-sun { display: block; }
[data-theme="dark"] .wm-theme-btn .icon-moon { display: none; }
.header-icons .account-link .wm-account-initial {
    background: #111;
    font-size: 10px;
}
.wm-mega-cols { display: contents; }
.mega-inner { grid-template-columns: 1fr repeat(var(--mega-cols, 2), 1fr) 1.4fr; }
.mega-column > a .mega-count {
    font-style: normal;
    font-size: 12px;
    color: #999;
    margin-left: 7px;
}
@media (min-width: 768px) and (max-width: 1150px) {
    .mega-inner { grid-template-columns: 0.8fr repeat(var(--mega-cols, 2), 1fr) 1.1fr; }
}
@media (max-width: 767px) {
    .header-icons .wm-theme-btn { display: grid; }
}

/* ── 푸터: 우리 항목(소개 한 줄 · 바로가기 · 무통장 계좌 · 개인정보처리방침) ─── */
.wm-footer-tagline {
    margin: 0 0 14px;
    color: #a4a6a0;
    font-size: 15px;
    line-height: 1.8;
}
.wm-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 20px;
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.85;
}
.wm-footer-links a { color: #bfc0ba; }
.wm-footer-links a:hover,
.wm-footer-privacy:hover { color: #fff; }
.wm-footer-privacy {
    margin-left: 14px;
    color: #ced0c7;
    text-decoration: underline;
    text-underline-offset: 3px;
}
@media (max-width: 700px) {
    .wm-footer-links { gap: 6px 15px; }
    .wm-footer-privacy { display: inline-block; margin: 6px 0 0; }
    footer { padding-bottom: max(36px, env(safe-area-inset-bottom, 0px)); }   /* 아이폰 홈 막대 (본 사이트 그대로) */
}

/* ── 덮개(서랍·검색) 공통 ─────────────────────────────────── */
.drawer-overlay {
    position: fixed;
    inset: 0;
    background: #0008;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s, visibility 0.25s;
}
.drawer-overlay.open { opacity: 1; visibility: visible; }

/* 장바구니 서랍 — 외주본 SHOPPING BAG 패널 */
.wm-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 101;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s;
}
.wm-drawer.open { transform: none; }
.wm-drawer .panel-title { flex-shrink: 0; margin-bottom: 8px; }
.wm-drawer #drawer-body { flex: 1; overflow: auto; min-height: 0; }
.wm-drawer .drawer__foot { flex-shrink: 0; padding-top: 6px; padding-bottom: env(safe-area-inset-bottom, 0px); }   /* 아이폰 홈 막대 위로 (본 사이트 그대로) */
.wm-drawer .cart-total { margin: 22px 0 0; }
.wm-drawer-note {
    display: block;
    margin-top: 16px;
    text-align: center;
    color: #999;
    font-size: 13px;
}
.cart-list .wm-line__img { flex-shrink: 0; display: block; background: #f2f2f2; position: relative; width: 110px; height: 140px; }
.cart-list .wm-line__img img { width: 100%; height: 100%; object-position: top; }
.cart-list h4 { margin: 0 0 6px; line-height: 1.5; }
.cart-list p { margin: 0 0 4px; }
.cart-list .wm-line__preorder { color: #111; font-weight: 650; }
.cart-list .quantity-control { width: max-content; height: 34px; margin: 10px 0 12px; }
.cart-list .quantity-control button {
    display: grid;
    place-items: center;
    width: 34px;
    margin: 0;
    color: #111;
    font-size: 18px;
    text-decoration: none;
}
.cart-list .quantity-control span {
    display: grid;
    place-items: center;
    min-width: 34px;
    font-size: 15px;
}
.cart-list .empty p { margin: 0 0 6px; }
.cart-list .empty .dark-button { justify-content: center; }

/* 무료배송 게이지 — 서랍·장바구니·주문서 공용 */
.fsg { margin: 16px 0 4px; font-size: 15px; line-height: 1.6; }
.fsg__txt b { font-weight: 650; }
.fsg__txt--done { font-weight: 650; }
.fsg__bar { height: 2px; background: #eee; margin-top: 10px; overflow: hidden; }
.fsg__bar > span { display: block; height: 100%; background: #111; transition: width 0.3s; }

/* 검색 — 외주본 SEARCH 패널. 최근·인기 검색어·바로가기는 같은 글자·선 규칙으로 */
.wm-search:not(.open) { display: none; }
.wm-search .panel { height: 100%; }
.s-sec { margin: 28px 0 0; }
.s-sec__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    font-size: 13px;
    letter-spacing: 1px;
    color: #888;
}
.s-link { font-size: 13px; color: #888; text-decoration: underline; padding: 0; }
.s-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.s-chip,
.s-recent {
    display: inline-flex;
    align-items: center;
    border: 1px solid #ddd;
    font-size: 15px;
}
.s-chip { padding: 9px 14px; }
.s-recent__t { padding: 9px 4px 9px 14px; }
.s-recent__x { padding: 9px 12px 9px 8px; color: #999; }
.s-chip:hover,
.s-recent:hover { border-color: #111; }
.s-pop { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 24px; }
.s-pop button {
    display: flex;
    gap: 14px;
    width: 100%;
    padding: 9px 0;
    text-align: left;
    font-size: 15px;
    border-bottom: 1px solid #eee;
}
.s-pop b { min-width: 16px; font-weight: 650; }
/* 우리 검색은 결과를 .s-reslist 로 한 겹 더 감싼다 → 외주본 .search-results > a 줄 모양을 그대로 옮겨 건다 */
.s-reslist > a.s-res {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
    font-size: 15px;
}
.s-reslist > a.s-res > img { width: 75px; height: 95px; flex-shrink: 0; object-position: top; }
.s-reslist > a.s-res b { display: block; margin-top: 10px; }
.s-reslist > a.s-res > span:nth-of-type(1) { flex: 1; }
[data-theme="dark"] .s-reslist > a.s-res { border-color: #2a2a2a; }
.s-res__meta { display: block; margin-top: 4px; font-size: 13px; color: #999; }
.s-res .wm-noimg { width: 75px; height: 95px; background: #f2f2f2; flex-shrink: 0; }
.s-more { margin-top: 22px; }
.wm-search .search-results .empty p { margin: 0 0 6px; }

/* ── 상품 카드 — 외주본 article.product + 우리 기능 ───────────────── */
.product.card { position: relative; }
.product.card .product-image { display: block; }
.product-image .card__img { position: absolute; inset: 0; }
.product-image .card__img--alt { opacity: 0; transition: opacity 0.35s; }
.product-image:hover .card__img--alt img[src] { opacity: 1; }
.product-image:hover .card__img--alt:has(img[src]) { opacity: 1; }
.product-image .card__img--sw { opacity: 0; }
.product-image .card__img img { transition: transform 0.5s; object-position: top; }
/* 마우스 올려도 사진 크기 그대로 (2026-10-27) */
.product-image:hover img { transform: none; }   /* style.css 의 scale(1.04) 무효화 */
:root { --card-alt-filter: none; }

/* 라벨 — 외주본 .label(흰 네모) 그대로 보이게. 여러 개면 세로로 */
.product .wm-labels {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    max-width: calc(100% - 70px);
    pointer-events: none;
}
.product .wm-labels .label { display: block; position: static; max-width: none; white-space: nowrap; }
.wm-label--accent { color: #b34635; }

/* 색상 점 — 외주본 .swatches(8px 네모) 그대로, 누르는 범위만 넓힌다 */
.product .swatches { display: flex; }
.card__swatch {
    position: relative;
    width: 8px;
    height: 8px;
    padding: 0;
    border: 1px solid #ddd;
    background: var(--sw, #888);
}
.card__swatch::after { content: ""; position: absolute; inset: -6px; }
.card__swatch.on { outline: 1px solid #111; outline-offset: 2px; }

/* 바로 담기(+) — 외주본 원형 흰 버튼(.best-arrow 모양) */
.card__add {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid #ddd;
    border-radius: 50%;
    background: #fff;
    color: #111;
    box-shadow: 0 2px 9px #00000012;
}
.card__add svg { width: 19px; height: 19px; display: block; }
.card__add:hover { background: #111; color: #fff; border-color: #111; }

/* 사진 넘기기 — 외주본 화살표 원형 버튼, 마우스 올렸을 때만 */
.card__nav {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid #ddd;
    border-radius: 50%;
    background: #fff;
    color: #111;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.2s;
}
.card__nav svg { width: 18px; height: 18px; display: block; }
.card__nav--prev { left: 10px; }
.card__nav--next { right: 10px; }
.product-image:hover .card__nav { opacity: 1; }
@media (hover: none) { .card__nav { display: none; } }
.card__count {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    pointer-events: none;
}
.card__dot { width: 6px; height: 6px; border-radius: 50%; background: #ffffff80; }
.card__dot.on { background: #fff; }
.card__dot--sm { width: 4px; height: 4px; }

/* 타임세일 남은 시간 — 사진 아래쪽 검정 띠 */
.flash-cd {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    background: #111;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
}
.flash-cd__lab,
.flash-cd__r { white-space: nowrap; }
.flash-cd__lab b { font-weight: 650; }
.flash-cd__t { font-variant-numeric: tabular-nums; }
.card__media--gal:has(.flash-cd) .card__count { bottom: 46px; }
/* 어드민 타임세일 배지 — 빨간 박스 + TIME SALE 깜빡임 + 빛 스침 + 할인율 맥박 (가입 팝업 TIME SALE 블록과 같은 결, 2026-10-28) */
.flash-cd:not([data-ps]) { overflow: hidden; background: linear-gradient(100deg, #ff3b2f 0%, #e3170c 55%, #c40f06 100%); }
.flash-cd:not([data-ps])::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 35%; pointer-events: none;
  background: linear-gradient(105deg, transparent, #ffffff4d, transparent); transform: skewX(-18deg); animation: fcShine 2.8s ease-in-out infinite; }
@keyframes fcShine { 0% { left: -60%; } 50%, 100% { left: 130%; } }
.flash-cd:not([data-ps]) .flash-cd__lab { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.flash-cd__tag { display: inline-flex; align-items: center; gap: 5px; padding-right: 7px; border-right: 1px solid #ffffff66; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.flash-cd__tag i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: tsBlink 1s steps(2, start) infinite; }
.flash-cd:not([data-ps]) .flash-cd__lab b { display: inline-block; font-size: 1.22em; font-weight: 900; letter-spacing: -0.3px; animation: fcPulse 1.6s ease-in-out infinite; transform-origin: center; }
@keyframes fcPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.flash-cd:not([data-ps]) .flash-cd__r { color: #ffe1de; }
.flash-cd:not([data-ps]) .flash-cd__t { color: #fff; font-weight: 800; }
@keyframes tsBlink { to { visibility: hidden; } }
/* 급한 느낌 — 할인율 크게 + '할인중' 흰 알약, 남은 시간은 어두운 칩에 굵게, '마감까지' 라벨 */
.flash-cd:not([data-ps]) .flash-cd__lab b { font-size: 1.45em; line-height: 1; }
.flash-cd__now { padding: 2px 6px; border-radius: 3px; background: #fff; color: #e3170c; font-size: .86em; font-weight: 900; letter-spacing: -0.2px; }
.flash-cd:not([data-ps]) { flex-wrap: wrap; row-gap: 5px; }   /* 칸이 좁으면 시간이 아랫줄로 */
.flash-cd:not([data-ps]) .flash-cd__r { display: inline-flex; align-items: center; gap: 6px; }
.flash-cd__end { font-style: normal; font-size: .82em; font-weight: 800; color: #fff; opacity: .9; }
.flash-cd:not([data-ps]) .flash-cd__t { padding: 3px 7px; border-radius: 3px; background: #0000004d; font-weight: 900; letter-spacing: .2px; }
/* 1시간 미만: 노란 시간 + '마감 임박' 깜빡임 + 박스 맥박 */
.flash-cd--hurry .flash-cd__t { color: #ffe14d !important; }
.flash-cd--hurry .flash-cd__end { color: #ffe14d; opacity: 1; animation: tsBlink .9s steps(2, start) infinite; }
.flash-cd--hurry { animation: fcBeat 1.2s ease-in-out infinite; }
@keyframes fcBeat { 0%, 100% { box-shadow: inset 0 0 0 0 #ffe14d00; } 50% { box-shadow: inset 0 0 0 2px #ffe14dcc; } }
@media (max-width: 700px) {
    .flash-cd:not([data-ps]) { gap: 5px; }
    .flash-cd:not([data-ps]) .flash-cd__t { padding: 2px 6px; }
}
@media (prefers-reduced-motion: reduce) {
    .flash-cd:not([data-ps])::after, .flash-cd__tag i, .flash-cd:not([data-ps]) .flash-cd__lab b, .flash-cd--hurry, .flash-cd--hurry .flash-cd__end { animation: none; }
}
/* 높이 살짝 낮춤 (2026-10-28) — 위아래 여백·줄 간격·시간 칩 여백 축소 */
.flash-cd:not([data-ps]) { padding-top: 6px; padding-bottom: 6px; row-gap: 3px; line-height: 1.25; }
.flash-cd:not([data-ps]) .flash-cd__lab b { font-size: 1.35em; }
.flash-cd:not([data-ps]) .flash-cd__t { padding: 1px 6px; }
.flash-cd__now { padding: 1px 5px; }
@media (max-width: 700px) { .flash-cd:not([data-ps]) { padding-top: 5px; padding-bottom: 5px; } }
/* 가입 직후 회원 타임세일 배지 — 배치·글자 크기는 그대로, 빨간 포인트로 '지금 할인 중'이 보이게 (2026-10-28) */
.flash-cd[data-ps] { background: linear-gradient(90deg, #1a0503, #111 55%); }
.flash-cd[data-ps]::before { content: ""; position: absolute; left: 0; top: 0; height: 2px; width: calc(var(--ps-left, 1) * 100%); background: #ff3b2f; transition: width .2s linear; }
.flash-cd[data-ps] .flash-cd__lab b { color: #ff3b2f; font-weight: 800; }
.flash-cd[data-ps] .flash-cd__lab::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 6px 1px 0; border-radius: 50%; background: #ff3b2f; vertical-align: middle; animation: psDot 1.6s ease-in-out infinite; }
@keyframes psDot { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
.flash-cd[data-ps] .flash-cd__t { font-weight: 700; color: #fff; }
.flash-cd[data-ps] .flash-cd__r { color: #b9b9b9; }
@media (prefers-reduced-motion: reduce) { .flash-cd[data-ps] .flash-cd__lab::before { animation: none; } }
/* 카드 사진 옆으로 밀기 — 세로 스크롤만 브라우저에 맡기고 가로는 사진 넘김에 쓴다. 사진이 끌려가지 않게 (본 사이트 그대로) */
.card__media--gal { touch-action: pan-y; }
.card__media--gal img { -webkit-user-drag: none; user-select: none; }
@media (max-width: 700px) {
    .product .wm-labels { top: 8px; left: 8px; max-width: calc(100% - 52px); }
    .card__add { top: 8px; right: 8px; width: 32px; height: 32px; }
    .card__add svg { width: 17px; height: 17px; }
    .flash-cd { flex-direction: column; align-items: flex-start; gap: 0; padding: 7px 9px; font-size: 12px; }
}

/* 목록 번호 넘김(홈·목록 공용) */
.feed-pager { display: flex; justify-content: center; gap: 6px; margin-top: 40px; }
.pager-btn {
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border: 1px solid #ddd;
    font-size: 15px;
}
.pager-btn.on { background: #111; color: #fff; border-color: #111; }
.pager-btn:disabled { color: #ccc; cursor: default; }

/* ── 바로 담기 시트(#qadd) — 외주본 상세 팝업(.detail) 언어 ───────── */
.qadd { position: fixed; inset: 0; z-index: 150; display: none; align-items: center; justify-content: center; padding: 20px; }
.qadd.open { display: flex; }
.qadd__bd { position: absolute; inset: 0; background: #0008; }
.qadd__card {
    position: relative;
    width: min(480px, 100%);
    max-height: 90svh;
    overflow: auto;
    background: #fff;
    padding: 32px;
}
.qadd__x { position: absolute; top: 14px; right: 14px; padding: 6px; font-size: 20px; line-height: 1; }
.qadd__head { display: flex; gap: 15px; align-items: center; padding-right: 30px; margin-bottom: 22px; }
.qadd__img { width: 75px; height: 95px; flex-shrink: 0; background: #f2f2f2; object-position: top; }
.qadd__nm { margin: 0 0 8px; font-size: 15px; line-height: 1.5; }
.qadd__pr { font-size: 15px; font-weight: 650; }
.qadd__pr s { color: #999; font-weight: 400; margin-right: 8px; }
.qadd__lb { margin: 18px 0 10px; font-size: 15px; font-weight: 600; }
.qadd__colors,
.qadd__sizes { display: flex; flex-wrap: wrap; gap: 8px; }
.qadd__color { width: 26px; height: 26px; padding: 0; border: 1px solid #ddd; }
.qadd__color.on { outline: 1px solid #111; outline-offset: 2px; }
.qadd__size { min-width: 45px; height: 45px; padding: 0 10px; border: 1px solid #ddd; font-size: 15px; }
.qadd__size.on { background: #111; color: #fff; border-color: #111; }
.qadd__size.is-soldout { color: #bbb; text-decoration: line-through; cursor: not-allowed; }
.qadd__hint { margin: 12px 0 0; font-size: 13px; color: #999; }
.qadd__lines { margin-top: 16px; }
.qadd__line {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-top: 1px solid #eee;
    font-size: 15px;
}
.qadd__lmeta { margin-top: 2px; font-size: 13px; color: #999; }
.qadd__qty { display: flex; align-items: center; border: 1px solid #ddd; height: 34px; }
.qadd__qty button { width: 30px; font-size: 18px; }
.qadd__qty span { min-width: 24px; text-align: center; }
.qadd__rm { color: #999; padding: 4px; }
.qadd__total { display: flex; justify-content: space-between; align-items: center; padding: 20px 0; border-top: 1px solid #ddd; margin-top: 4px; }
.qadd__sum { font-size: 22px; font-weight: 650; }
.qadd__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.qadd__buy,
.qadd__cart { min-height: 50px; font-size: 15px; font-weight: 650; letter-spacing: 0.5px; }
.qadd__buy { background: #171717; color: #fff; }
.qadd__cart { border: 1px solid #171717; background: #fff; }
@media (max-width: 700px) {
    .qadd { align-items: flex-end; padding: 0; }
    .qadd__card { width: 100%; max-height: 88svh; padding: 24px 20px 20px; }
}

/* ── 팝업(교환·환불·재입고·결제 회원 게이트) — 외주본 패널 언어 ───── */
.wm-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 160;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: #0008;
}
.wm-modal-overlay.open { display: flex; }
.wm-modal {
    width: min(520px, 100%);
    max-height: 90svh;
    display: flex;
    flex-direction: column;
    background: #fff;
}
.wm-modal__head { display: flex; justify-content: space-between; align-items: center; padding: 28px 32px 18px; }
.wm-modal__head h3 { margin: 0; font-size: 22px; font-weight: 650; letter-spacing: -0.6px; }
.wm-modal__close { padding: 4px; }
.wm-modal__body { padding: 0 32px; overflow: auto; }
.wm-modal__foot { display: flex; justify-content: flex-end; gap: 10px; padding: 22px 32px 28px; }
.wm-modal .text-mute { color: #888; }
.wm-modal__msg { min-height: 20px; margin-top: 8px; font-size: 13px; }
.wm-modal__msg[data-tone="err"] { color: #b34635; }
.wm-modal__msg[data-tone="ok"] { color: #111; font-weight: 650; }
.wm-modal .field,
.wm-form .field { margin-bottom: 16px; }
.wm-modal .field label,
.wm-form .field label { display: block; margin-bottom: 8px; font-size: 13px; letter-spacing: 0.5px; color: #888; }
.wm-modal input,
.wm-modal select,
.wm-modal textarea {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 0;
    padding: 13px 14px;
    font: inherit;
    font-size: 15px;
    background: #fff;
    color: #111;
}
.wm-modal textarea { min-height: 96px; resize: vertical; }
.wm-modal input:focus,
.wm-modal select:focus,
.wm-modal textarea:focus { outline: none; border-color: #111; }
.wm-modal .btn,
.wm-gate__btn {
    min-height: 48px;
    padding: 0 22px;
    font-size: 15px;
    font-weight: 650;
    letter-spacing: 0.5px;
}
.wm-modal .btn-primary,
.wm-modal .btn--dark { background: #171717; color: #fff; }
.wm-modal .btn-ghost,
.wm-modal .btn--ghost { border: 1px solid #ddd; background: #fff; }
.wm-modal .btn:disabled { opacity: 0.5; cursor: default; }
.wm-rf-policy { margin: 0 0 16px; padding: 14px 16px; background: #f7f7f7; font-size: 13px; line-height: 1.7; color: #555; }
.wm-rf-row { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid #eee; }
.wm-rf-nm { font-size: 15px; }
.wm-rf-op { margin-top: 2px; font-size: 13px; color: #999; }
.wm-rf-qty { display: flex; align-items: center; border: 1px solid #ddd; height: 32px; }
.wm-rf-qty button { width: 28px; font-size: 16px; }
.wm-rf-q { min-width: 22px; text-align: center; }
.wm-rf-total { margin-top: 10px; font-size: 15px; }
.wm-rf-total b { font-weight: 650; }
.wm-gate__lead { margin: 0 0 20px; font-size: 15px; line-height: 1.7; color: #777; }
.wm-gate__btn { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-bottom: 10px; }
.wm-gate__btn--kakao { background: #fee500; color: #371d1e; }
.wm-gate__btn--naver { background: #03c75a; color: #fff; }
.wm-gate__btn--guest { border: 1px solid #171717; background: #fff; }
.wm-gate__btn:disabled { opacity: 0.45; cursor: default; }
.wm-gate__soon { margin-left: 6px; padding: 2px 8px; border: 1px solid currentColor; font-size: 12px; }
.wm-gate__div { display: flex; align-items: center; gap: 12px; margin: 16px 0; color: #999; font-size: 13px; }
.wm-gate__div::before,
.wm-gate__div::after { content: ""; flex: 1; height: 1px; background: #eee; }
.wm-gate__foot { margin: 14px 0 28px; text-align: center; font-size: 15px; }
.wm-gate__foot a { border-bottom: 1px solid #999; padding-bottom: 4px; }
@media (max-width: 700px) {
    .wm-modal__head { padding: 24px 22px 14px; }
    .wm-modal__body { padding: 0 22px; }
    .wm-modal__foot { padding: 18px 22px 22px; }
}

/* ── 쿠키 사용 안내 — 아래쪽 흰 띠 ─────────────────────────────── */
.wm-consent {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 120;
    transform: translateY(110%);
    transition: transform 0.32s;
    pointer-events: none;
}
.wm-consent.on { transform: none; pointer-events: auto; }
.wm-consent__in {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 3.8%;
    background: #fff;
    border-top: 1px solid #ddd;
    box-shadow: 0 -6px 24px #0000000d;
}
.wm-consent__tx { display: flex; flex-direction: column; gap: 4px; font-size: 14px; line-height: 1.65; color: #777; }
.wm-consent__tx b { color: #111; font-size: 15px; font-weight: 650; }
.wm-consent__tx a { color: #111; text-decoration: underline; text-underline-offset: 3px; }
.wm-consent__btns { display: flex; gap: 10px; flex-shrink: 0; }
.wm-consent__no,
.wm-consent__yes { min-height: 44px; padding: 0 22px; font-size: 15px; font-weight: 650; }
.wm-consent__no { border: 1px solid #ddd; }
.wm-consent__yes { background: #171717; color: #fff; }
@media (max-width: 700px) {
    .wm-consent__in { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 18px 20px; }
    .wm-consent__btns > button { flex: 1; }
}

/* ── 신규 가입 10% 쿠폰 팝업(#evt-pop) — 외주본 홈 팝업 카드 언어 ──── */
.evtpop { position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center; padding: 20px; background: #0005; }
.evtpop__card {
    position: relative;
    width: min(420px, 100%);
    max-height: 92svh;
    overflow: auto;
    background: #fff;
    padding: 40px 32px 0;
    text-align: center;
    box-shadow: 0 10px 45px #0003;
}
.evtpop__x { position: absolute; top: 12px; right: 12px; padding: 6px; font-size: 18px; line-height: 1; }
.evtpop__logo { width: 120px; height: auto; margin: 0 auto; object-fit: contain; }
.evtpop__rule { width: 36px; height: 1px; margin: 22px auto; background: #ddd; }
.evtpop__lead { margin: 0; font-size: 17px; font-weight: 650; line-height: 1.5; letter-spacing: -0.4px; }
.evtpop__big { margin: 14px 0 6px; font-size: 76px; font-weight: 850; letter-spacing: -3px; line-height: 1; }
.evtpop__big .pct { font-size: 44px; }
.evtpop__big .ko { font-size: 26px; letter-spacing: -1px; }
.evtpop__sub { margin: 0 0 24px; font-size: 15px; color: #888; }
.evtpop__kakao,
.evtpop__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 50px;
    font-size: 15px;
    font-weight: 650;
}
.evtpop__kakao { background: #fee500; color: #371d1e; }
.evtpop__cta { background: #171717; color: #fff; }
.evtpop__alt { display: inline-block; margin: 16px 0 4px; font-size: 15px; border-bottom: 1px solid #999; padding-bottom: 4px; }
.evtpop__row { display: flex; gap: 8px; margin-bottom: 8px; }
.evtpop__row input { flex: 1; min-width: 0; border: 1px solid #ddd; padding: 12px; font: inherit; font-size: 15px; }
.evtpop__row button { padding: 0 16px; border: 1px solid #171717; font-size: 15px; white-space: nowrap; }
/* 알림 수신 동의 카드 (2026-10-28) — 체크하면 검정으로 채워지며 체크 표시가 그려짐 */
.evtpop__optin { position: relative; display: flex; align-items: center; gap: 12px; margin: 0 0 12px; padding: 13px 14px; text-align: left; cursor: pointer;
  border: 2px solid #111; border-radius: 14px; background: #fff; color: #111; overflow: hidden; -webkit-tap-highlight-color: transparent;
  transition: color .25s ease; isolation: isolate; }
.evtpop__optin::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #111; transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.6, 0, .2, 1); }
.evtpop__optin input { position: absolute; opacity: 0; pointer-events: none; }
.evtpop__optin .oc-box { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; border: 2px solid #111; background: #fff; display: grid; place-items: center;
  transition: background .2s, border-color .2s, transform .2s; }
.evtpop__optin .oc-box svg { width: 20px; height: 20px; fill: none; stroke: #111; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .3s ease .12s; }
.evtpop__optin .oc-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.evtpop__optin .oc-main { font-family: 'Jua', 'Pretendard', sans-serif; font-weight: 400; font-size: 20px; letter-spacing: -0.2px; line-height: 1.25; }
.evtpop__optin small { white-space: nowrap; font-size: 11.5px; color: #777; letter-spacing: -0.2px; transition: color .25s; }
.evtpop__optin .oc-tag { display: inline-block; margin-right: 5px; font-size: 10px; font-weight: 800; letter-spacing: .04em; padding: 1px 6px; border-radius: 999px; background: #ff3b2f; color: #fff; vertical-align: 1px; }
.evtpop__optin:has(input:checked) { color: #fff; }
.evtpop__optin:has(input:checked)::before { transform: scaleX(1); }
.evtpop__optin:has(input:checked) small { color: #cfcfcf; }
.evtpop__optin:has(input:checked) .oc-box { background: #ff3b2f; border-color: #ff3b2f; }
.evtpop__optin:has(input:checked) .oc-box svg { stroke: #fff; stroke-dashoffset: 0; }
.evtpop__optin:has(input:checked) .oc-tag { background: #fff; color: #111; }
.evtpop__optin:has(input:focus-visible) { outline: 2px solid #ff3b2f; outline-offset: 2px; }
.evtpop__optin.is-pop .oc-box { animation: ocPop .45s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes ocPop { 0% { transform: scale(.6); } 60% { transform: scale(1.18); } 100% { transform: scale(1); } }
.evtpop__optin.is-shake { animation: ocShake .42s ease; }
/* 체크 안 하고 가입·쿠폰 누르면: 빨간 테두리 + 체크 상자 위 말풍선 */
.evtpop__optin { overflow: visible; }
.evtpop__optin::before { border-radius: 12px; }
.evtpop__optin.is-need { border-color: #ff3b2f; box-shadow: 0 0 0 3px #ff3b2f33; }
.evtpop__optin .oc-hint { position: absolute; left: 4px; top: -34px; z-index: 2; padding: 5px 10px; border-radius: 8px; background: #ff3b2f; color: #fff;
  font-size: 12.5px; font-weight: 800; white-space: nowrap; opacity: 0; transform: translateY(4px); pointer-events: none; transition: opacity .2s, transform .2s; }
.evtpop__optin .oc-hint::after { content: ""; position: absolute; left: 18px; bottom: -5px; border: 5px solid transparent; border-bottom: 0; border-top-color: #ff3b2f; }
.evtpop__optin.is-need .oc-hint { opacity: 1; transform: none; animation: ocHint 1s ease-in-out .45s infinite; }
@keyframes ocHint { 0%, 100% { transform: none; } 50% { transform: translateY(-3px); } }
@keyframes ocShake { 0%, 100% { transform: none; } 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
/* 아직 안 눌렀을 때 살짝 숨쉬듯 — 눈길 끌기 */
.evtpop__optin:not(:has(input:checked)) .oc-box { animation: ocBreath 1.8s ease-in-out infinite; }
@keyframes ocBreath { 0%, 100% { box-shadow: 0 0 0 0 #ff3b2f55; } 50% { box-shadow: 0 0 0 6px #ff3b2f00; } }
@media (prefers-reduced-motion: reduce) { .evtpop__optin, .evtpop__optin * , .evtpop__optin::before { animation: none !important; transition: none !important; } }
.evtpop__msg { min-height: 20px; margin: 12px 0 0; font-size: 13px; color: #b34635; }
.evtpop__msg.ok { color: #111; font-weight: 650; }
.evtpop__today {
    display: block;
    width: calc(100% + 64px);
    margin: 22px -32px 0;
    padding: 14px;
    border-top: 1px solid #eee;
    font-size: 13px;
    color: #333;
}

/* ── 홈 프로모 팝업 — 외주본 .home-popup 그대로, 이미지 비율만 어드민 값 ── */
.home-popup-content { position: relative; }
.home-popup-content a,
.home-popup-content > div { display: block; width: 100%; height: 100%; }
/* 폰에서 팝업이 화면보다 커지던 문제(10/24 사토시 캡처): grid 의 자동 칸이 내용(스크립트가 준 폭)만큼 늘어나 max-width:100% 가 안 먹었다.
   칸을 화면 폭으로 고정하고 카드 폭·높이를 화면 안으로 묶는다. 아래 버튼 줄(오늘 하루 보지 않기 | 닫기)은 항상 보이게 */
.home-popup { grid-template-columns: minmax(0, 1fr); }
.home-popup-card { display: flex; flex-direction: column; max-width: min(100%, calc(100vw - 40px)); max-height: calc(100dvh - 40px); }
.home-popup-content { flex: 0 1 auto; min-height: 0; overflow: hidden; }
.home-popup-content img { width: 100%; height: 100%; object-fit: contain; }
.home-popup-actions { flex: none; }

/* ── 배너 제목(어드민에 제목을 넣었을 때만) ─────────────────────── */
.wm-hero-title {
    margin: 14px 0 0;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1.15;
}
.hero-pagination .wm-hero-count { cursor: default; }
@media (max-width: 700px) { .wm-hero-title { font-size: 27px; letter-spacing: -1px; } }

/* ==========================================================================
   다크모드 — 우리 기능(헤더 달 버튼). 외주본 톤을 반전해 같은 흑백 규칙으로.
   ========================================================================== */
[data-theme="dark"] body { background: #111; color: #eee; }
[data-theme="dark"] header,
[data-theme="dark"] .mega-menu,
[data-theme="dark"] .mobile-nav,
[data-theme="dark"] .panel,
[data-theme="dark"] .qadd__card,
[data-theme="dark"] .wm-modal,
[data-theme="dark"] .evtpop__card,
[data-theme="dark"] .home-popup-card,
[data-theme="dark"] .wm-consent__in { background: #161616; color: #eee; }
[data-theme="dark"] header { border-bottom-color: #2a2a2a; }
[data-theme="dark"] .wordmark img,
[data-theme="dark"] .evtpop__logo { filter: invert(1) brightness(1.06); }
[data-theme="dark"] .header-icons > button:hover,
[data-theme="dark"] .header-icons > a:hover { background: #262626; }
[data-theme="dark"] .header-icons sup { border-color: #161616; background: #eee; color: #111; }
[data-theme="dark"] .primary-nav > a::after,
[data-theme="dark"] .shop-trigger::after { background: #eee; }
[data-theme="dark"] .mega-column > a:not(.mega-heading) { color: #bbb; }
[data-theme="dark"] .mega-column > a:hover,
[data-theme="dark"] .mega-column > a.mega-sub-all { color: #fff !important; }
[data-theme="dark"] .mega-intro,
[data-theme="dark"] .mega-menu,
[data-theme="dark"] .mega-column > .mega-heading,
[data-theme="dark"] .mobile-categories,
[data-theme="dark"] .tabs,
[data-theme="dark"] .cart-list > div,
[data-theme="dark"] .search-results > a,
[data-theme="dark"] .s-pop button,
[data-theme="dark"] .qadd__line,
[data-theme="dark"] .qadd__total,
[data-theme="dark"] .wm-rf-row,
[data-theme="dark"] .wm-consent__in { border-color: #2a2a2a; }
[data-theme="dark"] .product-image,
[data-theme="dark"] .new-feature,
[data-theme="dark"] .cart-list .wm-line__img,
[data-theme="dark"] .qadd__img { background: #1c1c1c; }
[data-theme="dark"] .label { background: #161616; color: #eee; }
[data-theme="dark"] .wm-label--accent { color: #e2725f; }
[data-theme="dark"] .price b,
[data-theme="dark"] .detail-price b { color: #e2725f; }
[data-theme="dark"] .card__add,
[data-theme="dark"] .card__nav,
[data-theme="dark"] .best-arrow { background: #1c1c1c; color: #eee; border-color: #333; }
[data-theme="dark"] .dark-button,
[data-theme="dark"] .qadd__buy,
[data-theme="dark"] .evtpop__cta,
[data-theme="dark"] .wm-consent__yes,
[data-theme="dark"] .wm-modal .btn-primary,
[data-theme="dark"] .wm-modal .btn--dark,
[data-theme="dark"] .pager-btn.on,
[data-theme="dark"] .hdex-tabs .chosen,
[data-theme="dark"] .catalog-tabs .chosen,
[data-theme="dark"] .instagram-handle { background: #eee; color: #111; }
[data-theme="dark"] .qadd__cart,
[data-theme="dark"] .wm-gate__btn--guest { background: transparent; color: #eee; border-color: #eee; }
[data-theme="dark"] .hdex-tabs button,
[data-theme="dark"] .tabs .chosen { color: #eee; }
[data-theme="dark"] .tabs .chosen { border-bottom-color: #eee; }
[data-theme="dark"] .member-benefits { background: #1a1a19; }
[data-theme="dark"] .benefit-icon { background: #262626; color: #eee; }
[data-theme="dark"] .member-benefits > div:not(.member-heading)::before { background: #333; }
[data-theme="dark"] .member-benefits a:hover { color: #fff; border-color: #fff; }
[data-theme="dark"] .quick-links > button,
[data-theme="dark"] .quick-links > a:not(.quick-kakao) { background: #1c1c1c; color: #eee; border-color: #333; }
[data-theme="dark"] footer { background: #0b0b0b; }
[data-theme="dark"] .instagram-more,
[data-theme="dark"] .s-chip,
[data-theme="dark"] .s-recent,
[data-theme="dark"] .qadd__size,
[data-theme="dark"] .qadd__qty,
[data-theme="dark"] .quantity-control,
[data-theme="dark"] .pager-btn,
[data-theme="dark"] .wm-consent__no,
[data-theme="dark"] .wm-modal .btn-ghost,
[data-theme="dark"] .wm-modal .btn--ghost { border-color: #333; }
[data-theme="dark"] .qadd__size.on { background: #eee; color: #111; border-color: #eee; }
[data-theme="dark"] .panel input,
[data-theme="dark"] .wm-modal input,
[data-theme="dark"] .wm-modal select,
[data-theme="dark"] .wm-modal textarea,
[data-theme="dark"] .evtpop__row input { background: #1a1a1a; color: #eee; border-color: #333; }
[data-theme="dark"] .panel input { border-color: #eee; border-width: 0 0 1px; }
[data-theme="dark"] .wm-rf-policy { background: #1c1c1c; color: #bbb; }
[data-theme="dark"] .fsg__bar { background: #2a2a2a; }
[data-theme="dark"] .fsg__bar > span { background: #eee; }
[data-theme="dark"] .toast { background: #eee; color: #111; }
/* 다크모드: 선택된 탭·회원 이니셜은 위 일반 규칙보다 뒤에서 확정 */
[data-theme="dark"] .hdex-tabs button.chosen,
[data-theme="dark"] .catalog-tabs button.chosen { background: #eee; color: #111; }
[data-theme="dark"] .header-icons .account-link .wm-account-initial { background: #eee; color: #111; }
/* 다크모드 대비 sweep(10/24): 어두운 바탕에 어두운 글자/선이 남던 곳 — 사진 위 라벨·서랍 수량 버튼·상품 안내 탭 선택 */
[data-theme="dark"] .new-feature > span { background: rgba(22, 22, 22, 0.88); color: #eee; }
[data-theme="dark"] .cart-list .quantity-control button { color: #eee; }
[data-theme="dark"] .detail-tabs button[aria-selected="true"] { color: #eee; border-color: #eee; }

/* 바로 담기(+) 원 제거 — 십자만, 살짝 두껍게 (2026-10-26) */
.card__add, .card__add:hover, [data-theme="dark"] .card__add { background: transparent; border: 0; box-shadow: none; color: #111; }
.card__add svg { stroke-width: 2.2; width: 22px; height: 22px; }
.card__add:hover svg { opacity: .6; }
@media (max-width: 760px) { .card__add svg { width: 20px; height: 20px; } }

/* 헤더 높이 축소 — PC 88→64, 모바일 70→56, 로고 비례 축소 (2026-10-26) */
header { height: 64px; min-height: 64px; }
header .wordmark { width: 112px; height: 48px; }
@media (min-width: 768px) and (max-width: 1250px) { header { height: auto; min-height: 64px; padding-top: 8px; padding-bottom: 8px; } }
@media (max-width: 767px) {
    header { height: 56px; min-height: 56px; }
    header .wordmark { width: 96px; height: 40px; }
    .mobile-nav { top: calc(var(--wm-header-h, 56px) + 38px); }
}

/* 햄버거 메뉴 자연스럽게 열기/닫기 — 배경은 서서히, 메뉴 항목은 위에서 살짝 내려오며 차례로 (2026-10-26) */
.mobile-nav { opacity: 0; transition: opacity .3s ease; }
.mobile-nav.is-open { opacity: 1; }
.mobile-nav > * { opacity: 0; transform: translateY(-10px); transition: opacity .3s ease, transform .4s cubic-bezier(.2,.7,.2,1); }
.mobile-nav.is-open > * { opacity: 1; transform: none; }
.mobile-nav.is-open > :nth-child(1) { transition-delay: .04s; }
.mobile-nav.is-open > :nth-child(2) { transition-delay: .08s; }
.mobile-nav.is-open > :nth-child(3) { transition-delay: .12s; }
.mobile-nav.is-open > :nth-child(4) { transition-delay: .16s; }
.mobile-nav.is-open > :nth-child(5) { transition-delay: .20s; }
.mobile-nav.is-open > :nth-child(6) { transition-delay: .24s; }
.mobile-nav.is-open > :nth-child(n+7) { transition-delay: .28s; }
#menu-toggle.wm-icon-swap svg { animation: wmIconSwap .3s ease; }
@keyframes wmIconSwap { from { opacity: 0; transform: rotate(-90deg) scale(.7); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .mobile-nav, .mobile-nav > * { transition: none !important; } #menu-toggle.wm-icon-swap svg { animation: none; } }

/* 함께 구매 할인 강조 — 장바구니 서랍·장바구니·주문서 (2026-10-26) */
.wm-drawer-bundle { color: #e23b2e; font-size: 14px; }
.wm-drawer-bundle b { color: #e23b2e; }
#sum-bundle-row dt, #sum-bundle-row dd, #ck-bundle-row dt, #ck-bundle-row dd { color: #e23b2e; font-weight: 700; }
#sum-bundle-row em, #ck-bundle-row em { color: #e23b2e; opacity: .75; font-weight: 500; }
.bag-bundle-tag { color: #e23b2e; font-weight: 700; }

/* 할인 내역 — 상품 개별 할인 줄·총 할인 금액 (2026-10-26) */
.wm-disc-row dt, .wm-disc-row dd { color: #e23b2e; font-weight: 700; }
.wm-disc-row em { color: #e23b2e; opacity: .75; font-weight: 500; }
.wm-save-total { display: flex; justify-content: space-between; align-items: center; margin: 12px 0 4px; padding: 10px 12px; background: #fdf0ef; color: #e23b2e; font-size: 14px; font-weight: 700; border-radius: 4px; }
.wm-save-total b { font-size: 16px; }
[data-theme="dark"] .wm-save-total { background: #2a1615; }

/* 메가메뉴 — 왼쪽 문구·오른쪽 이미지 숨김 후 카테고리 열만 (2026-10-26) */
.mega-inner, .mega-inner:is(*) { grid-template-columns: repeat(var(--mega-cols, 2), minmax(0, 1fr)) !important; }

/* 모바일 헤더 아이콘 줄이기 — 로고 + 검색·장바구니·메뉴만. 로그인·다크모드는 메뉴 맨 아래 (2026-10-26) */
.wm-mm-extra { display: none; }
@media (max-width: 767px) {
    header #account-link, header #theme-btn { display: none !important; }
    .wm-mm-extra { display: flex; gap: 10px; margin-top: 18px; padding-top: 18px; border-top: 1px solid #eee; }
    .wm-mm-extra > a, .wm-mm-extra > button { flex: 1; display: block; padding: 12px 0 !important; border: 1px solid #ddd; background: transparent; color: inherit; font: inherit; font-size: 14px; font-weight: 600; text-align: center; cursor: pointer; }
    [data-theme="dark"] .wm-mm-extra { border-color: #333; }
    [data-theme="dark"] .wm-mm-extra > a, [data-theme="dark"] .wm-mm-extra > button { border-color: #444; }
}

/* 푸터 — 메뉴 링크는 그대로, 부가 정보(소개 문구·사업자 정보·연락처·저작권)는 작게 (2026-10-26) */
footer .wm-footer-tagline { font-size: 12px !important; line-height: 1.6 !important; }
footer .company { line-height: 1.7 !important; }
footer .company .company-business, footer .company .company-address { font-size: 11px !important; line-height: 1.7 !important; }
footer .footer-contact { font-size: 12px !important; }
footer .footer-contact a, footer .footer-contact span { font-size: 12px !important; }
footer .footer-contact a[href^="tel:"] { font-size: 13px !important; }
footer .footer-copyright { font-size: 11px !important; }
footer .footer-copyright .wm-footer-privacy { font-size: 12px !important; }

/* 장바구니 서랍 — 할인 내역·결제하기 버튼 (2026-10-26) */
.wm-drawer-disc { display: grid; gap: 8px; margin: 12px 0 6px; font-size: 14px; }
.wm-dd-row { display: flex; justify-content: space-between; align-items: center; }
.wm-dd-red { color: #e23b2e; }
.wm-dd-red b { font-weight: 700; }
.wm-dd-save { padding: 8px 10px; background: #fdf0ef; color: #e23b2e; font-weight: 700; border-radius: 4px; }
.wm-dd-total { padding-top: 10px; border-top: 1px solid #ddd; font-size: 16px; font-weight: 800; }
[data-theme="dark"] .wm-dd-save { background: #2a1615; }
[data-theme="dark"] .wm-dd-total { border-color: #333; }
.bag-drawer-actions .wm-drawer-checkout { display: flex; justify-content: center; align-items: center; min-height: 54px; border: 1px solid #111; background: #fff; color: #111; font-size: 15px; font-weight: 700; text-decoration: none; }
.bag-drawer-actions .wm-drawer-checkout:hover { background: #111; color: #fff; }
[data-theme="dark"] .bag-drawer-actions .wm-drawer-checkout { background: transparent; color: #eee; border-color: #eee; }

/* 다크모드 모바일 메뉴 — style.css 의 흰 배경(!important)을 덮어 어두운 배경 + 밝은 글자 (2026-10-26) */
@media (max-width: 767px) {
    [data-theme="dark"] .mobile-nav { background: #161616 !important; color: #eee; }
    [data-theme="dark"] .mobile-nav > a, [data-theme="dark"] .wm-mm-extra > a, [data-theme="dark"] .wm-mm-extra > button { color: #eee !important; }
    [data-theme="dark"] .mobile-categories { border-color: #333 !important; }
    [data-theme="dark"] .mobile-categories > a { color: #9a9a9a !important; }
}

/* 페이지 스크롤바 — 얇은 검정 라인 + 부드럽게 따라오는 손잡이 (ui.js 가 html.wm-sb 를 붙일 때만, 2026-10-27) */
html.wm-sb { scrollbar-width: none; }
html.wm-sb::-webkit-scrollbar { display: none; width: 0; height: 0; }
.wm-sbar { position: fixed; top: 0; right: 0; bottom: 0; width: 12px; z-index: 2147483000; }
.wm-sbar.off { display: none; }
.wm-sbar > i { position: absolute; top: 0; right: 3px; width: 3px; border-radius: 3px; background: #111; opacity: .85; transition: width .15s ease, opacity .15s ease; will-change: transform; cursor: grab; }
.wm-sbar:hover > i, .wm-sbar.drag > i { width: 5px; opacity: 1; }
.wm-sbar.drag > i { cursor: grabbing; }
html.wm-sb:has(.wm-sbar.drag) { user-select: none; }
[data-theme="dark"] .wm-sbar > i { background: #eee; }

/* 메인 히어로 영상 슬라이드 (2026-10-27) — 이미지와 같은 자리·톤, 화면 꽉 채움 */
.hdex-hero .hero-slide > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; display: block; filter: brightness(.82); background: #111; pointer-events: none; }

/* 가입 직후 개인 타임세일 (2026-10-28) — 가입 팝업 안내 + 진행 중 하단 띠 */
.evtpop__ts { position: relative; overflow: hidden; margin: -6px 0 22px; padding: 16px 18px; background: #0a0a0a; color: #fff;
  display: flex; align-items: center; gap: 16px; text-align: left; border-radius: 4px; }
/* 빛 스치는 효과 */
.evtpop__ts::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; pointer-events: none;
  background: linear-gradient(105deg, transparent, #ffffff26, transparent); transform: skewX(-18deg); animation: tsShine 3.2s ease-in-out 1.4s infinite; }
@keyframes tsShine { 0% { left: -60%; } 45%, 100% { left: 130%; } }
.evtpop__ts .ts-l { position: relative; flex: 0 0 auto; width: 92px; height: 92px; display: flex; align-items: baseline; justify-content: center; padding-top: 22px; }
.evtpop__ts .ts-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.evtpop__ts .ts-ring circle { fill: none; stroke: #ffffff26; stroke-width: 5; }
.evtpop__ts .ts-ring .ts-ring__run { stroke: #ff3b2f; stroke-linecap: round; stroke-dasharray: 283; stroke-dashoffset: 0; animation: tsRing 15s linear infinite; }
@keyframes tsRing { from { stroke-dashoffset: 0; } to { stroke-dashoffset: 283; } }
.evtpop__ts .ts-num { font-size: 46px; font-weight: 900; line-height: 1; letter-spacing: -2px; font-variant-numeric: tabular-nums; }
.evtpop__ts .ts-unit { font-size: 17px; font-weight: 800; margin-left: 1px; }
.evtpop__ts .ts-r { position: relative; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.evtpop__ts .ts-tag { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; letter-spacing: .16em; color: #ff3b2f; }
.evtpop__ts .ts-tag i { width: 7px; height: 7px; border-radius: 50%; background: #ff3b2f; animation: tsBlink 1s steps(2, start) infinite; }
@keyframes tsBlink { to { visibility: hidden; } }
.evtpop__ts .ts-main { font-size: 19px; font-weight: 800; line-height: 1.3; letter-spacing: -0.5px; }
.evtpop__ts .ts-main em { font-style: normal; color: #ff3b2f; font-size: 24px; display: inline-block; animation: tsPulse 1.6s ease-in-out 1.2s infinite; transform-origin: left center; }
@keyframes tsPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.evtpop__ts .ts-sub { font-size: 12px; color: #bdbdbd; letter-spacing: -0.2px; }
.evtpop__ts .ts-sub strong { color: #fff; font-weight: 800; }
/* 팝업 열릴 때 등장 */
.evtpop__ts.is-in { animation: tsIn .6s cubic-bezier(.2, .9, .3, 1.3) both .15s; }
.evtpop__ts.is-in .ts-r > * { animation: tsUp .5s ease-out both; }
.evtpop__ts.is-in .ts-r > :nth-child(1) { animation-delay: .35s; } .evtpop__ts.is-in .ts-r > :nth-child(2) { animation-delay: .5s; } .evtpop__ts.is-in .ts-r > :nth-child(3) { animation-delay: .65s; }
@keyframes tsIn { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
@keyframes tsUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 380px) { .evtpop__ts { gap: 12px; padding: 14px; } .evtpop__ts .ts-l { width: 80px; height: 80px; padding-top: 18px; } .evtpop__ts .ts-num { font-size: 40px; } .evtpop__ts .ts-main { font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .evtpop__ts *, .evtpop__ts::after, .evtpop__ts.is-in { animation: none !important; } }
#psale-bar { position: fixed; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 1500;
  display: flex; align-items: center; gap: 12px; padding: 11px 18px; border-radius: 999px; background: #0a0a0a; color: #fff;
  font-size: 13px; white-space: nowrap; box-shadow: 0 6px 24px #0004; text-decoration: none; max-width: calc(100vw - 24px); transition: bottom .3s ease; }
#psale-bar b { color: #ff544b; font-weight: 800; }
#psale-bar .psale-bar__t { font-variant-numeric: tabular-nums; font-weight: 700; }
body.product-detail-page #psale-bar { bottom: calc(86px + env(safe-area-inset-bottom)); }
@media (max-width: 480px) { #psale-bar .psale-bar__k { display: none; } }
@media (max-width: 360px) { #psale-bar { font-size: 12px; gap: 8px; padding: 10px 14px; } }

/* 우하단 빠른메뉴 — 원형 + 스크롤 따라오는 스프링(main.js 가 --fy 갱신) (2026-10-28) */
.quick-links > button, .quick-links > a { border-radius: 50% !important; transform: translate3d(0, var(--fy, 0px), 0); transition: box-shadow .2s; will-change: transform; }
.quick-links > button:hover, .quick-links > a:hover { transform: translate3d(0, calc(var(--fy, 0px) - 2px), 0); }

/* 빠른메뉴 인스타그램 — 공식 로고 그라데이션(노랑→주황→핑크→보라) + 흰 아이콘 (2026-10-28) */
.quick-links > a[href*="instagram"], [data-theme="dark"] .quick-links > a[href*="instagram"] { color: #fff; border: 0; background-origin: border-box; background-clip: border-box;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }

/* 적립금(마이페이지 프로필 아래) · 리뷰 쓰고 적립금 받기(마이페이지·장바구니) (2026-10-28) */
.pts-block .pts-card { margin: 0; }
.pts-block .pts-history { margin: 12px 0 0; }
.pts-eyebrow { font-size: 11px; letter-spacing: .14em; color: #999; }
.pts-card__hint b { font-weight: 700; color: #333; }
.rvp-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.rvp-head h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.3px; }
.rvp-badge { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; background: #111; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.rvp-lead { margin: 0 0 14px; font-size: 13px; color: #777; line-height: 1.55; }
.rvp-lead b { color: #111; }
.rvp-list { display: grid; gap: 10px; }
.rvp-item { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 14px; padding: 10px; border: 1px solid #e5e5e5; background: #fff; }
.rvp-thumb { display: block; width: 64px; height: 64px; background: #f3f2ef; overflow: hidden; }
.rvp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rvp-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.rvp-info b { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rvp-info span { font-size: 12px; color: #888; }
.rvp-btn { padding: 10px 14px; border: 0; background: #111; color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; text-decoration: none; }
.rvp-btn b { color: #ff6a5c; font-weight: 800; }
.rvp-btn:hover { background: #333; }
.rvp-more { margin: 4px 0 0; font-size: 12px; color: #999; }
.rvp-block--cart { margin: 40px 0 0; padding: 26px 28px; border: 1px solid #e5e5e5; }
.cart-pts { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 10px; margin: 12px 0 0; padding: 11px 12px; background: #f3f2ef; font-size: 13px; }
.cart-pts b { font-weight: 800; }
.cart-pts > span:last-child { color: #888; font-size: 12px; }
@media (max-width: 600px) {
  .rvp-item { grid-template-columns: 56px 1fr; gap: 10px 12px; }
  .rvp-thumb { width: 56px; height: 56px; }
  .rvp-btn { grid-column: 1 / -1; text-align: center; }
  .rvp-block--cart { margin-top: 28px; padding: 20px 16px; }
}
[data-theme="dark"] .rvp-item, [data-theme="dark"] .rvp-block--cart { background: #161616; border-color: #2a2a2a; }
[data-theme="dark"] .rvp-lead b, [data-theme="dark"] .pts-card__hint b { color: #eee; }
[data-theme="dark"] .rvp-btn, [data-theme="dark"] .rvp-badge { background: #eee; color: #111; }
[data-theme="dark"] .rvp-btn b { color: #c0392b; }
[data-theme="dark"] .cart-pts { background: #1c1c1c; }

/* 사용 가능 쿠폰 미리보기 (2026-10-28) — 장바구니·서랍 */
.wm-cpv { margin: 10px 0 12px; padding: 12px 14px; border: 1px dashed #1c34c0; border-radius: 6px; background: #f3f5ff; font-size: 14px; }
.wm-cpv__row { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: #1c34c0; font-weight: 700; }
.wm-cpv__row em { font-style: normal; font-weight: 500; opacity: .8; }
.wm-cpv__pay { margin-top: 6px; color: #171717; }
.wm-cpv__pay b { font-size: 16px; font-weight: 800; }
.wm-cpv__note { margin: 6px 0 0; font-size: 12px; color: #777; }
.wm-cpv__btn { width: 100%; margin-top: 10px; padding: 10px; border: 0; border-radius: 4px; background: #1c34c0; color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.wm-cpv__btn:disabled { opacity: .6; cursor: default; }
[data-theme="dark"] .wm-cpv { background: #141a33; border-color: #6f82ff; }
[data-theme="dark"] .wm-cpv__row { color: #9aa8ff; }
[data-theme="dark"] .wm-cpv__pay { color: #eee; }
[data-theme="dark"] .wm-cpv__note { color: #999; }
[data-theme="dark"] .wm-cpv__btn { background: #4b5dff; }