/* PC 디자인 정리 (2026-09-29 GS 확정 시안 v5) — 거래소 상세 /platform/[slug]
 * PC(768px 이상)에서만 읽힙니다: Base.astro 가 <link media="(min-width: 768px)"> 로 붙입니다. 모바일에는 영향 없음.
 * 시안을 CSS 덧씌우기로 만든 그대로 옮겨서 !important 가 많습니다(원래 스타일을 이기려고).
 * 방향: 형광펜 제거 · 순위/라벨 칩은 회색 글자 · 장식 목록·FAQ·칩 줄은 구분선으로 평평하게.
 *       페이지마다 주요 카드 1~3개는 원래 모양(웜크림·그림자·1위 강조) 그대로. 시세 숫자 주황·파랑은 유지.
 */
/* ===== /platform/socialticket/ (거래소 상세) PC 목업 — ②③④⑤ (시세 숫자 색은 전부 유지) ===== */

/* ③ 제목 형광펜 없애기 */
.hl-pen { text-decoration: none !important; padding: 0 !important; }

/* ④ 히어로 — 크림 상자 → 상자 없이 아래 구분선만. 유형 알약 → 회색 글자. 92% 숫자·바로가기 버튼은 유지 */

/* ⑤ 신뢰 한 줄 — 회색 상자 → 글자 줄, 초록 체크 → 회색 */
#main-content .trust-strip { background: transparent !important; border-radius: 0 !important; padding: 10px 0 !important; border-bottom: 1px solid var(--line-soft) !important; }
#main-content .ts-item svg { color: var(--ink-faint) !important; }

/* ⑤ 목차 칩 줄 → 상자 없는 글자 줄 */
#main-content .toc-chips { gap: 0 !important; margin-top: 10px !important; }
#main-content .toc-chip { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 4px 14px 4px 0 !important; font-size: 13px !important; color: var(--ink-soft) !important; }
#main-content .toc-chip + .toc-chip { padding-left: 14px !important; border-left: 1px solid var(--line) !important; }

/* ② 메타 줄 주황 링크 → 검정 */
#main-content .rate-meta .rm-more { color: var(--ink) !important; }

/* 소액권 주의 — 회색 상자 → 왼쪽 가는 선만 */
#main-content .note-stack { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; }
#main-content .payment-note { background: transparent !important; border: 0 !important; border-left: 2px solid var(--line) !important; border-radius: 0 !important; padding: 2px 0 2px 12px !important; margin: 6px 20px 14px !important; }

/* ⑤ 매입 시세 일람 — 흰 상자 → 구분선. 1위 줄 주황 바탕 제거, 순위 알약 → 회색 글자 (매입률 주황 숫자 유지) */

/* ⑤ 70일 시세 기록 — 큰 상자·작은 상자 → 구분선 (그래프 선 색 유지) */
#main-content .hist-card { background: transparent !important; border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; padding: 14px 0 14px !important; }
#main-content .hist-stats { gap: 0 !important; }
#main-content .hs-item { background: transparent !important; border-radius: 0 !important; padding: 2px 16px !important; }
#main-content .hs-item + .hs-item { border-left: 1px solid var(--line-soft) !important; }
#main-content .hs-item:first-child { padding-left: 0 !important; }

/* ⑤ 품목별 60일 기록 (2026-10-11 디자인 업그레이드) — 흰 상자 → 구분선. 위 70일 시세 기록(.hist-card)과 같은 틀.
 *    표 머리글은 PC 평평한 표들(calcd.css)과 같이 500 회색, 줄에 손을 올리면 연회색. 오늘 값 주황·파랑은 유지. */
#main-content .ledger-card { background: transparent !important; border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; padding: 2px 0 14px !important; }
#main-content .ledger-table thead th { font-weight: 500 !important; }
#main-content .ledger-table th:first-child, #main-content .ledger-table td:first-child { padding-left: 4px !important; }
#main-content .ledger-table th:last-child, #main-content .ledger-table td:last-child { padding-right: 4px !important; }
#main-content .ledger-table tbody tr:hover :is(th, td) { background: var(--surface-2); }
#main-content .ledger-table tbody tr:last-child :is(th, td) { border-bottom: 1px solid var(--line-soft) !important; }

/* ⑤ 핵심 정보 표 — 흰 상자 → 구분선 */
#main-content .info-table { background: transparent !important; border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; }
#main-content .info-row { border-color: var(--line-soft) !important; padding-left: 4px !important; }

/* ④ 매입 최고가 / 구매 최저가 두 상자 → 상자 없는 두 칸 (방향 제목 주황·파랑 유지) */
#main-content .bsq { margin: 18px 20px 0 !important; padding: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; }
#main-content .bsq-btn { background: transparent !important; box-shadow: none !important; border-radius: 0 !important; padding: 14px 6px 13px !important; }
#main-content .bsq-btn.buy { border-left: 1px solid var(--line-soft) !important; padding-left: 18px !important; }
#main-content .bsq-btn:hover { background: var(--surface-2) !important; }
#main-content .bsq-t::after { content: " →"; color: var(--ink-faint); font-weight: 500; }

