/* PC 디자인 정리 (2026-09-29 GS 확정 시안 v5) — 거래소 목록 /platform
 * PC(768px 이상)에서만 읽힙니다: Base.astro 가 <link media="(min-width: 768px)"> 로 붙입니다. 모바일에는 영향 없음.
 * 시안을 CSS 덧씌우기로 만든 그대로 옮겨서 !important 가 많습니다(원래 스타일을 이기려고).
 * 방향: 형광펜 제거 · 순위/라벨 칩은 회색 글자 · 장식 목록·FAQ·칩 줄은 구분선으로 평평하게.
 *       페이지마다 주요 카드 1~3개는 원래 모양(웜크림·그림자·1위 강조) 그대로. 시세 숫자 주황·파랑은 유지.
 */
/* ③ 제목 형광펜 없애기 */
.hl-pen { text-decoration: none !important; padding: 0 !important; }
.group-title { font-size: 20px !important; letter-spacing: -0.02em !important; }
.group-count { background: none !important; padding: 0 0 0 4px !important; font-size: 13px !important; font-weight: 500 !important; color: var(--ink-faint) !important; }
.tb-heading { font-size: 20px !important; }

/* ④ 히어로 — 제목 한 색 (최고가 카드는 원래 모양 그대로 — 2026-09-29 GS) */

/* ② 색은 뜻이 있을 때만 — 칩 배경 없애고, 숫자는 검정, 각 표 1등 값만 색 */
.pfa-chip em { color: var(--ink) !important; font-size: 14px !important; font-weight: 600 !important; }

