/* ═══ 런트립 /runtrip/ — 새 디자인 v3.5 (WMM · wm-) · 2026-10-06 클로드C ═══
   규칙 : https://idc.kr/_claude/RUNIN_WMM_DESIGN.txt · 값은 1~3장 표 그대로 · --wm-* 는 «읽기만»(재선언 0) · A 클래스 규칙 덮어쓰기 0
   런트립 고유 칸 = wmc-rt-* · 범위 = body.wmc-rt-page(버퍼가 붙인다)
   🔴 v3.5 : 검정은 «글자»에만 — 면·굵은 선·단추 테두리·아이콘은 남색. 모서리 0 · 사진 막 0 · 빨강 0(런트립에는 «서둘러라» 자리가 없다)
   🔴 함정 ③(규칙 9장) : 옛 app.css 가 하던 화면 읽기 글(.ri-sr)·svg.ri-i 크기·[hidden] 을 여기서 다시 준다 */
.wmc-rt-page .ri-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wmc-rt-page svg.ri-i { width: 1.25em; height: 1.25em; vertical-align: -.2em; }
.wmc-rt-page [hidden] { display: none !important; }
.wmc-rt-ic { width: 1.5rem; height: 1.5rem; flex: 0 0 auto; color: var(--wm-navy); }
.wmc-rt :where(dl, dd) { margin: 0; }

/* 보조 단추 — 규칙 3장 v3.5 : 투명 · 2px 남색 테두리 · 남색 글자 · 주 단추와 같은 크기 · hover 0.2rem 들림 */
.wmc-rt-line {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: transparent; color: var(--wm-navy); border: 2px solid var(--wm-navy); border-radius: 0;
  padding: 1rem 2rem; font: inherit; font-size: 1rem; line-height: 1; font-weight: 800; font-style: italic; text-transform: uppercase;
  cursor: pointer; transition: transform .2s ease;
}
.wmc-rt-line:hover { transform: translateY(-.2rem); }
.wmc-rt-line .wmc-rt-ic { width: 1.1rem; height: 1.1rem; }

/* 상태 — 규칙 3장 «판매사 상태»(v3.1) : 접수중 = A .wm-st(남색) 그대로 · 준비중 = 2px 남색 테두리 · 모객마감·대기가능 = 연회색 칩 */
.wmc-rt-st--ready { background: transparent; color: var(--wm-ink); box-shadow: inset 0 0 0 2px var(--wm-navy); }
.wmc-rt-st--closed, .wmc-rt-st--wait { background: var(--wm-chip); color: var(--wm-ink); }
.wmc-rt-dd.is-past { font-weight: 500; }