/* ⑤ 전체 상품권 시세표 링크 상자 → 한 줄 */
#main-content .es-link.all { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; margin-top: 0 !important; padding: 12px 4px !important; }
#main-content .explore-strip { padding: 0 !important; margin: 0 20px !important; }

/* ⑤ 권종별 계산기 — 선택 상자·펼치기 상자 → 구분선 (현금화 계산 버튼 유지) */
#main-content .calc-pick { background: transparent !important; border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; padding: 12px 0 !important; margin-bottom: 0 !important; }
#main-content .calc-expand { border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--line-soft) !important; border-bottom: 1px solid var(--line-soft) !important; margin-top: 0 !important; }
#main-content .calc-expand, #main-content .calc-expand .rate-expand-summary { background: transparent !important; }

/* ⑤ 다른 거래소와 비교 — 큰 흰 상자 제거, 칩 → 상자 없는 글자 줄 */
#main-content .chan-links { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; margin-left: 20px !important; margin-right: 20px !important; }
#main-content .chan-links .section-title, #main-content .chan-lead { margin-left: 0 !important; margin-right: 0 !important; }
#main-content .chan-row { border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; padding: 12px 0 !important; }
#main-content .chan-hub { background: none !important; border-radius: 0 !important; padding: 4px 14px 4px 0 !important; font-size: 13px !important; }
#main-content .chan-gcs { gap: 0 !important; }
#main-content .chan-gcs a, #main-content .chan-fold summary { border: 0 !important; border-radius: 0 !important; padding: 4px 12px !important; font-size: 13px !important; border-left: 1px solid var(--line) !important; color: var(--ink-soft) !important; }

/* ⑤ 장단점 — 회색 상자 2개 → 위 선만 (장점 초록·단점 빨강 제목은 뜻이 있어 유지) */
#main-content .pros-cons { gap: 0 24px !important; }
#main-content .pros-box, #main-content .cons-box { background: transparent !important; border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; padding: 12px 2px !important; }
#main-content .pros-box li, #main-content .cons-box li { font-size: 13px !important; }

/* ⑤ 후기·신뢰성 점검 — 큰 흰 상자·안쪽 카드 → 구분선. 주황 라벨 → 회색 */
#main-content .trust-section { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; }
#main-content .trust-section .section-title { margin-left: 0 !important; margin-right: 0 !important; }
#main-content .trust-grid { gap: 0 24px !important; }
#main-content .trust-card { background: transparent !important; border-radius: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; padding: 12px 2px !important; }
#main-content .trust-label { color: var(--ink-faint) !important; }
#main-content .trust-verify { background: transparent !important; border-radius: 0 !important; border-left: 2px solid var(--line) !important; padding: 2px 0 2px 12px !important; margin-left: 0 !important; }
#main-content .trust-disclaimer { background: transparent !important; border-radius: 0 !important; padding: 0 !important; }

/* ⑤ 비교 요약 카드 → 구분선 */
#main-content .pfact-card { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; border-top: 1px solid var(--line-soft) !important; padding: 14px 2px 12px !important; }
#main-content .pfact-block .pfact-card:first-child { border-top: 1px solid var(--ink) !important; }

/* ⑤ 이용 안내 — 큰 흰 상자 제거, 주황 체크·순번 → 검정 */
#main-content .seo-content { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 18px 0 0 !important; border-top: 1px solid var(--line-soft) !important; }
#main-content .seo-list li::before { color: var(--ink) !important; }

/* ⑤ FAQ 상자 → 구분선 */
#main-content .faq { border-top: 1px solid var(--ink) !important; margin: 0 20px !important; padding: 0 !important; }
#main-content .faq details { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 !important; }
#main-content .faq summary { padding-left: 4px !important; padding-right: 4px !important; }

/* 안전 거래 가이드 — 목록 맨 위 1px 검정 */
#main-content .rl-wrap { border-top: 1px solid var(--ink) !important; }

/* ⑤ 함께 보는 거래소 카드 3장 → 상자 없는 3칸 (95% 숫자 색 유지, 로고 색 유지) */
#main-content .similar-platform-grid { gap: 0 !important; margin: 0 20px !important; padding: 0 !important; border-top: 1px solid var(--ink) !important; border-bottom: 1px solid var(--line-soft) !important; }
#main-content .similar-card { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 16px !important; }
#main-content .similar-card + .similar-card { border-left: 1px solid var(--line-soft) !important; }
#main-content .similar-card:first-child { padding-left: 2px !important; }
#main-content .similar-card:hover { background: var(--surface-2) !important; transform: none !important; }

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

