/* PC 디자인 정리 (2026-09-29 GS 확정 — 상품권 나머지 페이지 2차) — 채널 상세 /buy/card·phone·bank·visit/<상품권> · /sell/auto·visit/<상품권>
 * PC(768px 이상)에서만 읽힙니다: Base.astro 가 <link media="(min-width: 768px)"> 로 붙입니다. 모바일에는 영향 없음.
 * 시안을 CSS 덧씌우기로 만든 그대로 옮겨서 !important 가 많습니다(원래 스타일을 이기려고).
 * 방향: 순위/라벨 칩은 회색 글자 · 장식 상자·칩 줄·목록은 구분선으로 평평하게. 주요 카드·로고 카드 그리드·시세 숫자 색·H1 부제는 그대로.
 */
/* ===== /sell/auto/culture/ PC 시안 — 채널 상세 틀(/buy/card·phone·bank·visit/<상품권>, /sell/auto·visit/<상품권> 공통) (2026-09-29) ===== */
/* 남긴 주요 카드(원래 모양 그대로 — 규칙 없음): 오늘 최저/최고 요약(.ansbox), 거래소 순위(.rank-list — 1위 줄 강조·'공식' 배지 포함),
 *   다른 상품권 카드 격자(.other-grid/.other-card — 로고+값 작은 카드라 카드 그대로)
 * H1·부제 그대로. 시세 숫자 주황·파랑 그대로.
 */

/* 섹션 제목 → 22/700, 제목~내용 12 */
#main-content .sec-title, #main-content .section-title { font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; line-height: 1.3 !important; }
#main-content .sec-title { margin: 0 0 12px !important; }
#main-content .sec-sub { font-size: 12px !important; margin: -6px 0 12px !important; }

/* ⑤ 채널 칩 줄(할인 구매 전체 · 무통장입금 · 카드 · 휴대폰 · 전체 시세) → 밑줄 탭 글자 줄 */
#main-content .variant-nav { gap: 0 24px !important; padding: 14px 20px 0 !important; align-items: baseline !important; }
#main-content .vn-back { font-size: 13px !important; color: var(--ink-faint) !important; }
#main-content .vn-chips { gap: 0 20px !important; }
#main-content .vn-chip, #main-content .variant-nav.buy .vn-chip { background: none !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; padding: 6px 0 5px !important; font-size: 14px !important; font-weight: 500 !important; color: var(--ink-soft) !important; }
#main-content .vn-chip:hover { color: var(--ink) !important; border-bottom-color: var(--line) !important; }
#main-content .vn-chip.active, #main-content .variant-nav.buy .vn-chip.active { background: none !important; border-bottom-color: var(--ink) !important; color: var(--ink) !important; font-weight: 700 !important; }

/* 결제수단별 실결제액 · 권종별 표 — 흰 상자 → 평평한 표 (윗선 var(--line), 행 사이 line-soft, 지금 채널 줄 연파랑은 유지) */
#main-content .dt-wrap { border-radius: 0 !important; }
#main-content .denom-table { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; }
#main-content .denom-table thead th { background: transparent !important; font-weight: 500 !important; color: var(--ink-faint) !important; }
#main-content .denom-table tbody tr:nth-child(2n):not(.on) td { background: transparent !important; }
#main-content .denom-table tbody tr:last-child td { border-bottom: 1px solid var(--line-soft) !important; }
#main-content .denom-table th:first-child, #main-content .denom-table td:first-child { padding-left: 6px !important; }
#main-content .denom-table th:last-child, #main-content .denom-table td:last-child { padding-right: 6px !important; }

/* '나머지 N곳 더 보기' 상자 → 상자 없는 글자 줄 (순위 카드 바로 아래) */
#main-content .more-shops > summary { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; padding: 12px 6px !important; color: var(--ink-soft) !important; font-weight: 600 !important; }
#main-content .more-shops > summary:hover { background: var(--surface-2) !important; }
#main-content .more-shops .fold-ic { color: var(--ink-faint) !important; }