/* 거리 꼬리표 — 코스 색(규칙 1장 · 한 코스 한 색) · 5K·그 밖 = 라벨칩 회색 */
.wmc-rt-dist { display: flex; flex-wrap: wrap; gap: .3rem .35rem; margin-top: .45rem; padding-left: .2rem; }
.wmc-rt-dist > li, .wmc-rt-dist > button {
  display: inline-flex; align-items: center; transform: skew(-16deg); padding: .2rem .55rem;
  font-size: .75rem; line-height: 1.2; font-weight: 800; font-style: italic; background: var(--wm-chip); color: var(--wm-ink); border: 0; border-radius: 0;
}
.wmc-rt-dist .is-full { background: var(--wm-c-full); color: #fff; }
.wmc-rt-dist .is-half { background: var(--wm-c-half); color: #000; }
.wmc-rt-dist .is-10k { background: var(--wm-c-10k); color: #000; }
.wmc-rt-dist .is-trail { background: var(--wm-c-trail); color: #000; }
.wmc-rt-dist .is-ultra { background: var(--wm-c-ultra); color: #000; }
/* 고르기(거르개) — 높이 2.75rem · 늘 코스 색 · 고르면 3px 남색 테두리 + ✓ */
.wmc-rt-dist--pick { gap: .5rem .6rem; margin-top: 0; }
.wmc-rt-dist--pick > button { height: 2.75rem; padding: 0 1rem; font-size: .9375rem; cursor: pointer; }
.wmc-rt-dist--pick > button[aria-pressed="true"] { box-shadow: inset 0 0 0 3px var(--wm-navy); }
.wmc-rt-dist--pick > button.is-full[aria-pressed="true"] { box-shadow: inset 0 0 0 3px var(--wm-navy), inset 0 0 0 5px #fff; }
.wmc-rt-dist--pick > button[aria-pressed="true"]::before { content: "✓"; margin-right: .35rem; }

/* ═══ ① 허브 첫 화면 — 제목 한 줄 + 짧은 부제목 · 오른쪽 개수(2rem 남색) · 사진 카드 ═══ */
.wmc-rt-top { padding-bottom: 2rem; }
.wmc-rt-top__hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 2rem; }
.wmc-rt-h1 { font-size: clamp(2.5rem, 4.6vw, 4.75rem); line-height: .95; font-weight: 900; font-style: italic; letter-spacing: -.01em; }
.wmc-rt-sub { margin-top: 1rem; font-size: 1rem; font-weight: 500; }
.wmc-rt-tally { display: flex; align-items: baseline; gap: .5rem; white-space: nowrap; }
.wmc-rt-tally b { font-size: 2rem; line-height: 1; font-weight: 900; font-style: italic; color: var(--wm-navy); }
.wmc-rt-tally span { font-size: .875rem; font-weight: 800; }
/* 카드 — 사진 선명(막 0) + 글은 사진 아래 · 사진 3:2 · 바탕 #f7f9fa · 날짜 800 · 제목 900 기울임 (규칙 3장 «카드(사진 아래 글)») */
.wmc-rt-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.wmc-rt-card { display: flex; flex-direction: column; height: 100%; background: var(--wm-page); transition: transform .2s ease; }
.wmc-rt-card:hover { transform: translateY(-.2rem); }
.wmc-rt-card__f { display: block; aspect-ratio: 3 / 2; background: var(--wm-grey); overflow: hidden; }
.wmc-rt-card__f img { width: 100%; height: 100%; object-fit: cover; }
.wmc-rt-card__k { display: flex; align-items: center; gap: .6rem; padding: 1rem 1.25rem 0; }
.wmc-rt-card__t { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; padding: .6rem 1.25rem 0; font-size: 1.25rem; line-height: 1.3; font-weight: 900; font-style: italic; }
.wmc-rt-card:hover .wmc-rt-card__t { color: var(--wm-navy); }
.wmc-rt-card__i { display: flex; align-items: center; gap: .4rem; padding: .5rem 1.25rem 0; font-size: .875rem; font-weight: 800; white-space: nowrap; overflow: hidden; }
.wmc-rt-card__i .wmc-rt-ic { width: 1.1rem; height: 1.1rem; }
.wmc-rt-card__i time::after { content: "·"; margin-left: .4rem; }
.wmc-rt-card__p { margin-top: auto; padding: .75rem 1.25rem 1.25rem; }
.wmc-rt-price { font-size: 1.125rem; font-weight: 900; font-style: italic; white-space: nowrap; }
.wmc-rt-price span { font-size: .8125rem; margin-left: .1rem; font-style: normal; }
.wmc-rt-price--none { font-size: .875rem; font-weight: 800; font-style: normal; }

/* ═══ ② 전체 목록 — 대회일정 /find/ 꼴 (규칙 4장 ⑨) ═══ */
.wmc-rt-find { padding-top: 2rem; }
.wmc-rt-find__hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.75rem; }
.wmc-rt-n { display: flex; align-items: baseline; gap: .4rem; white-space: nowrap; }
.wmc-rt-n b { font-size: 2rem; line-height: 1; font-weight: 900; font-style: italic; color: var(--wm-navy); }
.wmc-rt-n span { font-size: .875rem; font-weight: 800; }
.wmc-rt-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.wmc-rt-filt { display: grid; gap: 1.5rem; align-content: start; background: var(--wm-page); padding: 1.5rem; }
.wmc-rt-q { display: flex; align-items: center; gap: .6rem; height: 3.25rem; padding: 0 1rem; background: #fff; border: 2px solid var(--wm-navy); }
.wmc-rt-q input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 1rem; font-weight: 600; color: var(--wm-ink); }
.wmc-rt-q:focus-within { box-shadow: 0 0 0 2px #fff, 0 0 0 5px var(--wm-navy); }
.wmc-rt-f { display: grid; gap: .75rem; }
.wmc-rt-f__l { display: flex; align-items: center; gap: .45rem; font-size: .875rem; font-weight: 800; font-style: italic; text-transform: uppercase; }
.wmc-rt-f__l .wmc-rt-ic { width: 1.25rem; height: 1.25rem; }
.wmc-rt-sel { height: 3rem; width: 100%; padding: 0 1rem; background: #fff; border: 1px solid var(--wm-field); border-radius: 0; font: inherit; font-size: 1rem; font-weight: 600; color: var(--wm-ink); }
.wmc-rt-sw { display: flex; align-items: center; gap: .6rem; font-weight: 800; cursor: pointer; }
.wmc-rt-sw input { width: 1.25rem; height: 1.25rem; accent-color: var(--wm-navy); }
.wmc-rt-filt .wmc-rt-line { justify-self: start; }
.wmc-rt-bar { display: flex; justify-content: flex-end; margin-bottom: 1rem; }
.wmc-rt-sort .wmc-rt-sel { width: auto; min-width: 12rem; }
.wmc-rt-head { display: grid; grid-template-columns: 6.5rem minmax(0, 1.75fr) minmax(0, 1fr) minmax(0, .9fr); column-gap: 2rem; padding: .75rem .25rem; border-bottom: 2px solid var(--wm-navy); font-size: .8125rem; font-weight: 800; }
.wmc-rt-row { position: relative; display: grid; grid-template-columns: 6.5rem minmax(0, 1.75fr) minmax(0, 1fr) minmax(0, .9fr); column-gap: 2rem; align-items: center; padding: 1rem .25rem; border-bottom: 1px solid var(--wm-line); transition: background-color .2s ease; }
.wmc-rt-row:hover { background: var(--wm-page); }
.wmc-rt-row > p, .wmc-rt-row > div { margin: 0; min-width: 0; }
.wmc-rt-row__d b { display: block; font-size: 1.5rem; line-height: 1.1; font-weight: 900; font-style: italic; }
.wmc-rt-row__d span { display: block; font-size: .8125rem; font-weight: 600; margin-top: .2rem; }
.wmc-rt-row__m { display: flex; align-items: center; gap: 1rem; }
.wmc-rt-row__f { flex: 0 0 auto; width: 6rem; height: 6rem; background: var(--wm-grey); overflow: hidden; }
.wmc-rt-row__f img { width: 100%; height: 100%; object-fit: cover; }
.wmc-rt-row__m > div { min-width: 0; }
.wmc-rt-row__t { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 1.125rem; line-height: 1.3; font-weight: 900; font-style: italic; }
.wmc-rt-row__t::after { content: ""; position: absolute; inset: 0; }
.wmc-rt-row:hover .wmc-rt-row__t, .wmc-rt-row__t:focus-visible { color: var(--wm-navy); }
.wmc-rt-row__s { display: grid; gap: .25rem; }
.wmc-rt-row__s > span { display: flex; align-items: center; gap: .35rem; font-weight: 700; }
.wmc-rt-row__s .wmc-rt-ic { width: 1.1rem; height: 1.1rem; }
.wmc-rt-row__r { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .6rem; }
.wmc-rt-empty { display: grid; justify-items: start; gap: 1rem; padding: 2.5rem 1.5rem; background: var(--wm-page); font-weight: 700; }
.wmc-rt-empty > .wmc-rt-ic { width: 2.5rem; height: 2.5rem; }

/* ═══ ③ 판매사 고지 ═══ */
.wmc-rt-notice { background: var(--wm-page); }
.wmc-rt-notice__hd { display: flex; align-items: flex-start; gap: 1.25rem; margin-bottom: 1.75rem; }
.wmc-rt-notice__ic { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; background: var(--wm-navy); }
.wmc-rt-notice__ic .wmc-rt-ic { width: 2rem; height: 2rem; color: #fff; }
.wmc-rt-notice__p { margin-top: .75rem; max-width: 62ch; }
.wmc-rt-seller { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); column-gap: 2rem; }
.wmc-rt-seller > div { padding: .75rem 0; border-top: 1px solid var(--wm-line); }
.wmc-rt-seller dt { font-size: .8125rem; font-weight: 800; }
.wmc-rt-seller dd { font-weight: 600; }
.wmc-rt-seller .is-tel dd { font-weight: 900; color: var(--wm-navy); }
.wmc-rt-more { margin-top: 1.5rem; }
.wmc-rt-more > summary { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; list-style: none; font-weight: 800; font-style: italic; color: var(--wm-navy); text-transform: uppercase; }
.wmc-rt-more > summary::-webkit-details-marker { display: none; }
.wmc-rt-more > summary .wmc-rt-ic { width: 1.25rem; height: 1.25rem; transition: transform .2s ease; }
.wmc-rt-more[open] > summary .wmc-rt-ic { transform: rotate(90deg); }
.wmc-rt-more > p { margin-top: .75rem; max-width: 70ch; }
.wmc-rt-notice__p strong { font-weight: 800; }
.wmc-rt-src { margin-top: 1.5rem; font-size: .875rem; font-weight: 600; }
.wmc-rt-back { margin-top: 1.5rem; }

/* ═══ 상세 ═══ */
.wmc-rt-prod { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.wmc-rt-gal { max-width: 500px; width: 100%; }                         /* 500px 원본을 늘리지 않는다(10-05 이미지 함정) */
.wmc-rt-gal__f { background: var(--wm-grey); }
.wmc-rt-gal__f img { width: 100%; height: auto; }
.wmc-rt-gal__f--empty { display: grid; place-items: center; gap: .5rem; aspect-ratio: 1 / 1; font-weight: 700; }
.wmc-rt-gal__f--empty .wmc-rt-ic { width: 3rem; height: 3rem; }
.wmc-rt-thumbs { display: flex; gap: .5rem; margin-top: .5rem; }
.wmc-rt-thumb { width: 4.5rem; height: 4.5rem; padding: 0; border: 0; background: var(--wm-grey); cursor: pointer; }
.wmc-rt-thumb img { width: 100%; height: 100%; object-fit: cover; }
.wmc-rt-thumb.is-on { outline: 3px solid var(--wm-navy); outline-offset: -3px; }
.wmc-rt-crumb { display: flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 700; margin-bottom: 1.25rem; }
.wmc-rt-crumb a { color: var(--wm-navy); }
.wmc-rt-k { display: flex; align-items: center; gap: .6rem; margin-bottom: .9rem; }
.wmc-rt-name { font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.05; font-weight: 900; font-style: italic; letter-spacing: -.01em; }
.wmc-rt-lead { margin-top: .9rem; font-weight: 600; }
.wmc-rt-info > .wmc-rt-dist { margin-top: .9rem; }
.wmc-rt-facts { margin-top: 1.5rem; border-top: 2px solid var(--wm-navy); }
.wmc-rt-facts > div { display: flex; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--wm-line); }
.wmc-rt-facts dt { flex: 0 0 9.5rem; display: flex; align-items: center; gap: .5rem; align-self: flex-start; font-size: .875rem; font-weight: 800; }
.wmc-rt-facts dt .wmc-rt-ic { width: 1.25rem; height: 1.25rem; }
.wmc-rt-facts dd { min-width: 0; font-weight: 600; }
.wmc-rt-buy { margin-top: 1.75rem; display: grid; gap: 1rem; }
.wmc-rt-buy__p { display: flex; align-items: baseline; gap: 1rem; }
.wmc-rt-buy__p > span { font-size: .875rem; font-weight: 800; }
.wmc-rt-buy__p .wmc-rt-price { font-size: 2rem; }
.wmc-rt-buy__p .wmc-rt-price span { font-size: 1rem; }
.wmc-rt-order { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .75rem 1rem; background: var(--wm-page); padding: 1rem 1.25rem; }
.wmc-rt-order__name { font-size: .875rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wmc-rt-qty { display: inline-flex; background: #fff; border: 1px solid var(--wm-field); }
.wmc-rt-qty button { width: 2.75rem; height: 2.75rem; border: 0; background: none; font-size: 1.25rem; font-weight: 700; }
.wmc-rt-qty input { width: 3rem; border: 0; text-align: center; font: inherit; font-weight: 800; color: var(--wm-ink); background: transparent; }
.wmc-rt-order__t { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-top: .75rem; border-top: 1px solid var(--wm-line); font-weight: 800; }
.wmc-rt-order__t strong { font-size: 1.25rem; font-weight: 900; font-style: italic; }
.wmc-rt-acts { display: flex; flex-wrap: wrap; gap: .75rem; }
.wmc-rt-note { font-size: .875rem; font-weight: 600; }
.wmc-rt-note.is-msg { color: var(--wm-navy); font-weight: 800; }
.wmc-rt-box4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.wmc-rt-box { display: grid; align-content: start; gap: .6rem; padding: 1.5rem; background: var(--wm-page); }
.wmc-rt-box__ic { display: inline-flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border: 2px solid var(--wm-navy); }
.wmc-rt-box__ic .wmc-rt-ic { width: 1.75rem; height: 1.75rem; }
.wmc-rt-box b { font-size: 1.125rem; font-weight: 900; font-style: italic; }
.wmc-rt-imgs .wm-hs { margin-bottom: 1.75rem; }
.wmc-rt-imgs__in { max-width: 860px; margin: 0 auto; }
.wmc-rt-imgs__in img { margin: 0 auto; height: auto; }

@media (min-width: 992px) {
  .wmc-rt-body { grid-template-columns: 30% minmax(0, 1fr); gap: 3rem; align-items: start; }
  .wmc-rt-filt { position: sticky; top: 7.5rem; max-height: calc(100vh - 8.5rem); overflow: auto; }
  .wmc-rt-prod { grid-template-columns: minmax(0, 500px) minmax(0, 1fr); gap: 4rem; align-items: start; }
}
@media (max-width: 991px) {
  .wmc-rt-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wmc-rt-box4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .wmc-rt-h1 { font-size: 11vw; }
  .wmc-rt-top__hd { margin-bottom: 1.5rem; }
  .wmc-rt-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .wmc-rt-card__k, .wmc-rt-card__t, .wmc-rt-card__i, .wmc-rt-card__p { padding-left: .75rem; padding-right: .75rem; }
  .wmc-rt-card__t { font-size: 1rem; }
  .wmc-rt-card__i { gap: .3rem; font-size: .8125rem; }
  .wmc-rt-card__i time::after { margin-left: .3rem; }
  .wmc-rt-card__p { padding-bottom: .9rem; }
  .wmc-rt-filt { padding: 1rem; gap: 1rem; }
  .wmc-rt-chips, .wmc-rt-dist--pick { flex-wrap: nowrap; overflow-x: auto; padding: .1rem .2rem .4rem .5rem; scrollbar-width: none; }
  .wmc-rt-chips > *, .wmc-rt-dist--pick > * { flex: 0 0 auto; }
  .wmc-rt-head { display: none; }
  .wmc-rt-bar { margin-bottom: .5rem; }
  .wmc-rt-row { grid-template-columns: 3.75rem minmax(0, 1fr); column-gap: .9rem; row-gap: .4rem; align-items: start; padding: .9rem .25rem; }
  .wmc-rt-row__d { grid-row: 1 / span 3; }
  .wmc-rt-row__d b { font-size: 1.25rem; }
  .wmc-rt-row__d span { font-size: .75rem; }
  .wmc-rt-row__m { gap: .75rem; align-items: flex-start; }
  .wmc-rt-row__f { width: 4rem; height: 4rem; }
  .wmc-rt-row__t { font-size: 1rem; }
  .wmc-rt-row__s { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; }
  .wmc-rt-notice__hd { gap: 1rem; }
  .wmc-rt-notice__ic { width: 3rem; height: 3rem; }
  .wmc-rt-gal { max-width: none; }
  .wmc-rt-gal__f img { max-width: 500px; margin: 0 auto; }
  .wmc-rt-facts dt { flex-basis: 7.5rem; }
  .wmc-rt-box4 { grid-template-columns: minmax(0, 1fr); }
  .wmc-rt-acts > * { flex: 1 1 auto; padding-left: 1rem; padding-right: 1rem; }
}
@media (max-width: 479px) {
  .wmc-rt-top__hd { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .wmc-rt-name { font-size: 7vw; }
}
@media (prefers-reduced-motion: reduce) {
  .wmc-rt-card, .wmc-rt-line, .wmc-rt-row, .wmc-rt-more > summary .wmc-rt-ic { transition: none; }
}