/* ===== 2026-09-29 PC 다듬기 — 디자인 시스템 맞춤 ===== */
/* 1·8. 섹션 제목 22px·700, 위 48px 안팎, 제목~내용 12px */
#main-content .section-title, #main-content .seo-content > h2 { font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; margin-top: 34px !important; margin-bottom: 12px !important; }
#main-content .chan-links { margin-top: 0 !important; padding-top: 1px !important; }
#main-content .chan-links .section-title { margin-top: 23px !important; }
#main-content .seo-content > h2 { margin-top: 0 !important; }
#main-content .seo-content h3, #main-content .trust-h3 { font-size: 16px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; }
#main-content .trust-h3 { border-bottom: 0 !important; padding-bottom: 0 !important; margin-top: 32px !important; }
#main-content .pfact-kicker { font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0 !important; color: var(--ink-faint) !important; }

/* 6. 목차 칩 줄 — 세로선 없이 간격 20px, 14px·500 */
#main-content .toc-chips { gap: 20px !important; margin-top: 12px !important; }
#main-content .toc-chip, #main-content .toc-chip + .toc-chip { padding: 6px 0 !important; border: 0 !important; font-size: 14px !important; font-weight: 500 !important; }
#main-content .toc-chip:hover { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 4px; }

/* 70일 기록 — 그래프 아래 짧은 선 제거 (카드 아랫선과 이중) */
#main-content .hist-verdict { border-top: 0 !important; padding-top: 4px !important; }

/* 2. 목록·요약·계산기의 맨 윗선은 1px 회색 (검정은 데이터 표만: 시세 일람·70일 기록·핵심 정보) */
#main-content .bsq, #main-content .calc-pick, #main-content .chan-row, #main-content .pros-box, #main-content .cons-box,
#main-content .trust-card, #main-content .faq, #main-content .rl-wrap, #main-content .similar-platform-grid { border-top-color: var(--line) !important; }
#main-content .pfact-block .pfact-card:first-child { border-top: 1px solid var(--line) !important; }
#main-content .pfact-block { margin-top: 20px !important; }

/* 6. 다른 거래소와 비교 — 칩 세로선 걷고 간격 20px */
#main-content .chan-row { align-items: baseline !important; gap: 6px 24px !important; }
#main-content .chan-hub { padding: 4px 0 !important; font-size: 14px !important; font-weight: 700 !important; }
#main-content .chan-gcs { gap: 4px 20px !important; }
#main-content .chan-gcs a, #main-content .chan-fold summary { border-left: 0 !important; padding: 4px 0 !important; font-size: 14px !important; font-weight: 500 !important; }
#main-content .chan-gcs a:hover { color: var(--ink) !important; text-decoration: underline; text-underline-offset: 4px; }

/* 이용 안내 — 위 가는 선 없이 섹션 여백으로 구분 */
#main-content .seo-content { border-top: 0 !important; padding-top: 0 !important; margin-top: 36px !important; }

/* FAQ 질문 16px·600, 좌우 6px */
#main-content .faq summary { font-size: 16px !important; padding-left: 6px !important; padding-right: 6px !important; }

/* 2026-09-29 GS "남긴 주요 카드는 원래 모양 그대로" — 히어로(.platform-hero)·매입 시세 일람(.rate-table)을 겨냥한 규칙은 모두 지웠습니다(원래 카드로 복귀). */

/* ===== 2026-09-29 GS "시세 순위·주요 카드는 웜크림 카드 유지" (70일 기록·핵심 정보·두 칸 — 아래 블록에서 다시 평평하게) ===== */
#main-content .hist-card, #main-content .info-table, #main-content .bsq {
  background: var(--cream) !important; border: 1px solid var(--line) !important; border-radius: 16px !important; box-shadow: none !important; padding: 4px 16px !important; overflow: hidden !important; }
/* 카드 안 마지막 행 아랫선 없음 */
#main-content .info-table > .info-row:nth-last-child(-n+2) { border-bottom: 0 !important; }
/* 70일 기록 — 그래프·요약이 카드 안에서 숨 쉬게 */
#main-content .hist-card { padding: 16px 16px 8px !important; }
/* 두 칸 카드 — 가운데 세로선만 남김 */
#main-content .bsq { padding: 0 !important; }
#main-content .bsq-btn { padding: 16px 20px 15px !important; }
#main-content .bsq-btn.buy { padding-left: 20px !important; }
#main-content .explore-strip { margin-top: 12px !important; }

/* ===== 2026-09-29 GS "주요 카드 1~3개만 웜크림" — pfd 는 히어로 + 매입 시세 일람만 카드. 70일 기록·핵심 정보·매입최고/구매최저 두 칸은 다시 평평하게 ===== */
#main-content .hist-card, #main-content .info-table, #main-content .bsq {
  background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line-soft) !important; }
#main-content .hist-card { padding: 14px 0 !important; overflow: visible !important; }
#main-content .info-table { padding: 0 !important; }
#main-content .bsq { padding: 0 !important; overflow: visible !important; }
#main-content .bsq-btn { padding: 14px 6px 13px !important; }
#main-content .bsq-btn.buy { padding-left: 18px !important; }
#main-content .explore-strip { margin-top: 0 !important; }