/* '왜 거래소마다 다를까?' 안내 상자 → 구분선 위 글 */
#main-content .why-box { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding: 16px 6px !important; margin-bottom: 24px !important; }

/* 최근 60일 가격 추이 — 흰 상자 → 평평하게 (그래프·방향색 글자 유지, 방향 알약 배경만 걷음) */
#main-content .btrend { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding: 18px 6px 0 !important; }
#main-content .btrend-h2 { font-size: 17px !important; font-weight: 700 !important; }
#main-content .btrend-dir { background: none !important; padding: 0 !important; margin-left: 8px !important; font-size: 13px !important; font-weight: 500 !important; }

/* 사기 전에 이것만 / 체크리스트 — 줄마다 상자 → 구분선 */
#main-content .check-list { gap: 0 !important; border-top: 1px solid var(--line) !important; }
#main-content .check-list li { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; padding: 13px 6px !important; }
#main-content .check-list li.ck-thin { border-bottom: 0 !important; padding: 10px 6px 0 !important; }

/* 읽어두면 좋은 글 — 윗선 1px 회색, 라벨 주황 → 회색 */
#main-content .gr-list { border-top: 1px solid var(--line) !important; }
#main-content .gr-item { padding-left: 6px !important; padding-right: 6px !important; }
#main-content .gr-item:last-child { border-bottom: 1px solid var(--line-soft) !important; }
#main-content .gr-tag { color: var(--ink-faint) !important; font-weight: 500 !important; }

/* 함께 보면 좋은 페이지 — 목록 맨 윗선 회색 */
#main-content .link-row-sec .rl-wrap { border-top: 1px solid var(--line) !important; }

/* 안내 상자 → 구분선 위 글 */
#main-content .legal-note { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 6px 0 !important; }

/* N일 기록으로 본 순위 — 흰 상자(좌우 여백 없이 본문 밖으로 붙어 있던 것) → 본문 폭 안 평평한 목록 */
#main-content .sr-sec .section-title { margin: 0 20px 12px !important; }
#main-content .sr-sub { font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0 !important; margin-top: 4px !important; }
#main-content .sr-card { margin: 0 20px !important; background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 0 14px !important; }
#main-content .sr-row, #main-content .sr-card .sr-say { padding-left: 6px !important; padding-right: 6px !important; }
#main-content .sr-no, #main-content .sr-row.top .sr-no { background: none !important; width: 20px !important; color: var(--ink-faint) !important; font-size: 13px !important; }
#main-content .sr-row.top .sr-no { color: var(--ink) !important; font-weight: 800 !important; }
#main-content .sr-rng-row { gap: 0 !important; }
#main-content .sr-rng-i, #main-content .sr-rng-i.on { background: transparent !important; border-radius: 0 !important; padding: 4px 14px !important; }
#main-content .sr-rng-i:first-child { padding-left: 6px !important; }
#main-content .sr-range .sr-say { padding-left: 6px !important; padding-right: 6px !important; }
#main-content .sr-rng-i + .sr-rng-i { border-left: 1px solid var(--line-soft) !important; }
#main-content .sr-note { margin: 10px 20px 0 !important; }
#main-content .sr-list .sr-row:last-child { border-bottom: 1px solid var(--line-soft) !important; }
#main-content .sr-card .sr-say { border-top: 0 !important; padding-top: 0 !important; }
#main-content .sr-range .sr-say { border-top: 1px solid var(--line-soft) !important; padding-top: 12px !important; margin-top: 12px !important; max-width: none !important; }

/* 레일 — 장식용 주황 숫자만 검정 */
.rl-chip.is-hot em { color: var(--ink) !important; }

/* 거래소 순위의 '공식' 알약 → 회색 작은 글자 (순위 카드 모양은 그대로) */
#main-content .off-badge { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 0 0 4px !important; color: var(--ink-faint) !important; font-weight: 500 !important; }