/* ==========================================================
   pages/rank.css — 지역 랭킹 전용
   ========================================================== */

.rk-filter { justify-content: space-between; }
.rk-filter .grow { overflow: hidden; }
.rk-right { flex-wrap: wrap; }
.rk-notice:not(:empty) { display: grid; gap: 8px; margin-top: 14px; }
.rk-layout { display: grid; gap: 16px; margin-top: 16px; }
.rk-main { padding: 16px 10px; min-width: 0; }
.rk-main .card-head { padding: 0 8px; }

/* 표 보기 */
.rk-table th:first-child, .rk-table td:first-child { width: 48px; }
.rk-td-rank { color: var(--ink-3); font-weight: 800; text-align: center !important; }
.rk-table td.is-key { background: rgba(238, 241, 248, .55); }
.rk-table td.is-key .ix { font-weight: 900; }
.rk-star { display: inline-block; width: 13px; height: 13px; margin-left: 4px; vertical-align: -1px; color: #F5A800; }
.rk-main .tbl-note { padding: 0 8px; }
.rk-main .tbl-wrap { padding: 0 6px; }

/* 옆 */
.rk-about-head { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; }
.rk-about-head b { display: block; font-size: 16.5px; font-weight: 800; letter-spacing: -.03em; }
.rk-about-head span { display: block; font-size: 12.5px; color: var(--ink-3); }
.rk-dl { margin: 12px 0 14px; }
.rk-dl > div { display: flex; justify-content: space-between; gap: 10px; min-height: 36px; align-items: center; border-bottom: 1px solid var(--line-2); font-size: 13.5px; }
.rk-dl dt { color: var(--ink-3); font-weight: 600; }
.rk-dl dd { margin: 0; font-weight: 800; text-align: right; }
.rk-fav-empty { font-size: 13.5px; color: var(--ink-3); line-height: 1.7; }
.rk-fav-empty .ico { display: inline-block; vertical-align: -3px; color: var(--ink-4); }
.rk-fav-list { display: grid; gap: 4px; }
.rk-fav-list a { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2); }
.rk-fav-list a:hover { background: #EDF0F5; }
.rk-fav-list b { font-size: 15px; font-weight: 800; }
.rk-fav-list span { font-size: 15px; font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.rk-fav-list em { grid-column: 1 / 3; font-style: normal; font-size: 12.5px; color: var(--ink-3); }

@media (max-width: 767px) {
  .rk-filter { position: static; }
  .rk-right { width: 100%; justify-content: space-between; }
  #rkView span { display: none; }
}
@media (min-width: 960px) {
  .rk-layout { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; }
}
