@charset "utf-8";

/* ================= 먹튀의민족 · 레벨 정보 ================= */
.lv{
  --l-ink:#171717; --l-ink-2:#747474; --l-ink-3:#8f8f8f;
  --l-line:#e5e5e3; --l-line-2:#dadde0; --l-row:#ebedee;
  --l-soft:#fafaf9; --l-soft-2:#f5f5f4;
  --l-mint:#20bdb8; --l-mint-deep:#159f9a; --l-mint-pale:#eaf8f7;
  max-width:900px;margin:0 auto 48px;color:var(--l-ink);
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic','Noto Sans KR',system-ui,sans-serif;
}

.lv-head{padding-bottom:16px;border-bottom:2px solid var(--l-ink);margin-bottom:20px;}
.lv-head h1{font-size:26px;font-weight:700;letter-spacing:-.04em;line-height:1.3;}
.lv-head p{margin-top:8px;font-size:14px;line-height:1.7;color:var(--l-ink-2);}

/* 내 레벨 */
.lv-me{
  border:1px solid var(--l-line);border-top:3px solid var(--l-mint);border-radius:10px;
  background:#fff;padding:20px 22px;margin-bottom:32px;
}
.lv-me-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.lv-me .who{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--l-ink-2);}
.lv-me .who b{font-weight:700;color:var(--l-ink);}
.lv-me .now{font-size:14px;font-weight:600;color:var(--l-ink-3);}
.lv-me .now b{font-size:26px;font-weight:800;color:var(--l-mint-deep);letter-spacing:-.03em;margin-left:2px;}

.lv-bar{height:8px;margin:14px 0 0;background:var(--l-soft-2);border:1px solid var(--l-line);border-radius:999px;overflow:hidden;}
.lv-bar span{display:block;height:100%;background:var(--l-mint);transition:width .4s ease;}

.lv-me-info{display:flex;gap:0;list-style:none;margin-top:16px;padding-top:14px;border-top:1px solid var(--l-line);flex-wrap:wrap;}
.lv-me-info li{display:flex;align-items:baseline;gap:8px;padding:0 20px;border-left:1px solid var(--l-line);font-size:13px;color:var(--l-ink-3);}
.lv-me-info li:first-child{padding-left:0;border-left:none;}
.lv-me-info .k{font-weight:600;color:var(--l-ink-2);}
.lv-me-info b{font-size:17px;font-weight:800;color:var(--l-ink);letter-spacing:-.03em;}
.lv-me-info li.max b{font-size:14px;color:var(--l-mint-deep);}