/* ⑤ 상자 대신 구분선 */
.pf-tabs { gap: 0 !important; border-bottom: 1px solid var(--line) !important; }
.pf-tab { flex-direction: row !important; justify-content: center !important; gap: 6px !important; background: none !important; border: 0 !important; border-bottom: 2px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; padding: 12px 6px !important; margin-bottom: -1px; }
.pf-tab:first-child { border-bottom-color: var(--ink) !important; }
.pf-tab span { color: var(--ink-faint) !important; }
.pfa-chip, .pfa-hot { flex-direction: row !important; gap: 5px !important; min-width: 0 !important; padding: 7px 12px !important; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
.pfa-chip strong { font-weight: 600 !important; }
.pfa-chip span { display: none !important; }
.pfa-row { gap: 0 !important; }
.pf-faq-item { border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; margin: 0 !important; background: transparent !important; }
.pf-faq-section .group-title + .pf-faq-item { border-top: 1px solid var(--ink) !important; }
.guide-cta-list { gap: 0 !important; border-top: 1px solid var(--ink) !important; }
.guide-cta-row { border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; margin: 0 !important; }

/* ===== 2026-09-29 PC 다듬기 — 디자인 시스템 맞춤 ===== */
/* 1. 제목: h2 22px·700, 개수는 13px 회색 baseline */
.tb-heading, .group-title { font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; margin: 0 0 12px !important; align-items: baseline !important; }
.group-count { padding: 0 !important; }
.today-best { padding-top: 34px !important; margin-bottom: 32px !important; }
.group-section, .pf-faq-section { padding-top: 7px !important; padding-bottom: 0 !important; margin-bottom: 28px !important; }
.pf-intro + .group-section { padding-top: 34px !important; }

/* 오늘의 최고가 거래소 — 열 순서 고정: 상품권 · 유형 · 거래소 · 구분 · 시세(오른쪽 끝) */

/* 2·4. 거래소 표 — 흰 상자 걷고, 머리글 위 1px 검정 · 아래 1px 회색 */

/* 7. 유형 탭 — 밑줄 탭, 선 길이를 본문 폭에 맞춤 */
.pf-tabs { margin: 0 20px !important; padding: 0 !important; }
.pf-tab strong { font-size: 15px !important; font-weight: 500 !important; color: var(--ink-soft) !important; }
.pf-tab:first-child strong { font-weight: 700 !important; color: var(--ink) !important; }
.pf-tab span { font-size: 13px !important; font-weight: 500 !important; }
.pf-tab:hover { background: var(--surface-2) !important; }

/* 6. 지역 칩 줄 — 상자 없는 글자 줄, 14px·500, 간격 20px */
.pf-area-rail { padding: 14px 20px 2px !important; align-items: center !important; gap: 16px !important; }
.pfa-lbl { font-size: 13px !important; font-weight: 500 !important; color: var(--ink-faint) !important; }
.pfa-row { gap: 20px !important; align-items: center !important; }
.pfa-chip, .pfa-hot { padding: 6px 0 !important; align-items: baseline !important; }
.pfa-chip strong { font-size: 14px !important; font-weight: 500 !important; color: var(--ink) !important; }
.pfa-chip em { font-size: 13px !important; font-weight: 500 !important; color: var(--ink-faint) !important; }
.pfa-chip:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.pf-search-wrap { padding-top: 14px !important; }

/* 2. 목록(가이드·FAQ) 맨 윗선은 1px 회색, 행 사이 연한 선 */
.guide-cta-list { border-top: 1px solid var(--line) !important; }
.guide-cta-row { padding-left: 6px !important; padding-right: 6px !important; }
.guide-cta-row:hover { background: var(--surface-2) !important; }
.pf-faq-section .group-title + .pf-faq-item { border-top: 1px solid var(--line) !important; }
.pf-faq-item { border-bottom: 1px solid var(--line-soft) !important; }
.pf-faq-item summary { padding-left: 6px !important; padding-right: 6px !important; }
.guide-cta-row .gc-title { font-size: 16px !important; margin-bottom: 2px !important; line-height: 1.4 !important; }
.guide-cta-row .gc-sub { font-size: 13px !important; }
.pf-faq-q { font-size: 16px !important; font-weight: 600 !important; align-items: center !important; }

/* 2026-09-29 GS "남긴 주요 카드는 원래 모양 그대로" — 오늘의 최고가 거래소(.tb-grid)·유형별 거래소 목록 3개(.pf-head·.pf-grid)를 겨냥한 규칙은 모두 지웠습니다(원래 카드로 복귀). */

/* 2026-09-29 GS "거래소 메인 오늘의 최고가 거래소는 변경했던 버젼으로" — v4 한 줄 표(크림 카드·옅은 그림자)로 되돌림. 유형별 목록 3개는 원래 모양 유지 */
.tb-grid { display: flex !important; flex-direction: column !important; gap: 0 !important; overflow: visible !important; border-top: 1px solid var(--ink) !important; -webkit-mask-image: none !important; mask-image: none !important; }
.tb-card { flex-direction: row !important; align-items: center !important; gap: 0 !important; padding: 11px 6px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; }
.tb-card:hover { background: var(--surface-2) !important; transform: none !important; }
.tb-card .tb-brand { order: 1; flex: 0 0 150px; font-size: 14px !important; font-weight: 700 !important; color: var(--ink) !important; }
.tb-card .tb-cat { order: 2; flex: 0 0 110px; align-self: center !important; background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; font-weight: 500 !important; color: var(--ink-faint) !important; font-size: 13px !important; }
.tb-card .tb-who { order: 3; flex: 1 1 auto; align-items: center !important; }
.tb-card .tb-name { font-weight: 500 !important; font-size: 14px !important; }
.tb-card .tb-sup { order: 4; flex: 0 0 80px; text-align: right; font-weight: 500 !important; }
.tb-card { padding: 13px 6px !important; }
.tb-card .tb-brand { flex: 0 0 160px !important; font-weight: 600 !important; }
.tb-card .tb-cat { flex: 0 0 120px !important; }
.tb-card .tb-who { gap: 8px !important; }
.tb-card .tb-sup { order: 4; flex: 0 0 90px !important; font-size: 12px !important; color: var(--ink-faint) !important; }
.tb-card .tb-rate { order: 5; flex: 0 0 96px; text-align: right; margin: 0 !important; font-size: 20px !important; font-weight: 700 !important; line-height: 1.2 !important; }
.tb-grid { padding-bottom: 0 !important; }
.tb-grid { background: var(--cream) !important; border: 1px solid var(--line) !important; border-radius: 16px !important; padding: 4px 16px !important; }
.tb-card:last-child { border-bottom: 0 !important; }
.tb-grid { box-shadow: rgba(20, 24, 33, 0.04) 0px 1px 2px 0px, rgba(20, 24, 33, 0.18) 0px 10px 30px -14px !important; }