@charset "UTF-8";
/* ============================================================
   파일쿠키 리뉴얼 — 디자인 토큰
   출처: 디자인팀 핸드오프 README (2026-07-24) — 값 임의 변경 금지
   로컬 전용 (wwwroot/renewal/). 실서비스 CSS 와 분리됨
   ============================================================ */

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css');

*{margin:0;padding:0;box-sizing:border-box}

:root{
  --page:#e7e9ee;--bg:#f0f0f0;--card:#ffffff;--card2:#f5f7fb;--ink:#101111;--ink2:#33383f;--sub:#7c8698;--line:#e7e9ed;
  --blue:#0566db;--blue-ink:#0566db;--blue-soft:#eaf1fd;--adult:#f83a5a;--free:#2ea36a;--gold:#f5a623;--catbar:#0566db;--on-bg:#0566db;--on-tx:#fff;--brand:#0566db;
  --chip-bg:#eef0f4;--chip-tx:#5a6472;--chip-line:#e2e5ea;--nav-off:#9aa2ad;
  --thumb:linear-gradient(135deg,#dbe3f0,#c2d0e6);--poster:linear-gradient(160deg,#d7ddf0,#bfc7e2);
  --chrome:#e9ebef;--shadow:0 18px 50px rgba(20,30,50,.16);
  /* 카테고리·팔로잉 화면 추가 토큰 (핸드오프 카테고리/친구관리 파일) */
  --acc:#0566db;--btn:#0566db;--btn-tx:#fff;--cat-tx:rgba(255,255,255,.9);
}

[data-dark="true"]{
  --page:#0f1012;--bg:#1a1b1c;--card:#2d2d2d;--card2:#272829;--ink:#ffffff;--ink2:#e7e9ec;--sub:#9aa2ad;--line:#3a3b3d;
  --blue:#aab4c4;--blue-ink:#c4ccd8;--blue-soft:#1e2b3f;--adult:#e63f5b;--free:#37c07d;--gold:#f5c542;--catbar:#20242c;--on-bg:#e8eaed;--on-tx:#16171a;--brand:#3ea7fd;
  --chip-bg:#3a3b3d;--chip-tx:#cfd4da;--chip-line:#454648;--nav-off:#7d828a;
  --thumb:linear-gradient(135deg,#243447,#161d29);--poster:linear-gradient(160deg,#2a3040,#12161f);
  --chrome:#232427;--shadow:0 18px 55px rgba(0,0,0,.5);
  --acc:#8fa6c6;--btn:#38506e;--btn-tx:#e7edf5;--cat-tx:#cfd4da;
}

body{
  font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;
  -webkit-font-smoothing:antialiased;
  background:var(--bg);
  color:var(--ink);
}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--blue-ink)}
img{border:0}
ul,ol{list-style:none}
button{font-family:inherit;border:0;background:none;cursor:pointer}
input{font-family:inherit}

@keyframes fkpulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes fkroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* 스크롤바 숨김 (핸드오프 원본 규칙) */
.fkr-noscroll::-webkit-scrollbar{width:0;height:0;display:none}
.fkr-noscroll{scrollbar-width:none;-ms-overflow-style:none}

/* ── 공통 배지 ── */
.fkr-b19{background:var(--adult);color:#fff;font-size:8.5px;font-weight:800;border-radius:3px;padding:1px 3px;line-height:1}
.fkr-bn{background:var(--free);color:#fff;font-size:8.5px;font-weight:800;border-radius:3px;padding:1px 3px;line-height:1}

/* ── 로고 K 말풍선 ── */
.fkr-logo{display:flex;align-items:center;gap:7px;font-weight:800;color:var(--ink);flex-shrink:0}
.fkr-logo .k{background:var(--brand);color:#fff;border-radius:50% 50% 50% 5px;display:flex;align-items:center;justify-content:center;font-weight:900}
/* 기존 공식 로고 이미지 (라이트/다크 쌍 — topr.jsp 자산 재사용) */
.fkr-logo-pc img{height:30px;display:block}
.fkr-logo-m img{height:24px;display:block}
.fkr-logo-dk{display:none !important}
html[data-dark=true] .fkr-logo-lt{display:none !important}
html[data-dark=true] .fkr-logo-dk{display:block !important}

/* ── 다크 토글 스위치 ── */
.fkr-dn{position:relative;border-radius:24px;flex-shrink:0;cursor:pointer;transition:background .35s;display:inline-block}
.fkr-dn .knob{position:absolute;top:3px;left:3px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.fkr-dn .ic-moon{display:none}
[data-dark="true"] .fkr-dn .ic-sun{display:none}
[data-dark="true"] .fkr-dn .ic-moon{display:block}

/* [2026-08-13] 판매자 지정 제목색 — tokens_body.css 의 .fkr-body 스코프판과 동일 규칙.
   리뉴얼 페이지(follow·홈 등)는 tokens_body 를 안 실어 여기에도 있어야 색이 산다.
   라이트 --lc / 다크 --dc 를 렌더 시점에 굽지 않고 CSS 로 전환 (리로드 없는 다크 토글 대응) */
.fkr-tc{ --tc: var(--lc); color: var(--tc) !important; }
html[data-dark=true] .fkr-tc{ --tc: var(--dc); }