.lv-me.guest{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.lv-me.guest p{font-size:13.5px;color:var(--l-ink-2);}
.lv-btn{
  display:inline-flex;align-items:center;height:38px;padding:0 18px;border-radius:8px;
  background:var(--l-mint-deep);color:#fff;font-size:13.5px;font-weight:700;
}
.lv-btn:hover{background:#159f9a;color:#fff;}

/* 섹션 */
.lv-sec{margin-bottom:32px;}
.lv-sec h2{font-size:18px;font-weight:700;letter-spacing:-.035em;margin-bottom:12px;}

.lv-earn{list-style:none;border:1px solid var(--l-line);border-radius:10px;overflow:hidden;background:#fff;}
.lv-earn li{display:flex;align-items:baseline;gap:10px;padding:13px 16px;border-bottom:1px solid var(--l-row);flex-wrap:wrap;}
.lv-earn li:last-child{border-bottom:none;}
.lv-earn .k{flex:0 0 90px;font-size:13.5px;font-weight:600;color:var(--l-ink);}
.lv-earn b{font-size:15px;font-weight:800;color:var(--l-mint-deep);letter-spacing:-.02em;}
.lv-earn em{font-style:normal;font-size:12.5px;color:var(--l-ink-3);}
.lv-note{margin-top:10px;font-size:12.5px;line-height:1.7;color:var(--l-ink-3);}


/* 안내 */
.lv-guide{list-style:none;border:1px solid var(--l-line);border-radius:10px;background:var(--l-soft);padding:16px 18px;}
.lv-guide li{position:relative;padding-left:12px;font-size:13px;line-height:1.85;color:var(--l-ink-2);}
.lv-guide li::before{content:"";position:absolute;left:0;top:11px;width:3px;height:3px;border-radius:50%;background:var(--l-ink-3);}
.lv-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;font-size:13.5px;}
.lv-links a{font-weight:700;color:var(--l-mint-deep);}
.lv-links a:hover{text-decoration:underline;}

/* 다크모드 */
:root[data-theme="dark"] .lv{
  --l-ink:#e8e8e8; --l-ink-2:#a5a5a5; --l-ink-3:#7c7c7c;
  --l-line:#2f2f2f; --l-line-2:#3a3a3a; --l-row:#282828;
  --l-soft:#1f1f1f; --l-soft-2:#252525; --l-mint-pale:#15302f;
}
:root[data-theme="dark"] .lv-me,
:root[data-theme="dark"] .lv-earn,
:root[data-theme="dark"] .lv-tblwrap{background:#1b1b1b;}
:root[data-theme="dark"] .tier.honor{background:#20bdb8;color:#0f0f0f;border-color:#20bdb8;}

/* 반응형 */
@media (max-width:640px){
  .lv-head h1{font-size:22px;}
  .lv-me-info li{padding:0 14px;}
  .lv-tbl .td-up,.lv-tbl thead th.h-up{display:none;}
  .lv-tbl col.c-tier{width:80px;}
  .lv-earn .k{flex-basis:100%;}
}

/* ── 게시판별 포인트 ─────────────────────────────────── */
.lv-boardpt{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);}
.lv-boardpt h3{font-size:13px;font-weight:700;color:var(--ink-2);margin-bottom:10px;}
.lv-boardpt ul{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;
  list-style:none;margin:0;padding:0;
}
.lv-boardpt li{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 12px;border:1px solid var(--line);border-radius:7px;background:var(--card);
  font-size:13px;
}
.lv-boardpt li span{color:var(--ink-2);}
.lv-boardpt li b{color:var(--mint-deep);font-weight:700;font-variant-numeric:tabular-nums;}

@media (max-width:640px){
  .lv-boardpt ul{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* ============================================================
   군 계급표 (rk-board)
   ------------------------------------------------------------
   사이트는 화이트 베이스지만 계급표만은 의도적으로 다크 패널이다.
   훈장/명패 같은 무게를 주기 위한 것이며, 라이트·다크 모드에서
   동일하게 보이도록 이 블록은 테마 토큰을 쓰지 않고 고정색을 쓴다.
   ============================================================ */
.rk-board{
  border-radius:12px; overflow:hidden;
  background:linear-gradient(180deg,#0b0d0c 0%,#111413 55%,#0b0d0c 100%);
  border:1px solid #24302c;
  box-shadow:0 6px 26px rgba(0,0,0,.18);
}

/* ── 머리말 ─────────────────────────────────────────── */
.rk-bh{
  display:flex; align-items:center; justify-content:center; gap:18px;
  padding:26px 20px 20px; text-align:center;
}
.rk-bh .tt{min-width:0;}
.rk-bh h2{
  font-size:26px; font-weight:800; letter-spacing:-.035em; line-height:1.25;
  color:#f4f7f6; margin:0;
}
.rk-bh h2 .b{color:#3fd3ce;}
.rk-bh p{margin-top:8px; font-size:13px; line-height:1.6; color:#9fb0ab;}
.rk-bh .lf{font-size:30px; line-height:1; flex:0 0 auto; filter:saturate(.85);}
.rk-bh .lf.rv{transform:scaleX(-1);}

/* ── 표 ─────────────────────────────────────────────── */
.rk-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
.rk-tbl{
  width:100%; min-width:900px; border-collapse:collapse;
  font-variant-numeric:tabular-nums;
}
.rk-tbl col.c-g{width:96px;}
.rk-tbl col.c-r{width:104px;}
.rk-tbl col.c-i{width:148px;}
.rk-tbl col.c-n{width:132px;}
.rk-tbl col.c-c{width:140px;}
.rk-tbl col.c-d{width:auto;}
.rk-tbl col.c-s{width:112px;}

.rk-tbl thead th{
  padding:11px 10px; font-size:12.5px; font-weight:700; letter-spacing:-.02em;
  color:#c8d4d0; background:#161b19;
  border-bottom:1px solid #2b3733; border-right:1px solid #232d2a;
  white-space:nowrap;
}
.rk-tbl thead th:last-child{border-right:none;}

.rk-tbl tbody th,
.rk-tbl tbody td{
  padding:12px 10px; font-size:12.5px; line-height:1.5; color:#d6dedb;
  border-bottom:1px solid #1e2624; border-right:1px solid #1a221f;
  text-align:center; vertical-align:middle;
}
.rk-tbl tbody td:last-child{border-right:none;}

/* 구분(그룹) 셀 : 세로로 병합된 라벨 */
.rk-tbl .td-g{
  background:#121716; border-right:1px solid #2b3733;
  font-size:13px; color:#e6edea;
}
.rk-tbl .td-g b{display:block; font-weight:800; letter-spacing:-.02em;}
.rk-tbl .td-g span{display:block; margin-top:3px; font-size:11px; font-weight:600; color:#8fa39e;}

/* 계급 이름 */
.rk-tbl .td-r{text-align:left; padding-left:16px; white-space:nowrap;}
.rk-tbl .td-r .no{color:#7f918c; font-weight:600; margin-right:2px;}
.rk-tbl .td-r b{font-size:13.5px; font-weight:700; color:#f1f5f4; letter-spacing:-.02em;}
.rk-tbl .td-r em{
  display:inline-block; margin-left:6px; padding:1px 6px; border-radius:4px;
  background:#20bdb8; color:#06201f; font-style:normal; font-size:10.5px; font-weight:800;
}

/* 계급장 */
.rk-tbl .td-i{padding:8px 10px;}
.rk-tbl .td-i .rkb-svg{display:inline-block; height:26px; width:auto;}
.rk-tbl .td-i .rkb-emo{display:inline-block; width:24px; height:24px;}

/* 숫자 */
.rk-tbl .td-n,
.rk-tbl .td-c{font-size:13px; font-weight:700; color:#eef3f1; white-space:nowrap;}
.rk-tbl .td-n{color:#b9c6c2; font-weight:600;}

/* 설명 */
.rk-tbl .td-d{text-align:left; color:#a9b8b4; font-size:12.5px;}

/* 그룹별 은은한 색 구분 (장군으로 갈수록 금빛) */
.rk-tbl tr.g-janggun   td, .rk-tbl tr.g-janggun   th{background:rgba(197,150,42,.055);}
.rk-tbl tr.g-yeonggwan td, .rk-tbl tr.g-yeonggwan th{background:rgba(160,175,190,.045);}
.rk-tbl tr.g-wigwan    td, .rk-tbl tr.g-wigwan    th{background:rgba(160,175,190,.03);}
.rk-tbl tr.g-junwi     td, .rk-tbl tr.g-junwi     th{background:rgba(190,170,110,.045);}
.rk-tbl tr.g-busagwan  td, .rk-tbl tr.g-busagwan  th{background:rgba(32,189,184,.035);}
.rk-tbl tr.g-byeong    td, .rk-tbl tr.g-byeong    th{background:rgba(32,189,184,.05);}
.rk-tbl tr.g-janggun .td-g{background:#191509;}
.rk-tbl tr:hover td{background:rgba(255,255,255,.035);}

/* 내 계급 행 */
.rk-tbl tr.me td,
.rk-tbl tr.me th{background:rgba(32,189,184,.14);}
.rk-tbl tr.me:hover td{background:rgba(32,189,184,.18);}

/* ── 반짝이 표기 ────────────────────────────────────── */
.rk-sp{display:inline-flex; flex-direction:column; align-items:center; gap:4px;}
.rk-sp > span{font-size:11px; font-weight:600; color:#c9b47a; letter-spacing:-.02em;}
.rk-sp i{
  display:block; width:18px; height:18px; flex:0 0 auto;
  background:#f4d67a;
  clip-path:polygon(50% 0%,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0% 50%,40% 40%);
}
.rk-sp.sp i{filter:drop-shadow(0 0 5px rgba(244,214,122,.6));}
.rk-sp.sp2 i{
  width:22px; height:22px; background:#ffe9a8;
  filter:drop-shadow(0 0 9px rgba(255,222,132,.85));
}
.rk-sp.sp2 > span{color:#ffdf94;}
@media (prefers-reduced-motion:no-preference){
  .rk-sp.sp i {animation:mmRkSpark 2.6s ease-in-out infinite;}
  .rk-sp.sp2 i{animation:mmRkSpark 1.8s ease-in-out infinite;}
}
@keyframes mmRkSpark{
  0%,100%{ transform:scale(.86) rotate(0deg);   opacity:.75; }
  50%    { transform:scale(1.08) rotate(22deg); opacity:1; }
}
.rk-tbl .dash{color:#5e6d69; font-weight:700;}

/* ── 꼬리말 (반짝이 안내) ───────────────────────────── */
.rk-bf{
  padding:18px 20px 22px; border-top:1px solid #232d2a;
  background:#0a0c0b;
}
.rk-bf .lead{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  font-size:12.5px; line-height:1.6; color:#a9b8b4;
}
.rk-bf .lead b{color:#f0f4f3; font-weight:700; letter-spacing:-.02em;}
.rk-bf .lead .tx{flex:1 1 320px; min-width:0;}
.rk-bf .rk-legend{
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
  list-style:none; margin:14px 0 0; padding:0;
}
.rk-bf .rk-legend li{
  display:flex; align-items:center; gap:8px;
  font-size:12px; font-weight:600; color:#b7c4c0;
}
.rk-bf .rk-sp{flex-direction:row;}

/* ── 반응형 ─────────────────────────────────────────── */
@media (max-width:900px){
  .rk-bh{gap:10px; padding:20px 14px 16px;}
  .rk-bh h2{font-size:20px;}
  .rk-bh .lf{font-size:22px;}
  .rk-bh p{font-size:12px;}
  .rk-wrap{border-top:1px solid #232d2a;}
  .rk-bf{padding:16px 14px 18px;}
  .rk-bf .rk-legend{gap:16px;}
}
@media (max-width:640px){
  .rk-bh .lf{display:none;}
}
