/* ============================================================
   파일: static/css/public.css
/* public.css — 버전: v0.9.352 (죽은 선택자 제거: provider-grid/card 계열·sec-slot-home·sec-provider-home·side-placeholder·side-list — 사용처 0건 검증, CHANGELOG.md). 이전: v0.9.350 (★회원가입 트러스트 지갑 인증 카드 .wv-*). 이전: v0.9.348(★모바일 보증카드 머리줄·보증칸·입금칸 세로 높이 축소). 이전: v0.9.347 (★모바일 보증배지 안쪽 여백 추가 축소). 이전: v0.9.346 (★모바일 보증카드 제목·보증금 한 줄 복귀 + 배지 압축). 이전: v0.9.345 (★모바일 보증카드 배지 아랫줄 + 그림 폴백 이름표). 이전: v0.9.317 (★레벨 배지 깜빡임 제거·정적 발광만 + 모바일 배지-닉네임 붙이기). 이전: v0.9.315 (★모바일 표 블록화 + 공지 행 정돈 + 닉네임 폭 해제). 이전: v0.9.314 (★모바일 목록 2줄 + 작성일 시간 + 썸네일 메타 한 줄 + 홈 탭 여백 회수). 이전: v0.9.313 (★닉네임 8글자 보장 + 동작줄이기 발광 유지 + 상단 레벨 배지). 이전: v0.9.312 (★레벨 배지 효과 + 작성자 칸 정렬). 버전: v0.9.256  (+ 홈 게시판 탭 카드 ht-*. 이전: v0.9.255 모바일 메뉴 접힘 / v0.9.62 뱃지 본문 이동)
   ============================================================ */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--color-bg,#0a0e0a);
  color:var(--color-text,#e8f5e0);
  font-family:var(--font-body,'Noto Sans KR',sans-serif);
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img,video{max-width:100%;display:block}
h1,h2,h3{font-family:var(--font-display,inherit);margin:0 0 .4em;line-height:1.2}

.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
/* [PRE-PROD §2] 홈 전용 넓은 인텔리전스 캔버스 — 홈(body.page-home)에서만 컨테이너 폭 확대(헤더/본문/푸터 일관).
   다른 공개 페이지(게시판/인증/상점)는 1120px 그대로. 1280/1440 에서 여백을 크게 줄여 넓게 쓰되 모던한 외곽 거터 유지. */
.page-home .wrap{max-width:1360px}
.wrap.narrow{max-width:760px}
.center-block{text-align:center;padding:60px 0}

/* ---------- 버튼 ---------- */
.btn-accent{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a);font-weight:800;
  padding:12px 22px;border-radius:10px;border:0;cursor:pointer;
  box-shadow:0 0 18px color-mix(in srgb, var(--color-accent,#53FC18) 45%, transparent);
  transition:.15s;
}
.btn-accent:hover{background:var(--color-accent-2,#2bd40f)}
.btn-accent.sm{padding:8px 14px;font-size:13px}
.btn-accent.lg{padding:14px 30px;font-size:16px}

/* ---------- 헤더 (2단) ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--color-bg,#0a0e0a);border-bottom:1px solid var(--nx-line-soft)}

/* 상단 유틸바: 로고 + 로그인/회원가입/텔레그램 */
.util-bar{border-bottom:1px solid var(--nx-line-soft)}
.util-inner{display:flex;align-items:center;justify-content:space-between;height:58px;gap:16px}
/* [v0.9.238] 로고 52px(사장님 지정). .util-inner 가 height:58px 고정이라 헤더 높이는 그대로.
   위아래 여백 3px씩 — 58px 바 안에서 사실상 상한이다(더 키우려면 바 높이부터 올려야 한다).
   480x160 썸네일이 156x52 표시를 3.08배 해상도로 덮어 레티나에서도 선명. 이전: v0.9.237 48px, 그전 32px. */
.logo img{height:52px;display:block}
.logo-text{font-family:var(--font-display,inherit);font-weight:900;font-size:22px;
  color:var(--color-accent,#53FC18);text-shadow:0 0 14px color-mix(in srgb,var(--color-accent,#53FC18) 55%,transparent)}
.util-right{display:flex;align-items:center;gap:8px}
.util-link{padding:8px 12px;font-size:14px;font-weight:600;color:var(--color-text);border-radius:8px}
.util-link:hover{color:var(--color-accent,#53FC18)}
.util-join{padding:8px 16px;font-size:14px;font-weight:800;border-radius:8px;
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a)}
.util-join:hover{background:var(--color-accent-2,#2bd40f)}
.util-tg{padding:8px 14px;font-size:13px;font-weight:700;border-radius:8px;
  border:1px solid color-mix(in srgb,var(--color-accent,#53FC18) 45%,transparent);color:var(--color-accent,#53FC18)}
.util-tg:hover{background:var(--nx-fill)}
/* [v0.9.369 CS-25B] 공개 언어 선택기(네이티브 <details> 드롭다운, 무 JS) */
.lang-switch{position:relative;display:inline-flex}
.lang-switch>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;
  padding:7px 10px;font-size:13px;font-weight:700;border-radius:8px;color:var(--color-text);
  border:1px solid var(--nx-line);white-space:nowrap}
.lang-switch>summary::-webkit-details-marker{display:none}
.lang-switch>summary::marker{content:""}
.lang-switch>summary:hover{background:var(--nx-fill)}
.lang-switch .lang-globe{font-size:14px;line-height:1}
.lang-switch .lang-current{font-size:12.5px}
.lang-switch[open]>summary{border-color:color-mix(in srgb,var(--color-accent,#53FC18) 50%,transparent)}
.lang-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:60;min-width:132px;margin:0;padding:6px;
  list-style:none;background:var(--color-surface,#121812);border:1px solid var(--nx-line);
  border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.lang-menu li{margin:0}
.lang-menu a{display:block;padding:8px 12px;font-size:13.5px;font-weight:600;color:var(--color-text);border-radius:7px;white-space:nowrap}
.lang-menu a:hover{background:var(--nx-line-soft);color:var(--color-accent,#53FC18)}
.lang-menu a.on{color:var(--color-accent,#53FC18);background:rgba(83,252,24,.08)}
.nav-toggle{display:none;background:none;border:0;color:var(--color-text);font-size:24px;cursor:pointer}

/* 하단 메뉴바: 넘치면 가로 스크롤(2줄 방지) */
.navbar{background:color-mix(in srgb,var(--color-bg,#0a0e0a) 85%, #000)}
.nav-list{display:flex;flex-wrap:wrap;gap:2px;list-style:none;margin:0;padding:0}
.nav-list::-webkit-scrollbar{height:0}
.nav-list>li{position:relative;flex:0 0 auto}
.nav-list>li>a{display:flex;align-items:center;gap:6px;padding:13px 14px;white-space:nowrap;
  color:var(--color-text);font-weight:600;font-size:14px}
.nav-list>li>a:hover{color:var(--color-accent,#53FC18)}
.nav-list .mi{font-size:15px}
.caret{font-size:11px;opacity:.7}
.drop{position:absolute;top:100%;left:0;min-width:180px;list-style:none;margin:0;padding:6px;
  background:var(--color-bg,#0a0e0a);border:1px solid var(--nx-line);border-radius:0 0 10px 10px;
  opacity:0;visibility:hidden;transform:translateY(6px);transition:.15s;box-shadow:0 12px 30px rgba(0,0,0,.5);z-index:5}
.has-drop:hover .drop{opacity:1;visibility:visible;transform:none}
.has-drop.open-drop .drop{opacity:1;visibility:visible;transform:none}
.drop li a{display:block;padding:9px 12px;border-radius:7px;font-size:13px;color:var(--color-muted,#8a9a82);white-space:nowrap}
.drop li a:hover{color:var(--color-accent,#53FC18);background:var(--nx-fill)}

/* ---------- 히어로 ---------- */
.hero{position:relative;min-height:min(72vh,560px);display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img,.hero-bg video{width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;
  background:linear-gradient(180deg,color-mix(in srgb,var(--color-bg) 40%,transparent),var(--color-bg))}
.hero-inner{position:relative;z-index:1;text-align:center;width:100%;padding:60px 20px}
.hero-title{font-size:clamp(30px,5vw,54px);font-weight:900;color:var(--color-text);letter-spacing:-.02em;
  text-shadow:0 1px 2px color-mix(in srgb,var(--color-bg) 55%,transparent)}
.hero-sub{font-size:clamp(15px,2vw,20px);color:var(--color-text);opacity:.92;max-width:640px;margin:0 auto 26px}
.hero-body{max-width:640px;margin:0 auto 26px}

/* ---------- 섹션 공통 ---------- */
.sec{padding:56px 0}
.sec:nth-child(even){background:var(--nx-fill-soft)}
.sec-title{font-size:clamp(22px,3vw,32px);font-weight:800;text-align:center}
.sec-title::after{content:"";display:block;width:52px;height:3px;margin:12px auto 0;
  background:var(--color-accent,#53FC18);border-radius:3px;box-shadow:0 0 12px var(--color-accent,#53FC18)}
.sec-sub{text-align:center;color:var(--color-muted,#8a9a82);margin:0 auto 30px;max-width:620px}
.sec-img{margin:0 auto 20px;border-radius:14px;border:1px solid var(--nx-line-soft)}
.prose{max-width:760px;margin:0 auto;color:var(--color-text)}
.prose :is(p,ul,ol){margin:0 0 1em}

/* ---------- feature grid ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feature{background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);
  border-radius:14px;padding:18px 14px;text-align:center;transition:.15s}
.feature:hover{border-color:var(--color-accent,#53FC18);transform:translateY(-3px)}
.feature-ico{font-size:30px;margin-bottom:8px}
.feature-ico-img{width:52px;height:52px;object-fit:contain;margin:0 auto 8px;display:block}
.feature h3{font-size:17px}
.feature p{color:var(--color-muted,#8a9a82);font-size:14px;margin:0}

/* ---------- card grid ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.info-card{display:flex;flex-direction:column;gap:4px;padding:20px;border-radius:14px;
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);transition:.15s}
.info-card:hover{border-color:var(--color-accent,#53FC18)}
.card-ico{font-size:26px}
.card-title{font-weight:800;font-size:16px}
.card-text{color:var(--color-muted,#8a9a82);font-size:13px}

/* ---------- banner ---------- */
.sec-banner .banner-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  background:linear-gradient(120deg,color-mix(in srgb,var(--color-accent,#53FC18) 14%,transparent),transparent);
  border:1px solid color-mix(in srgb,var(--color-accent,#53FC18) 30%,transparent);
  border-radius:18px;padding:28px 40px}
.banner-title{font-size:clamp(20px,3vw,28px)}
.banner-sub{color:var(--color-muted,#8a9a82);margin:0}

/* ---------- faq ---------- */
.faq-list{display:flex;flex-direction:column;gap:10px}
.faq-item{background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);border-radius:12px;padding:4px 18px}
.faq-item summary{cursor:pointer;padding:14px 0;font-weight:700;list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::before{content:"＋";color:var(--color-accent,#53FC18);margin-right:10px;font-weight:800}
.faq-item[open] summary::before{content:"－"}
.faq-a{padding:0 0 16px;color:var(--color-muted,#8a9a82)}

/* ---------- 푸터 ---------- */
.site-footer{border-top:1px solid var(--nx-line-soft);padding:40px 0 60px;margin-top:20px;
  color:var(--color-muted,#8a9a82);font-size:13px}
.foot-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.foot-brand{font-family:var(--font-display,inherit);font-weight:900;font-size:18px;color:var(--color-text)}
.foot-age{border:1px solid var(--color-accent,#53FC18);color:var(--color-accent,#53FC18);
  padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700}
.foot-note,.foot-meta,.foot-help,.foot-disc,.foot-copy{margin:6px 0}
.foot-help{color:var(--color-text)}

/* ---------- 반응형 ---------- */
@media (max-width:860px){
  .nav-toggle{display:block}
  .navbar{display:none}
  .navbar.open{display:block}
  /* 메뉴 열림 시: 헤더 고정 해제 → 아래로 드래그하면 메뉴가 스크롤되며 그 아래 콘텐츠 확인 가능 (v0.9.157) */
  body.nav-open .site-header{position:static}
  .nav-list{flex-direction:column;overflow:visible}
  .nav-list>li>a{padding:12px 8px}
  /* [v0.9.255] 모바일: 하위 메뉴는 기본 접힘, 부모를 탭해야 펼쳐진다.
     hover 로는 열지 않는다 — 터치기기에서 :hover 가 눌린 채 남아 계속 펼쳐지는 것을 막는다.
     ※ 아래 두 규칙은 명시도가 같으므로 open-drop 규칙이 반드시 hover 규칙보다 뒤에 와야 한다. */
  .drop{display:none;position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    background:transparent;border:0;margin:0 0 0 12px;padding:0}
  .has-drop:hover > .drop{display:none}
  .has-drop.open-drop > .drop{display:block}
  /* 펼침/접힘을 눈으로 구분할 수 있게 캐럿(▾)을 뒤집는다 */
  .caret{transition:transform .15s}
  .has-drop.open-drop > a .caret{transform:rotate(180deg)}
}

/* ---------- 관리자 미리보기 강조 (v0.2.0) ---------- */
.preview-highlight{
  outline:3px solid #4aa3ff;
  outline-offset:-3px;
  animation:previewFlash 1.4s ease-out;
  scroll-margin-top:70px;
}
@keyframes previewFlash{
  0%{box-shadow:inset 0 0 0 9999px rgba(74,163,255,.28)}
  100%{box-shadow:inset 0 0 0 9999px rgba(74,163,255,0)}
}

/* ---------- 로그인/회원가입 자리표시 도우미 ---------- */
.wrap.narrow{max-width:560px}
.center-block{text-align:center;padding:40px 0}

/* ---------- 메인 팝업 (v0.3.0) ---------- */
.popup-layer{position:fixed;inset:0;z-index:900;pointer-events:none}
.popup{position:fixed;max-width:92vw;background:var(--color-surface,#121812);
  border:1px solid var(--nx-line);border-radius:12px;overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.6);pointer-events:auto}
.popup .popup-title{padding:12px 14px 0;font-weight:800;font-size:15px;color:var(--color-text)}
.popup .popup-body img{width:100%;display:block}
.popup .popup-content{padding:14px;color:var(--color-text);font-size:14px;line-height:1.6}
.popup .popup-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 12px;background:rgba(0,0,0,.35);border-top:1px solid var(--nx-line-soft);font-size:12px}
.popup-today{display:flex;align-items:center;gap:6px;color:var(--color-muted,#8a9a82);cursor:pointer}
.popup-today input{accent-color:var(--color-accent,#53FC18)}
.popup-close{background:none;border:0;color:var(--color-text);cursor:pointer;font-size:13px;font-weight:600}
.popup-close:hover{color:var(--color-accent,#53FC18)}
.popup-more{display:block;padding:10px 14px;text-align:center;font-weight:700;font-size:13px;
  color:var(--color-accent,#53FC18);border-top:1px solid var(--nx-line-soft)}
.popup-more:hover{background:var(--nx-fill)}
/* 배치 위치 */
.popup.pos-center{top:50%;left:50%;transform:translate(-50%,-50%)}
.popup.pos-top-left{top:80px;left:20px}
.popup.pos-top-right{top:80px;right:20px}
.popup.pos-bottom-left{bottom:20px;left:20px}
.popup.pos-bottom-right{bottom:20px;right:20px}
@media (max-width:600px){
  .popup.pos-top-left,.popup.pos-top-right{top:70px;left:50%;right:auto;transform:translateX(-50%)}
  .popup.pos-bottom-left,.popup.pos-bottom-right{bottom:12px;left:50%;right:auto;transform:translateX(-50%)}
}

/* ---------- 회원 로그인/가입 (v0.6.0) ---------- */
.util-user{font-size:13px;font-weight:700;color:var(--color-accent,#53FC18);padding:8px 4px}
.flash-wrap{margin:16px 0 0}
.flash{padding:11px 14px;border-radius:10px;margin-bottom:10px;font-size:14px;border:1px solid transparent}
.flash-success{background:rgba(83,252,24,.10);border-color:rgba(83,252,24,.35);color:var(--color-text)}
.flash-error{background:rgba(255,80,80,.10);border-color:rgba(255,80,80,.4);color:#ffd9d9}
.auth-card{max-width:420px;margin:30px auto;padding:26px;border-radius:16px;
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft)}
.auth-title{font-size:24px;font-weight:900;margin:0 0 18px;text-align:center}
.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--color-muted,#8a9a82)}
.auth-field em{font-style:normal;font-weight:400;opacity:.8}
.auth-input{padding:11px 12px;border-radius:10px;border:1px solid var(--nx-line);
  background:var(--color-bg,#0a0e0a);color:var(--color-text);font-size:15px}
.auth-input:focus{outline:none;border-color:var(--color-accent,#53FC18)}
.auth-btn{margin-top:6px;padding:12px;border:0;border-radius:10px;font-size:15px;font-weight:800;cursor:pointer;
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a)}
.auth-btn:hover{background:var(--color-accent-2,#2bd40f)}
.auth-alt{text-align:center;margin:16px 0 0;font-size:13px;color:var(--color-muted,#8a9a82)}
.auth-alt a{color:var(--color-accent,#53FC18);font-weight:700}

/* ---------- [v0.9.350] 회원가입 지갑 인증 카드 (Trust Wallet 전용) ----------
   가입 폼 위에 놓이는 안내 + 버튼. 사이트 기본색(연두)과 구분되도록 트러스트 지갑 파랑을 쓴다.
   ※ 표시 전용이다 — 가입 폼을 잠그지 않는다(잠금은 캡차만 담당). */
.wv-card{position:relative;margin:0 0 18px;padding:16px;border-radius:14px;overflow:hidden;
  background:linear-gradient(160deg,rgba(51,117,187,.16),rgba(5,0,255,.06) 60%,transparent);
  border:1px solid rgba(72,169,255,.32);
  box-shadow:0 0 22px rgba(5,0,255,.16) inset}
.wv-card::before{content:"";position:absolute;inset:0 0 auto;height:2px;
  background:linear-gradient(90deg,#48A9FF,#0500FF)}
.wv-head{display:flex;align-items:center;gap:10px}
.wv-logo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:11px;background:rgba(5,0,255,.14);border:1px solid rgba(72,169,255,.35)}
.wv-head-txt{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.wv-head-txt strong{font-size:16px;font-weight:900;color:var(--color-text,#e8f5e0)}
.wv-head-txt span{font-size:12px;color:var(--color-muted,#8a9a82)}
.wv-badge{margin-left:auto;flex:0 0 auto;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;
  letter-spacing:.2px;color:#cfe4ff;background:rgba(5,0,255,.28);border:1px solid rgba(72,169,255,.45)}
.wv-notes{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.wv-notes li{position:relative;padding-left:16px;font-size:12.5px;line-height:1.55;
  color:var(--color-muted,#8a9a82)}
.wv-notes li::before{content:"";position:absolute;left:2px;top:8px;width:6px;height:6px;border-radius:50%;
  background:#48A9FF;box-shadow:0 0 8px rgba(72,169,255,.9)}
.wv-notes b{color:var(--color-text,#e8f5e0);font-weight:800}
/* [v0.9.351] 안전한 지갑 연동 안내(0.1 USDT 입금 확인) — 강조 콜아웃 */
.wv-notice{margin:12px 0 0;padding:11px 13px;border-radius:11px;
  background:rgba(83,252,24,.08);border:1px solid rgba(83,252,24,.30)}
.wv-notice strong{display:block;font-size:13px;font-weight:900;color:var(--color-accent,#53FC18);margin-bottom:3px}
.wv-notice span{display:block;font-size:12.5px;line-height:1.55;color:var(--color-text,#e8f5e0)}
.wv-notice b{color:var(--color-accent,#53FC18);font-weight:800}
.wv-btn{width:100%;margin-top:14px;padding:12px;border:0;border-radius:10px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:15px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#3375BB,#0500FF);
  box-shadow:0 6px 18px rgba(5,0,255,.35);transition:.15s}
.wv-btn:hover{filter:brightness(1.12);box-shadow:0 8px 22px rgba(5,0,255,.5)}
.wv-btn:active{transform:translateY(1px)}
.wv-btn-ic{display:flex;align-items:center}
.wv-status{margin:10px 0 0;font-size:12.5px;text-align:center;color:var(--color-muted,#8a9a82)}
.wv-status.is-ok{color:var(--color-accent,#53FC18);font-weight:700}
.wv-status.is-warn{color:#ffcf6b}
.wv-link{display:block;margin-top:8px;text-align:center;font-size:12.5px;font-weight:700;color:#8ec5ff;
  text-decoration:underline}
/* 인증 완료 표시(인증 화면이 결과를 알려줄 때만 적용된다) */
.wv-card.is-verified{border-color:rgba(83,252,24,.45);
  background:linear-gradient(160deg,rgba(83,252,24,.12),transparent 65%)}
.wv-card.is-verified::before{background:linear-gradient(90deg,#53FC18,#2bd40f)}
.wv-card.is-verified .wv-btn{background:linear-gradient(135deg,#2f8f22,#1f6b17);box-shadow:none}
@media (max-width:480px){
  .wv-badge{margin-left:0;margin-top:6px}
  .wv-head{flex-wrap:wrap}
  /* [PRE-PROD §1] 모바일(≤480) 헤더 유틸바 가로 넘침 방지 — 언어 라벨은 아이콘(🌐)만, 링크/간격 축소.
     헤더 height:58px 고정 유지(F75/F151). 링크는 전부 유지(텔레그램은 푸터에도 있음). */
  .util-right{gap:6px}
  .util-right .lang-current{display:none}
  .util-link{padding:8px 8px}
  .util-join{padding:8px 10px}
  .util-tg{padding:8px 9px;font-size:12px}
}

/* ---------- 게시판/게시물 (v0.8.0) ---------- */
.wrap.narrow2{max-width:800px}
/* [v0.9.117] 글쓰기 전용 넓은 카드 — 로그인/가입은 기존 .auth-card(420px) 그대로, 글쓰기만 확대.
   두 클래스 선택자(.auth-card.post-write-card)로 max-width 만 오버라이드(다른 auth 스타일은 재사용). */
.auth-card.post-write-card{max-width:880px}
.post-write-card .auth-input{font-size:15px}
@media (max-width:920px){ .auth-card.post-write-card{max-width:100%} }
/* [v0.9.120] 글쓰기 폼 — 목록 요약 textarea + 현재 썸네일 미리보기 */
.post-write-card .summary-input{min-height:96px;resize:vertical;line-height:1.6;font-family:inherit}
.post-write-card .thumb-current{margin-bottom:8px}
.post-write-card .thumb-current img{max-width:160px;max-height:120px;border-radius:8px;border:1px solid var(--nx-line);display:block}
.post-write-card .thumb-current small{display:block;margin-top:4px;color:var(--color-muted,#8a9a82);font-size:12px}
.board-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.board-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:16px}
.board-card{display:block;padding:18px;border-radius:14px;background:var(--color-surface,#121812);
  border:1px solid var(--nx-line-soft)}
.board-card:hover{border-color:var(--color-accent,#53FC18)}
.board-name{font-weight:800;font-size:17px;color:var(--color-text)}
.board-desc{margin-top:6px;font-size:13px;color:var(--color-muted,#8a9a82)}
.board-point{margin-top:10px;font-size:12px;font-weight:700;color:var(--color-accent,#53FC18)}
.post-list{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--nx-line-soft)}
.post-row{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 4px;border-bottom:1px solid var(--nx-line-soft)}
.post-link{display:flex;align-items:center;gap:8px;min-width:0;color:var(--color-text);font-weight:600}
.post-link:hover .post-title{color:var(--color-accent,#53FC18)}
.post-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pin-badge{flex:0 0 auto;font-size:11px;font-weight:800;padding:2px 7px;border-radius:6px;
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a)}
.post-meta{flex:0 0 auto;font-size:12px;color:var(--color-muted,#8a9a82)}
.board-foot{margin-top:20px}
.board-foot a{color:var(--color-muted,#8a9a82);font-weight:600}
.board-foot a:hover{color:var(--color-accent,#53FC18)}
.post-view{padding:24px 26px;background:var(--nx-fill);border:1px solid var(--nx-line-soft);border-radius:14px}
.post-h{font-size:24px;font-weight:900;margin:0 0 8px}
.post-meta2{font-size:13px;color:var(--color-muted,#8a9a82);padding-bottom:16px;border-bottom:1px solid var(--nx-line-soft)}
/* 글 내용: 서버에서 이스케이프됨 + 줄바꿈 유지(HTML 렌더 안 함) */
.post-content{margin-top:16px;font-size:15px;line-height:1.75;color:var(--color-text);word-break:break-word;min-height:80px}

/* ============================================================
   v0.9.116 게시판 목록 표시 양식 — 카드형(post-cards) / 갤러리형(post-gallery)
   ※ 목록형(list)은 기존 .board-table 그대로. 아래는 card/gallery 전용(신규 클래스).
   ※ 썸네일은 본문 첫 이미지(모델 thumbnail_url) — 없으면 no-image 표시.
   ============================================================ */
/* [v0.9.125] 게시판 상단 소개 영역 — 제목 + 설명(줄바꿈 유지) + 배너 이미지 */
.board-intro{margin:14px 0 4px;padding:16px 18px;border-radius:14px;
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft)}
.board-intro-title{font-size:18px;font-weight:800;color:var(--color-text);margin:0 0 8px}
.board-intro-text{font-size:14px;line-height:1.7;color:rgba(232,245,224,.82);white-space:pre-wrap;word-break:break-word}
.board-intro-banner{display:block;width:100%;height:auto;margin-top:14px;border-radius:10px}
@media (max-width:640px){
  .board-intro{padding:13px 14px}
  .board-intro-title{font-size:16px}
  .board-intro-text{font-size:13px}
}

/* 카드형: 세로 카드 그리드 — 데스크톱 3열 / 모바일 2열. 썸네일 상단 + 제목/요약/메타 하단. [v0.9.121] */
.post-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.post-card{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft)}
.post-card:hover{border-color:var(--color-accent,#53FC18)}
.post-card.is-notice{border-color:color-mix(in srgb,var(--color-accent,#53FC18) 40%,transparent);
  background:color-mix(in srgb,var(--color-accent,#53FC18) 7%,var(--color-surface,#121812))}
/* [v0.9.262] 권장 업로드 크기를 700x400 으로 바꿨으므로 게시판 페이지 카드도 7:4 로 맞춘다.
   (메인만 바꾸면 같은 이미지가 게시판에서 위아래 여백이 생겨 어긋난다) */
.pc-thumb{width:100%;aspect-ratio:7/4;overflow:hidden;
  background:rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;
  border-bottom:1px solid var(--nx-line-soft)}
.pc-thumb img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.pc-noimg{font-size:12px;color:var(--color-muted,#8a9a82)}
.pc-body{min-width:0;display:flex;flex-direction:column;gap:6px;padding:12px 13px}
.pc-title{font-weight:800;font-size:15px;color:var(--color-text);display:flex;align-items:center;gap:6px;min-width:0}
.pc-title-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.post-card:hover .pc-title{color:var(--color-accent,#53FC18)}
.pc-excerpt{font-size:13px;color:rgba(232,245,224,.86);line-height:1.65;
  white-space:pre-wrap;max-height:8.25em;overflow:hidden}
/* [v0.9.314] ★썸네일 메타를 한 줄로 고정한다(사장님 지적: 기종에 따라 두 줄로 꺾임).
   실측(12px): 배지39 + 닉5글자 246 = 285px · 닉8글자 = 318px vs 카드 안쪽 약 320px
   → 320px 기기에서는 5글자도 꺾였다. 닉네임만 줄어들게 하고 나머지는 고정한다. */
.pc-meta{font-size:12px;color:var(--color-muted,#8a9a82);padding-top:2px;border-top:1px solid var(--nx-line-soft);margin-top:2px;
  display:flex;align-items:center;gap:6px;min-width:0}
.pc-meta .pcm-who{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-meta .pcm-date,.pc-meta .pcm-view,.pc-meta .pcm-rec{flex:0 0 auto;white-space:nowrap}
.pc-meta .pcm-d-short,.pt-meta .ptm-d-short{display:none}

/* 갤러리형: 정사각 썸네일 그리드 (반응형 자동 열) */
.post-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:16px}
.post-tile{display:block;border-radius:14px;overflow:hidden;
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft)}
.post-tile:hover{border-color:var(--color-accent,#53FC18)}
.pt-thumb{position:relative;aspect-ratio:1/1;background:var(--nx-fill);
  display:flex;align-items:center;justify-content:center}
.pt-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pt-noimg{font-size:12px;color:var(--color-muted,#8a9a82)}
.pt-pin{position:absolute;top:8px;left:8px;font-size:11px;font-weight:800;padding:2px 7px;
  border-radius:6px;background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a)}
.pt-title{padding:10px 12px 2px;font-weight:700;font-size:14px;color:var(--color-text);
  display:flex;align-items:center;gap:6px;min-width:0}
.pt-title-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.post-tile:hover .pt-title{color:var(--color-accent,#53FC18)}
.pt-excerpt{padding:2px 12px;font-size:12px;color:rgba(232,245,224,.82);line-height:1.55;
  white-space:pre-wrap;word-break:break-word;max-height:6.2em;overflow:hidden}
.pt-meta{padding:2px 12px 12px;font-size:12px;color:var(--color-muted,#8a9a82);
  display:flex;align-items:center;gap:6px;flex-wrap:nowrap;min-width:0}
.pt-meta > span{flex:0 0 auto;white-space:nowrap}

/* 카드/갤러리 공통 빈 상태 */
.list-empty{padding:40px 16px;text-align:center;color:var(--color-muted,#8a9a82);
  background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);border-radius:14px;margin-top:16px}

/* 모바일: 카드 2열 / 갤러리 열폭 축소 [v0.9.121] */
@media (max-width:640px){
  .post-cards{grid-template-columns:repeat(2,1fr);gap:10px}
  .pc-body{padding:10px;gap:4px}
  .pc-title{font-size:14px}
  .post-gallery{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
  .pc-meta .pcm-d-full,.pt-meta .ptm-d-full{display:none}
  .pc-meta .pcm-d-short,.pt-meta .ptm-d-short{display:inline}
  .pc-meta .lv-badge{min-width:28px;padding:1px 5px;font-size:11px}
}

/* ============================================================
   v0.8.2 무료슬롯 로비 + 플레이
   ============================================================ */
.slots-page{padding:28px 0 60px}
.slots-head{margin-bottom:16px}
.slots-head h1{font-size:26px}
.slots-sub{color:var(--color-muted,#8a9a82);margin:4px 0 0}

/* 게임사 필터 칩 */
.slot-filter{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 22px}
.chip{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;
  border:1px solid var(--nx-line);color:var(--color-muted,#8a9a82);font-size:13px;font-weight:600}
.chip:hover{color:var(--color-text,#e8f5e0);border-color:var(--nx-line-strong)}
.chip.on{background:color-mix(in srgb,var(--color-accent,#53FC18) 16%,transparent);
  border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}

/* 게임 그리드 */
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.slot-card{display:block;background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);
  border-radius:14px;overflow:hidden;transition:.15s}
.slot-card:hover{border-color:var(--color-accent,#53FC18);transform:translateY(-2px)}
.slot-thumb{position:relative;background:var(--nx-surface-2);overflow:hidden}
.slot-thumb img{width:100%;height:auto;display:block}
.slot-thumb-ph{width:100%;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#161d16,#0d120d);color:var(--color-muted,#8a9a82);font-weight:800;
  text-align:center;padding:10px;font-size:14px}
.slot-play{position:absolute;left:0;right:0;bottom:0;padding:8px;text-align:center;font-size:13px;font-weight:800;
  color:var(--nx-on-accent,#04120a);background:var(--color-accent,#53FC18);opacity:0;transform:translateY(100%);transition:.15s}
.slot-card:hover .slot-play{opacity:1;transform:translateY(0)}
.slot-meta{padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.slot-prov{font-size:11px;color:var(--color-muted,#8a9a82)}
.slot-name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slots-empty{color:var(--color-muted,#8a9a82);padding:40px 0}

/* 플레이 페이지 */
.play-page{padding:20px 0 50px}
.play-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.play-prov{display:block;font-size:12px;color:var(--color-muted,#8a9a82)}
.play-name{font-size:22px;margin:0}
.play-frame-wrap{width:100%;background:#000;border:1px solid var(--nx-line);border-radius:12px;overflow:hidden}
.play-frame{display:block;width:100%;height:78vh;min-height:420px;border:0}
.play-note{color:var(--color-muted,#8a9a82);font-size:12px;margin-top:10px}
.play-unavailable{background:var(--color-surface,#121812);border:1px solid var(--nx-line);
  border-radius:12px;padding:40px 20px;text-align:center}
.play-unavailable .muted{color:var(--color-muted,#8a9a82);font-size:13px}

@media (max-width:640px){
  .slot-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
  .play-frame{height:64vh}
}

/* v0.8.4 홈 무료슬롯 섹션 (그리드/카드는 위 v0.8.2 스타일 재사용) */
.slot-home-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.slot-home-head .sec-title{margin:0}

/* v0.8.6 무료슬롯 게임명 검색창 */
.slot-search{display:flex;align-items:center;gap:10px;margin:0 0 18px}
.slot-search input{flex:0 1 360px;max-width:100%;padding:10px 14px;border-radius:10px;
  border:1px solid var(--nx-line-strong);background:var(--color-surface,#121812);
  color:var(--color-text,#e8f5e0);font-size:14px;font-family:inherit;outline:none}
.slot-search input:focus{border-color:var(--color-accent,#53FC18)}
.slot-search input::placeholder{color:var(--color-muted,#8a9a82)}
.slot-search-count{color:var(--color-muted,#8a9a82);font-size:13px;white-space:nowrap}

/* v0.9.29 무료슬롯 검색 버튼/초기화 + 페이지네이션 (신규 추가, 기존 규칙 무변경) */
.slot-search-btn{padding:10px 16px;border-radius:10px;border:1px solid var(--color-accent,#53FC18);
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08120a);font-size:14px;font-weight:700;
  font-family:inherit;cursor:pointer;white-space:nowrap}
.slot-search-btn:hover{filter:brightness(1.08)}
.slot-search-clear{color:var(--color-muted,#8a9a82);font-size:13px;text-decoration:none;white-space:nowrap}
.slot-search-clear:hover{color:var(--color-text,#e8f5e0)}
.slot-pager{display:flex;align-items:center;justify-content:center;gap:16px;margin:26px 0 8px;flex-wrap:wrap}
.slot-pager .pager-btn{padding:9px 18px;border-radius:10px;border:1px solid var(--nx-line-strong);
  background:var(--color-surface,#121812);color:var(--color-text,#e8f5e0);font-size:14px;
  text-decoration:none;white-space:nowrap}
.slot-pager a.pager-btn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.slot-pager .pager-btn.disabled{opacity:.4;pointer-events:none}
.slot-pager .pager-info{color:var(--color-muted,#8a9a82);font-size:14px;white-space:nowrap}

/* [v0.9.109] 게시판 번호식 페이저 — 현재±2 + 첫/끝 + … 생략. 슬롯 페이저와 시각 언어 통일. */
.board-pager{display:flex;align-items:center;justify-content:center;gap:8px;margin:22px 0 8px;flex-wrap:wrap}
.board-pager .pager-btn{padding:8px 14px;border-radius:9px;border:1px solid var(--nx-line-strong);
  background:var(--color-surface,#121812);color:var(--color-text,#e8f5e0);font-size:14px;
  text-decoration:none;white-space:nowrap}
.board-pager a.pager-btn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.board-pager .pager-btn.disabled{opacity:.4;pointer-events:none}
.board-pager .pager-nums{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.board-pager .pager-num{min-width:34px;padding:8px 6px;border-radius:9px;border:1px solid var(--nx-line);
  background:var(--color-surface,#121812);color:var(--color-text,#e8f5e0);font-size:14px;
  text-align:center;text-decoration:none;white-space:nowrap}
.board-pager a.pager-num:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.board-pager .pager-num.is-current{background:var(--color-accent,#53FC18);border-color:var(--color-accent,#53FC18);
  color:var(--nx-on-accent,#0a0f0a);font-weight:700;pointer-events:none}
.board-pager .pager-gap{color:var(--color-muted,#8a9a82);font-size:14px;padding:0 2px;user-select:none}

/* (v0.9.352) 게임사 카드 그리드(.provider-grid/.provider-card 계열, v0.9.3)는 인기게임 슬라이더로 대체되어 사용처 0건 → 제거. 이력: CHANGELOG.md */

/* ============================================================
   P1-a 홈 2컬럼 레이아웃 (v0.9.32) — 홈 전용 스코프. 기존 규칙 무변경.
   좌: 콘텐츠(.home-col-main) / 우: 사이드바(.home-col-side 300px).
   base.html 은 건드리지 않으며 홈에서만 적용됨.
   ============================================================ */
.home-shell{padding:22px 0 40px}
.home-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
/* [R4] 본문 전체폭(1열) — 우측 레일이 차지하던 공간을 본문이 회수한다. 위 300px 리터럴(cs3 근거)은
   보존하고 뒤 규칙이 캐스케이드로 승리한다. 레일(로그인/방문자)은 본문 아래 컴팩트 가로 스트립으로 내려간다.
   방문자 vc-list DOM 순서(사이드바 맨 끝)는 그대로라 F105/F106 위치 핀 유지. 신규 @media 0. */
.home-grid{grid-template-columns:1fr}
.home-col-main{min-width:0}
.home-col-side{display:flex;flex-direction:row;flex-wrap:wrap;gap:16px;position:static;top:auto;margin-top:8px}
.home-col-side > *{flex:1 1 260px}
/* [R5] 홈 최종 UX 정리:
   - 로그아웃 상태의 사이드바 로그인/가입 중복 위젯 숨김(auth 는 헤더 유틸에 있음). 마크업/검사 리터럴은 보존.
   - 방문자 현황을 하단 컴팩트 사이트-스테이터스 스트립(가로)으로. vc-list DOM 순서/3줄은 그대로(F105/F106 유지). */
.home-col-side .side-login:not(:has(.side-wallet)){display:none}
.home-col-side .side-visitor{flex:1 1 100%;padding:10px 16px}
.home-col-side .side-visitor h3{font-size:12px;margin:0 0 6px;justify-content:center}
.home-col-side .side-visitor .vc-list{flex-direction:row;flex-wrap:wrap;gap:22px;justify-content:center}
.home-col-side .side-visitor .vc-row{border-bottom:none;padding-bottom:0;gap:6px}

/* [FINAL CLOSURE §8] 홈 하단 상태 스트립(레일 아님·전체폭·가로) — 사이드 배너 + 방문자 현황. 회원 지갑/액션은 헤더가 담당. 신규 @media 0. */
.home-status{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:18px;padding-top:14px;border-top:1px solid var(--nx-line-soft)}
.home-status .home-status-banners{display:flex;flex-wrap:wrap;gap:10px;flex:1 1 auto;min-width:0}
.home-status .side-banner-item{max-width:320px}
.home-status .side-visitor{flex:1 1 260px;padding:6px 12px}
.home-status .side-visitor h3{font-size:12px;margin:0 0 6px;justify-content:center}
.home-status .side-visitor .vc-list{flex-direction:row;flex-wrap:wrap;gap:22px;justify-content:center}
.home-status .side-visitor .vc-row{border-bottom:none;padding-bottom:0;gap:6px}

/* 홈 컬럼 안에서는 기존 .sec 전체폭 배경/과한 패딩을 컬럼에 맞게 조정(홈 스코프) */
.home-col-main .sec{padding:0 0 var(--sec-gap,26px)}
.home-col-main .sec:nth-child(even){background:none}
.home-col-main .wrap{max-width:none;padding:0}
/* 배너는 .wrap 클래스를 갖지만 내부 여백을 유지해야 함 (위 .home-col-main .wrap{padding:0} 오버라이드, v0.9.50) */
.home-col-main .sec-banner .banner-inner{padding:28px 40px}
/* 배너 정렬(관리자 선택): 기본 좌측(공간분배), center 는 세로 가운데 정렬 */
.sec-banner .banner-inner.align-center{flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px}

/* 사이드바 위젯 공통 */
.side-widget{background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);
  border-radius:14px;padding:16px}
.side-widget h3{font-size:15px;font-weight:800;margin:0 0 12px;color:var(--color-accent,#53FC18)}

/* 로그인 위젯 */
.side-login{display:flex;flex-direction:column;gap:8px}
.side-login-user{font-weight:800;color:var(--color-text,#e8f5e0);margin-bottom:4px}
.side-btn{display:block;text-align:center;padding:10px 12px;border-radius:10px;
  border:1px solid var(--nx-line-strong);background:var(--nx-fill-soft);
  color:var(--color-text,#e8f5e0);font-size:14px;text-decoration:none}
.side-btn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.side-btn-accent{background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08120a);font-weight:800;border-color:var(--color-accent,#53FC18)}
.side-btn-accent:hover{filter:brightness(1.08);color:var(--nx-on-accent,#08120a)}


/* 반응형: 좁은 화면은 1컬럼(사이드바가 콘텐츠 아래로) */
@media (max-width:900px){
  .home-grid{grid-template-columns:1fr}
  .home-col-side{order:2;position:static}
}

/* P1-b 사이드 배너 아이템 (v0.9.33) — 홈 사이드바. 이미지 꽉 차게 표시 */
.side-banner-item{border-radius:14px;overflow:hidden;line-height:0;
  border:1px solid var(--nx-line-soft);background:var(--color-surface,#121812)}
.side-banner-item a{display:block}
.side-banner-item img,.side-banner-item video{width:100%;height:auto;display:block}
.side-banner-text{display:flex;align-items:center;justify-content:center;min-height:80px;
  line-height:1.4;padding:14px;color:var(--color-text,#e8f5e0);font-weight:700;text-align:center}

/* P1-c 사이드바 위젯 (v0.9.34) — 포인트 랭킹 (최신글 위젯 .side-list 계열은 v0.9.267 제거 후 사용처 0건 → v0.9.352 CSS 제거) */
.side-rank{list-style:none;margin:0;padding:0;counter-reset:none;display:flex;flex-direction:column;gap:8px}
.side-rank li{display:flex;align-items:center;gap:10px}
.rank-no{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:6px;background:var(--nx-line-soft);color:var(--color-muted,#8a9a82);
  font-size:12px;font-weight:800;flex-shrink:0}
.rank-no-1{background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08120a)}
.rank-no-2{background:#c9d6cf;color:var(--nx-on-accent,#08120a)}
.rank-no-3{background:#b08d57;color:var(--nx-on-accent,#08120a)}
.rank-name{flex:1;color:var(--color-text,#e8f5e0);font-size:13px;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-pt{color:var(--color-accent,#53FC18);font-size:13px;font-weight:800;white-space:nowrap}
.side-empty{color:var(--color-muted,#8a9a82);font-size:13px;margin:0;text-align:center;padding:8px 0}

/* [v0.9.267] 사이드바 방문자 현황 위젯 (3줄 세로형)
   - 숫자는 tabular-nums 로 자릿수를 고정해 값이 바뀌어도 라인이 흔들리지 않는다.
   - 라벨은 왼쪽, 숫자는 오른쪽 정렬. 모바일에서도 .home-col-side 가 1열로 내려가며 그대로 쓰인다. */
.vc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.vc-row{display:flex;align-items:center;justify-content:space-between;gap:10px;
        padding-bottom:8px;border-bottom:1px solid var(--nx-line-soft)}
.vc-row:last-child{border-bottom:none;padding-bottom:0}
.vc-label{color:var(--color-muted,#8a9a82);font-size:13px;white-space:nowrap}
.vc-num{color:var(--color-text,#e8f5e0);font-size:15px;font-weight:800;
        font-variant-numeric:tabular-nums;white-space:nowrap}
.vc-num.vc-now{color:var(--color-accent,#53FC18)}
/* [v0.9.268] 방문자 현황 제목 아이콘 — 이모지(📊) 대신 이미지.
   글자 크기가 바뀌어도 어긋나지 않게 세로 가운데 정렬하고, 높이는 제목에 맞춰 고정한다. */
.side-visitor h3{display:flex;align-items:center;gap:7px}
.vc-ico{width:27px;height:24px;flex:0 0 auto;object-fit:contain;display:block}

/* ============================================================
   [R3] 홈 우측 레일 정리 (NEXIVON 인텔리전스 허브 정돈) — 홈 전용 스코프.
   - 실시간 채팅 / 포인트 랭킹은 메인에서 숨긴다(마크업·검사 리터럴은 보존 → 회귀 pin 그대로 통과).
   - 방문자 현황은 사이드바 맨 끝(검사 계약 위치)에 그대로 두되 컴팩트하게, 로그인/지갑도 컴팩트.
   - 신규 @media 없음(900px×4·640px×8 카운트 불변). display:none 은 HTML 을 바꾸지 않아 §27 golden 무영향.
   ============================================================ */
.home-col-side .side-chat{display:none!important}                 /* 실시간 채팅 제거(메인) */
.util-chat-btn#chatToggle{display:none!important}                 /* 홈 상단 채팅 버튼 제거 */
.home-col-side .side-widget:not(.side-login):not(.side-chat):not(.side-visitor){display:none!important} /* 포인트 랭킹 위젯 제거(메인) */
.home-col-side .side-login{padding:12px}                          /* 로그인/지갑 컴팩트 */
.home-col-side .side-visitor{padding:12px 14px}                   /* 방문자 컴팩트(위치는 유지) */
.home-col-side .side-visitor h3{font-size:13px;margin-bottom:8px}
.home-col-side .side-visitor .vc-num{font-size:14px}

/* G2 메인 배너 슬라이더 (v0.9.35) — 홈 최상단, 자동 롤링 */
.main-slider{position:relative;border-radius:16px;overflow:hidden;margin-bottom:var(--sec-gap,20px);
  border:1px solid var(--nx-line-soft);background:var(--color-surface,#121812)}
.main-slide{display:none;line-height:0}
.main-slide.is-active{display:block}
.main-slide img,.main-slide video{width:100%;height:auto;display:block}
.main-slide-text{display:flex;align-items:center;justify-content:center;min-height:160px;
  color:var(--color-text,#e8f5e0);font-weight:800;font-size:20px}
.main-slider-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:40px;height:40px;border:none;border-radius:50%;cursor:pointer;
  background:rgba(0,0,0,.4);color:#fff;font-size:18px;line-height:1;display:flex;
  align-items:center;justify-content:center}
.main-slider-nav:hover{background:rgba(0,0,0,.65)}
.main-slider-nav.prev{left:12px}
.main-slider-nav.next{right:12px}
.main-slider-dots{position:absolute;bottom:12px;left:0;right:0;display:flex;
  justify-content:center;gap:8px;z-index:2}
.main-dot{width:9px;height:9px;border-radius:50%;border:none;cursor:pointer;
  background:var(--nx-line-strong);padding:0}
.main-dot.is-active{background:var(--color-accent,#53FC18)}


/* 인기게임 슬라이더 (v0.9.40) — 전체 통합, 가로 스크롤 */
.pop-games{margin-bottom:var(--sec-gap,22px)}
.pop-games-viewport{position:relative}
.pop-games-track{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;
  scrollbar-width:none;padding:4px 0}
.pop-games-track::-webkit-scrollbar{display:none}
.pop-game-card{flex:0 0 calc((100% - 36px) / 4);width:calc((100% - 36px) / 4);display:flex;flex-direction:column;gap:4px;
  text-decoration:none;background:var(--color-surface,#121812);border-radius:12px;
  overflow:hidden;border:1px solid var(--nx-line-soft);transition:transform .15s,border-color .15s}
.pop-game-card:hover{border-color:var(--color-accent,#53FC18);transform:translateY(-3px)}
.pop-game-thumb{width:100%;aspect-ratio:2/1;background:var(--nx-surface-2);line-height:0;display:flex;align-items:center;justify-content:center}
.pop-game-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.pop-game-name{font-size:13px;font-weight:700;color:var(--color-text,#e8f5e0);
  padding:0 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pop-game-provider{font-size:11px;color:var(--color-muted,#8a9a82);padding:0 10px 10px}
.pop-nav{position:absolute;top:42%;transform:translateY(-50%);z-index:2;width:36px;height:36px;
  border:none;border-radius:50%;cursor:pointer;background:rgba(0,0,0,.5);color:#fff;
  font-size:16px;display:flex;align-items:center;justify-content:center}
.pop-nav:hover{background:rgba(0,0,0,.7)}
.pop-nav.prev{left:-6px}
.pop-nav.next{right:-6px}
@media (max-width:600px){.pop-game-card{flex:0 0 calc((100% - 12px) / 2);width:calc((100% - 12px) / 2)}.pop-nav{display:none}}

/* 홈 제목 폰트 축소 + 인기게임 모바일 최적화 (v0.9.42) */
.home-col-main .sec-title{font-size:clamp(17px,2.2vw,22px)}
.pop-games .sec-title{font-size:clamp(16px,2vw,20px)}
@media (max-width:600px){
  .home-col-main .sec-title{font-size:16px}
  .pop-game-card{flex:0 0 calc((100% - 12px) / 2);width:calc((100% - 12px) / 2)}
  .pop-game-name{font-size:12px}
  .pop-game-provider{font-size:10px}
}

/* feature_grid 모바일 2열 + 카드 축소 + 배너 여백 (v0.9.49) */
@media (max-width:600px){
  .feature-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .feature{padding:16px 10px}
  .feature h3{font-size:15px}
  .feature p{font-size:12px}
  .feature-ico{font-size:26px}
  .feature-ico-img{width:44px;height:44px}
  .home-col-main .sec-banner .banner-inner{padding:22px 20px;flex-direction:column;text-align:center;align-items:center;gap:12px}
}

/* ============================================================
   실시간 채팅 (폴링) — v0.9.51
   .side-widget 을 기반으로 하되, .side-chat 스코프로만 스타일을 추가해
   기존 사이드 위젯 규칙을 덮지 않는다(specificity 안전).
   ============================================================ */
.side-chat .chat-online{font-size:11px;font-weight:600;color:var(--color-muted,#8a9a82)}
.side-chat .chat-log{
  height:260px;overflow-y:auto;
  background:var(--color-bg,#0a0e0a);
  border:1px solid var(--nx-line-soft);border-radius:8px;
  padding:8px 10px;margin-bottom:8px;
  display:flex;flex-direction:column;gap:6px;
  scrollbar-width:thin;
}
.side-chat .chat-log::-webkit-scrollbar{width:6px}
.side-chat .chat-log::-webkit-scrollbar-thumb{background:var(--nx-line);border-radius:3px}
.side-chat .chat-msg{font-size:12.5px;line-height:1.45;word-break:break-word;overflow-wrap:anywhere}
.side-chat .chat-name{font-weight:800;color:var(--color-accent,#53FC18);margin-right:4px}
.side-chat .chat-body{color:var(--color-text,#e8f5e0)}
.side-chat .chat-form{display:flex;gap:6px}
.side-chat .chat-input{
  flex:1 1 auto;min-width:0;
  background:var(--color-bg,#0a0e0a);
  border:1px solid var(--nx-line);border-radius:8px;
  color:var(--color-text,#e8f5e0);font-size:13px;padding:8px 10px;
}
.side-chat .chat-input:focus{outline:none;border-color:var(--color-accent,#53FC18)}
.side-chat .chat-send{
  flex:0 0 auto;
  background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08260a);font-weight:800;
  border:none;border-radius:8px;padding:8px 12px;font-size:13px;cursor:pointer;
}
.side-chat .chat-send:disabled{opacity:.5;cursor:default}
.side-chat .chat-login-note{font-size:12.5px;color:var(--color-muted,#8a9a82);margin:0}
.side-chat .chat-login-note a{color:var(--color-accent,#53FC18);font-weight:700}

/* ============================================================
   로그인 지갑 표기 (포인트 + USDT) — v0.9.52
   ============================================================ */
.util-wallet{font-size:12px;color:var(--color-muted,#8a9a82);margin:0 4px}
.util-wallet b{color:var(--color-accent,#53FC18);font-weight:800}
.side-wallet{display:flex;flex-direction:column;gap:5px;margin:6px 0 10px}
.side-wallet .wallet-row{display:flex;align-items:center;justify-content:space-between;
  background:var(--color-bg,#0a0e0a);border:1px solid var(--nx-line-soft);
  border-radius:8px;padding:7px 10px}
.side-wallet .wallet-label{font-size:12px;color:var(--color-muted,#8a9a82)}
.side-wallet .wallet-val{font-size:13px;font-weight:800;color:var(--color-text,#e8f5e0)}
.side-wallet .wallet-usdt{color:var(--color-accent,#53FC18)}

/* ============================================================
   포인트몰 (/cmall) — v0.9.53
   ============================================================ */
.cmall-page{padding:22px 0 40px}
.cmall-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.cmall-title{font-size:22px;font-weight:900;color:var(--color-text,#e8f5e0);margin:0}
.cmall-mypoint{font-size:14px;color:var(--color-muted,#8a9a82)}
.cmall-mypoint b{color:var(--color-accent,#53FC18);font-weight:800}
.cmall-mypoint a{color:var(--color-accent,#53FC18);font-weight:700}
.cmall-empty{color:var(--color-muted,#8a9a82);padding:24px 0}
/* [v0.9.176] 상품 구분(채굴/포인트/기타) 헤더. 구분은 effect_type 에서 유도(DB 컬럼 아님). */
.cmall-cat{display:flex;align-items:center;gap:9px;margin:18px 0 8px}
.cmall-cat:first-of-type{margin-top:0}
.cmall-cat-t{font-size:15px;font-weight:900;color:var(--color-text,#e8f5e0)}
.cmall-cat-n{font-size:11px;font-weight:800;color:var(--color-accent,#53FC18);background:rgba(83,252,24,.14);
  border:1px solid rgba(83,252,24,.3);padding:1px 7px;border-radius:20px}
.cmall-cat-line{flex:1;height:1px;background:var(--nx-line-soft)}
/* [v0.9.176] 카드 컴팩트화: 썸네일 정사각(1/1)이 카드 높이를 키우던 주범 → 16/10 + 여백·글씨 축소(높이 약 40% 감소) */
.cmall-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.cmall-card{background:var(--color-surface,#121812);border:1px solid var(--nx-line-soft);
  border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.cmall-thumb{position:relative;aspect-ratio:16/10;background:var(--color-bg,#0a0e0a);
  display:flex;align-items:center;justify-content:center;overflow:hidden;padding:6px}
.cmall-thumb img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.cmall-noimg{color:var(--color-muted,#8a9a82);font-size:11px}
.cmall-effect{display:inline-block;align-self:flex-start;background:rgba(83,252,24,.15);
  color:var(--color-accent,#53FC18);font-size:10px;font-weight:800;padding:1px 6px;border-radius:20px;
  border:1px solid rgba(83,252,24,.4);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.cmall-body{padding:7px 8px;display:flex;flex-direction:column;gap:3px;flex:1}
.cmall-name{font-size:12.5px;font-weight:800;color:var(--color-text,#e8f5e0)}
/* 설명은 2줄까지만(길어도 카드 높이가 들쭉날쭉해지지 않게) */
.cmall-desc{font-size:10.5px;color:var(--color-muted,#8a9a82);line-height:1.4;flex:1;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cmall-price{font-size:14px;font-weight:900;color:var(--color-accent,#53FC18)}
.cmall-limit{font-size:10px;color:var(--color-muted,#8a9a82)}
.cmall-buy-form{margin:4px 0 0}
.cmall-buy{width:100%;background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08260a);font-weight:800;
  border:none;border-radius:7px;padding:6px;font-size:12px;cursor:pointer}
.cmall-buy:disabled{opacity:.5;cursor:default}
.cmall-inv{margin-top:32px}
.cmall-inv-title{font-size:18px;font-weight:900;color:var(--color-text,#e8f5e0);margin:0 0 12px}
.cmall-inv-list{display:flex;flex-wrap:wrap;gap:10px}
.cmall-inv-item{display:flex;align-items:center;gap:8px;background:var(--color-surface,#121812);
  border:1px solid var(--nx-line-soft);border-radius:10px;padding:8px 12px}
.cmall-inv-item .inv-name{font-weight:800;color:var(--color-text,#e8f5e0);font-size:13px}
.cmall-inv-item .inv-effect{font-size:11px;color:var(--color-accent,#53FC18)}
.cmall-inv-item .inv-qty{font-size:13px;font-weight:800;color:var(--color-muted,#8a9a82)}
.cmall-inv-note{font-size:12px;color:var(--color-muted,#8a9a82);margin-top:10px}
@media (max-width:1100px){.cmall-grid{grid-template-columns:repeat(5,1fr)}}
@media (max-width:900px){.cmall-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:640px){.cmall-grid{grid-template-columns:repeat(3,1fr);gap:8px}}

/* ============================================================
   레벨 표기 — v0.9.55
   ============================================================ */
.util-wallet .util-lv{color:var(--color-accent,#53FC18);font-weight:800}
.side-wallet .wallet-lv{color:var(--color-accent,#53FC18)}
.side-wallet .wallet-lv small{color:var(--color-muted,#8a9a82);font-weight:600;font-size:11px}
.side-wallet .wallet-level{border-color:rgba(83,252,24,.25)}

/* 포인트몰 인벤토리 '사용' 버튼 — v0.9.56 */
.cmall-inv-item .inv-use{background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#08260a);font-weight:800;
  border:none;border-radius:7px;padding:5px 12px;font-size:12px;cursor:pointer;margin-left:4px}
.cmall-inv-item .inv-use:disabled{opacity:.5;cursor:default}

/* ============================================================
   로그인/지갑 표기 커스터마이즈 (관리자 설정) — v0.9.57
   색상은 base.html <head>에서 주입한 CSS 변수(--w-nick/point/usdt/level) 사용.
   ============================================================ */
/* 색상(관리자 설정 반영) */
.util-user{color:var(--w-nick,#53FC18)}
.util-wallet .util-lv{color:var(--w-level,#53FC18);font-weight:800}
.util-wallet .util-point{color:var(--w-point,#FFD54A);font-weight:800}
.util-wallet .util-usdt{color:var(--w-usdt,#53FC18);font-weight:800}

/* [v0.9.313] ★데스크톱 상단 레벨도 목록·상세와 같은 배지로 통일한다(사장님 확정).
   상단바가 좁아 글자만 한 단계 작게(12px) 두고 나머지 모양·박자는 같다.
   색상은 바로 위 규칙(--w-level)이 그대로 살아 있다(같은 선택자라 선언끼리 합쳐진다).
   ★모바일(<=600px)에서는 .util-wallet-group 이 숨겨져 이 배지는 나오지 않는다. */
.util-wallet .util-lv{display:inline-block;min-width:32px;text-align:center;padding:1px 6px;
  margin-right:6px;border-radius:5px;background:rgba(83,252,24,.14);
  border:1px solid rgba(83,252,24,.35);font-size:12px;line-height:1.5;vertical-align:middle;
  box-shadow:0 0 7px 1px rgba(83,252,24,.42)}
.side-login-user{color:var(--w-nick,#53FC18)}
.side-wallet .wallet-lv{color:var(--w-level,#53FC18)}
.side-wallet .wallet-point{color:var(--w-point,#FFD54A)}
.side-wallet .wallet-usdt{color:var(--w-usdt,#53FC18)}

/* util-bar 3분할 배치: 로고(좌) · 지갑그룹 + 우측버튼(우) */
.logo{margin-right:auto}
.util-wallet-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* 로그아웃 도어 아이콘(문+화살표) — 화살표가 문 밖으로 나가는 kExit 상시 모션 */
.logout{display:inline-flex;cursor:pointer;line-height:0}
.logout .ring{background:linear-gradient(135deg,#1c3a35,#0a201d 50%,#1c3a35);padding:1.5px;
  border-radius:50%;display:inline-flex;transition:background .28s ease,box-shadow .28s ease}
.logout .ring-in{background:#0c1413;border-radius:50%;width:30px;height:30px;
  display:flex;align-items:center;justify-content:center}
.logout:hover .ring{background:linear-gradient(135deg,#53FC18,#1f6b12);box-shadow:0 4px 12px rgba(83,252,24,.4)}
.logout .exit{animation:kExit 1.5s ease-in-out infinite}
@keyframes kExit{0%{transform:translateX(-3px);opacity:0}22%{transform:translateX(-1px);opacity:1}
  72%{transform:translateX(5px);opacity:1}100%{transform:translateX(9px);opacity:0}}
@media (prefers-reduced-motion:reduce){.logout .exit{animation:none}}

/* 모바일 전용 지갑 — 한 줄(레벨아이콘·닉네임 / 포인트·USDT). 데스크톱은 숨김 */
.mobile-wallet{display:none}
@media (max-width:600px){
  .mobile-wallet{display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:6px 12px;background:var(--nx-fill);border-top:1px solid rgba(83,252,24,.14)}
  .util-wallet-group{display:none}       /* 데스크톱 인라인 지갑 숨김 */
  /* 로그아웃은 상단바(로고·햄버거 줄)에 그대로 노출 → .util-right .logout 숨기지 않음 */
  .mw-id{display:flex;align-items:center;gap:5px;min-width:0}
  .mw-lv-icon{font-size:15px;line-height:1}
  /* [v0.9.312] ★회원 패널 배지도 목록·상세와 같은 모양으로 통일하고 같은 효과를 준다
     (사장님 확정: "네온그린 Lv숫자 배지로만 통일" · "전부 넣어주세요").
     사이드바가 좁아 글자만 한 단계 작게 두고 나머지는 같다. */
  .mw-lv-badge{display:inline-block;min-width:32px;text-align:center;padding:1px 6px;border-radius:5px;
    background:rgba(83,252,24,.14);border:1px solid rgba(83,252,24,.35);
    color:var(--w-level,#53FC18);font-size:12px;font-weight:800;line-height:1.5;
    box-shadow:0 0 7px 1px rgba(83,252,24,.42)}
  .mw-nick{color:var(--w-nick,#53FC18);font-size:13px;font-weight:700;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:38vw}
  .mw-bal2{display:flex;align-items:center;gap:10px;flex:0 0 auto}
  .mw-bal2 .mw-p{color:var(--w-point,#FFD54A);font-size:13px;font-weight:800}
  .mw-bal2 .mw-u{color:var(--w-usdt,#53FC18);font-size:13px;font-weight:800}
  /* 포인트몰 모바일 중복 포인트 헤더 숨김(상단 지갑에 이미 표시) */
  .cmall-mypoint-member{display:none}
}

/* 레벨 진행바(홈 사이드) */
.side-wallet .wallet-progress{height:8px;background:var(--nx-line-soft);
  border-radius:6px;overflow:hidden;margin:1px 0 2px}
.side-wallet .wallet-progress-fill{height:100%;background:var(--w-level,#53FC18);
  border-radius:6px;transition:width .4s ease;min-width:2px}
.side-wallet .wallet-progress-text{font-size:11px;color:var(--color-muted,#8a9a82);
  text-align:right;margin-bottom:4px}

/* 모바일: 상단바 한 줄 유지 — [햄버거][로고] 좌 · [채팅][로그인][회원가입] 우. 크기 축소로 줄바꿈 방지. v0.9.156 */
@media (max-width:600px){
  .util-inner{flex-wrap:nowrap;height:56px;padding-top:0;padding-bottom:0;row-gap:0;gap:6px}
  .util-right{order:2;gap:5px;flex-shrink:0}
  .util-link{padding:6px 8px;font-size:12.5px}
  .util-join{padding:6px 10px;font-size:12.5px}
  .util-tg{padding:6px 8px;font-size:11.5px}
  .util-chat-btn{font-size:18px;padding:4px 5px}
  .lang-switch>summary{padding:6px 8px}          /* [v0.9.369 CS-25B] 모바일 언어 선택기 콤팩트 */
  .nav-toggle{font-size:22px}
  .logo img{max-height:40px}   /* [v0.9.237] 30→40. 이 구간의 .util-inner 는 height:56px 고정 */
  .logo .logo-text{font-size:15px}
  .util-wallet-group{display:none}   /* 로그인 인라인 지갑은 모바일 숨김(아래 mobile-wallet 로 표시) */
}
@media (max-width:380px){
  .util-tg{display:none}             /* 아주 좁은 화면: 텔레그램 버튼 숨김(메뉴/푸터에서 접근) */
  .util-link{padding:6px 6px}
  .util-join{padding:6px 8px}
  .lang-switch .lang-current{display:none}   /* [v0.9.369 CS-25B] 아주 좁은 화면: 🌐 아이콘만(언어 메뉴는 그대로 접근) */
}

/* ============================================================
   상단바 재배치 · 채팅(PC 사이드바 / 모바일 팝업) · 모바일 정리 — v0.9.61
   ============================================================ */
/* 햄버거는 로고 앞(좌측). 데스크톱은 숨김(기존 .nav-toggle 규칙 유지) */
.util-inner .nav-toggle{order:-1;margin-right:2px}

/* 상단 실시간 채팅 버튼(💬) — 모바일 전용(PC는 사이드바 인라인 채팅 사용) */
.util-chat-btn{display:none;background:none;border:0;color:var(--color-text);font-size:19px;
  cursor:pointer;padding:4px 8px;line-height:1;border-radius:8px}
.util-chat-btn:hover{color:var(--color-accent,#53FC18);background:var(--nx-fill)}

/* 포인트몰 회원 포인트 헤더 — 전역 제거(상단 지갑/util-bar에 이미 표시) */
.cmall-mypoint-member{display:none}

/* 채팅 닫기(✕)·백드롭 — 데스크톱은 인라인이라 숨김 */
.chat-close-m{display:none}
.chat-backdrop{display:none}
body.chat-open{overflow:hidden}

/* 모바일: 회원정보 숨김 + 채팅 바텀시트 팝업 + 상단 채팅버튼 노출 + 포인트몰 썸네일 세로폭 축소 */
@media (max-width:600px){
  .side-login{display:none}
  .util-chat-btn{display:inline-flex}
  /* 사이드바 인라인 채팅을 숨기고, 열릴 때만 바텀시트로 노출 */
  .side-chat{display:none;position:fixed;left:0;right:0;bottom:0;top:auto;z-index:1200;
    margin:0;max-height:78vh;border-radius:14px 14px 0 0;box-shadow:0 -10px 34px rgba(0,0,0,.5)}
  .side-chat.is-open{display:flex;flex-direction:column}
  .side-chat h3{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .side-chat .chat-log{flex:1;min-height:200px}
  .chat-close-m{display:inline-block;margin-left:auto;background:none;border:0;
    color:var(--color-muted,#8a9a82);font-size:15px;cursor:pointer;padding:0 2px}
  .chat-close-m:hover{color:var(--color-accent,#53FC18)}
  .chat-backdrop.is-open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1199}
}
@media (max-width:640px){
  /* 썸네일 세로폭 축소 + 설명 숨김 → 한 화면에 2줄 이상 노출 */
  .cmall-thumb{aspect-ratio:16/10;padding:5px}
  .cmall-body{padding:6px 7px;gap:2px}
  .cmall-name{font-size:12px}
  .cmall-desc{display:none}
  .cmall-price{font-size:13px}
  .cmall-buy{padding:7px;font-size:12px}
}

/* ============================================================
   [v0.9.98] 리치에디터(Summernote) — 렌더 표시(.rich-content) + 에디터 최소 오버라이드
   ============================================================ */
/* 저장된 정제 HTML 표시. white-space:normal 로 재정의(기존 .post-content pre-wrap 무효화). */
.rich-content{white-space:normal;word-break:break-word}
.rich-content p{margin:0 0 10px}
.rich-content p:last-child{margin-bottom:0}
.rich-content h1{font-size:1.6rem;font-weight:800;margin:14px 0 8px;line-height:1.3}
.rich-content h2{font-size:1.4rem;font-weight:800;margin:13px 0 7px;line-height:1.3}
.rich-content h3{font-size:1.25rem;font-weight:800;margin:12px 0 6px;line-height:1.3}
.rich-content h4{font-size:1.1rem;font-weight:700;margin:10px 0 5px}
.rich-content h5,.rich-content h6{font-size:1rem;font-weight:700;margin:8px 0 4px}
.rich-content ul,.rich-content ol{margin:0 0 10px;padding-left:1.6em}
.rich-content li{margin:2px 0}
.rich-content blockquote{margin:10px 0;padding:6px 12px;border-left:3px solid var(--color-accent,#53FC18);
  background:rgba(83,252,24,.06);color:var(--color-text);border-radius:0 6px 6px 0}
.rich-content pre{margin:10px 0;padding:10px 12px;background:var(--nx-fill);border-radius:6px;
  overflow:auto;white-space:pre-wrap;word-break:break-word;font-family:monospace;font-size:13px}
.rich-content a{color:var(--color-accent,#53FC18);text-decoration:underline;word-break:break-all}
.rich-content strong,.rich-content b{font-weight:800}
.rich-content u{text-decoration:underline}
.rich-content s,.rich-content strike{text-decoration:line-through}
.rich-content hr{border:0;border-top:1px solid var(--nx-line);margin:14px 0}
/* 표: Summernote 는 class(table table-bordered)로 테두리를 주지만 정제 시 class 제거 →
   여기서 테두리를 직접 렌더(어두운 배경에 보이도록). */
.rich-content table{border-collapse:collapse;margin:10px 0;max-width:100%}
.rich-content td,.rich-content th{border:1px solid var(--nx-line-strong);padding:6px 10px}
.rich-content th{background:var(--nx-line-soft);font-weight:700}
.rich-content img{max-width:100%;height:auto;display:inline-block;vertical-align:top}
/* [v0.9.335] 본문 이미지를 인라인 요소로 둔다 — 전역 img 는 블록이라 문단의 가운데/좌/우
   정렬이 이미지에는 먹지 않았다. 정렬값은 문단에 저장돼 있으므로 이 한 줄로 예전 글까지 함께 맞춰진다.
   전역 규칙(14행)은 그대로 두어 로고/썸네일/배너 등 나머지 화면은 손대지 않는다. */

/* Summernote 에디터: 입력 영역은 흰 배경(가독성) — 사이트 다크 테마 위에서도 참고 사이트처럼 표시. */
.note-editor.note-frame{border-radius:8px;border-color:rgba(0,0,0,.18)}
.note-editor .note-editable{background:#fff;color:#181818;font-size:15px;line-height:1.7}
.note-editor .note-placeholder{color:#8a8f98}
/* [v0.9.335] 글 쓰는 중 화면도 완성본과 같게 보이도록 에디터 안 이미지도 인라인으로. */
.note-editor .note-editable img{display:inline-block;vertical-align:top}

/* ============================================================
   [v0.9.99] 댓글 입력 폼(평문 textarea + 등록 버튼) — 참고 사이트 스타일
   ============================================================ */
.comment-form{display:flex;flex-direction:column;gap:8px}
.comment-input{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:10px;
  border:1px solid var(--nx-line);background:var(--nx-fill);color:var(--color-text);
  font-family:inherit;font-size:14px;line-height:1.6;resize:vertical;min-height:96px}
.comment-input::placeholder{color:var(--color-muted,#8a9a82)}
.comment-input:focus{outline:none;border-color:var(--color-accent,#53FC18)}
.comment-submit{align-self:flex-end;min-width:110px}

/* ============================================================
   [v0.9.100] 댓글 아이템을 배경과 구분되는 카드(섹터)로 (글 본문 .post-view 카드와 통일감)
   ============================================================ */
.comments{margin-top:24px}
.comment-item{padding:12px 16px;margin-bottom:8px;background:var(--nx-fill-soft);
  border:1px solid var(--nx-line-soft);border-radius:10px}
.comment-item:last-of-type{margin-bottom:0}
/* 댓글 메타는 글 메타(.post-meta2)의 하단 구분선/여백을 쓰지 않는다 */
.comment-meta{padding-bottom:0;border-bottom:none}
.comment-body{font-size:14px;line-height:1.65;color:var(--color-text)}

/* [v0.9.119] 댓글 컨트롤(수정/삭제/블라인드) + 본인 댓글 인라인 수정 폼 — .comment-actions 하위로 스코프 */
.comment-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;align-items:flex-start}
.comment-actions form{margin:0}
.cmt-act-btn{display:inline-flex;align-items:center;padding:5px 12px;border-radius:8px;
  border:1px solid var(--nx-line-strong);background:transparent;color:var(--color-muted,#8a9a82);
  font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;line-height:1.4;transition:all .15s}
.cmt-act-btn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.cmt-act-btn.primary{background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#04120a);border-color:var(--color-accent,#53FC18)}
.cmt-act-btn.primary:hover{background:var(--color-accent-2,#2bd40f);color:var(--nx-on-accent,#04120a)}
.cmt-edit>summary{list-style:none}
.cmt-edit>summary::-webkit-details-marker{display:none}
.cmt-edit[open]{flex:1 1 100%}
.cmt-edit-form{margin-top:8px;display:flex;flex-direction:column;gap:8px}
.cmt-edit-form textarea{width:100%;padding:9px 11px;border-radius:9px;border:1px solid var(--nx-line);
  background:var(--nx-fill-soft);color:var(--color-text);font-family:inherit;font-size:14px;resize:vertical;box-sizing:border-box}
.cmt-edit-form textarea:focus{outline:none;border-color:var(--color-accent,#53FC18)}
.cmt-edit-form .cmt-act-btn{align-self:flex-start}

/* ============================================================
   [v0.9.101] 게시판 목록 표(번호|제목|작성자|작성일|조회) — 참고 사이트 양식
   ============================================================ */
.board-table-wrap{width:100%;overflow-x:auto;margin-top:6px}
.board-table{width:100%;border-collapse:collapse;font-size:14px}
.board-table thead th{padding:12px 10px;color:var(--color-muted,#8a9a82);font-weight:700;font-size:13px;
  border-top:1px solid var(--nx-line);border-bottom:2px solid var(--nx-line);
  text-align:center;white-space:nowrap}
.board-table thead th.col-title{text-align:left}
.board-table tbody td{padding:13px 10px;border-bottom:1px solid var(--nx-line-soft);
  text-align:center;color:var(--color-text);vertical-align:middle}
.board-table tbody tr:hover{background:var(--nx-fill-soft)}
.board-table .col-num{width:74px;color:var(--color-muted,#8a9a82);font-size:13px}
.board-table td.col-title{text-align:left}
/* [v0.9.313] ★작성자 칸을 넓혀 닉네임 8글자를 보장한다(사장님 확정).
   근거: 칸 안쪽 = 161 - 좌우여백 20 = 141 → 배지 39 + 간격 6 + 닉네임 96(=8글자).
   제목 칸은 632 → 601px 로 31px 만 줄어든다. */
.board-table .col-author{width:161px;color:var(--color-muted,#8a9a82);font-size:13px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:161px}
/* [v0.9.314] ★PC 는 작성일에 시간까지 보인다(사장님 확정).
   실측: '2026-08-02 22:38' = 103px → 좌우 여백 20 포함 125px 필요. 제목 칸은 601 → 586px. */
.board-table .col-date{width:125px;color:var(--color-muted,#8a9a82);font-size:13px;white-space:nowrap}
.board-table .col-date .bd-short{display:none}
.board-table .col-view{width:70px;color:var(--color-muted,#8a9a82);font-size:13px}
.board-table .post-title-link{color:var(--color-text);text-decoration:none;font-weight:500}
.board-table .post-title-link:hover{color:var(--color-accent,#53FC18);text-decoration:underline}
.board-table .cmt-count{margin-left:6px;color:var(--color-accent,#53FC18);font-size:12px;font-weight:800}
.board-table tr.is-notice{background:rgba(83,252,24,.05)}
.board-table tr.is-notice .post-title-link{font-weight:700}
.notice-badge{display:inline-block;padding:2px 9px;border-radius:6px;background:var(--color-accent,#53FC18);
  color:var(--nx-on-accent,#0a0e0a);font-size:11px;font-weight:800;letter-spacing:.5px}
.board-empty-row td{padding:44px 10px !important;color:var(--color-muted,#8a9a82);text-align:center !important}

@media (max-width:640px){
  .board-table{font-size:13px}
  .board-table thead th,.board-table tbody td{padding:10px 6px}
  /* [v0.9.314] ★모바일 목록형은 두 줄로 그린다(사장님 확정).
       1줄 = 제목 전체 폭 · 2줄 = 레벨+닉네임 / 작성일 / 조회 / 추천.
     ★표(table) 구조와 마크업은 그대로 두고 CSS 로만 배치를 바꾼다(회귀 최소).
     ★공지 배지는 번호 칸 안에 들어 있어, 번호 칸을 그냥 감추면 공지 표시가 사라진다.
       그래서 공지 행에서만 번호 칸을 남긴다. */
  .board-table .col-num{width:46px;font-size:12px}
  .board-table thead{display:none}
  /* [v0.9.315] ★표 레이아웃 알고리즘을 아예 뺀다.
     v0.9.314 에서 행만 flex 로 바꿨더니 표(table)는 여전히 내용 크기대로 커져
     담는 상자(305px)보다 24px 넓어졌고(329px) 추천 칸이 화면 밖으로 밀렸다(N-28).
     ★width:100% 만으로는 안 된다 — table-layout:auto 가 그걸 무시한다.
       display:block 으로 바꾸면 표 계산이 사라져 폭이 그대로 지켜지고,
       아이폰 사파리 등 브라우저 편차 위험도 없다(360·412px 실측 확인). */
  .board-table{display:block;width:100%}
  .board-table tbody{display:block;width:100%}
  .board-table tbody tr{display:flex;flex-wrap:wrap;align-items:center;
    padding:9px 2px;border-bottom:1px solid var(--nx-line-soft)}
  .board-table tbody td{border-bottom:0;padding:0}
  .board-table tbody td.col-num{display:none}
  /* [v0.9.315] ★공지 행도 일반 행과 똑같은 두 줄로 만든다.
     v0.9.314 는 공지만 번호 칸을 남겨 제목과 한 줄에 놓았는데,
     그 바람에 운영자·작성일까지 첫 줄로 올라오고 조회·추천만 다음 줄로 밀려
     줄이 뒤죽박죽이 됐다(사장님 지적·412px 실측 재현).
     ★공지 표시는 제목 앞 배지로 내서 줄 구조를 건드리지 않는다. */
  .board-table tbody td.col-title{order:2;flex:1 1 100%;width:auto;max-width:100%;
    font-size:14px;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .board-table tbody tr.is-notice td.col-title::before{content:"공지";display:inline-block;
    margin-right:6px;padding:1px 7px;border-radius:6px;background:var(--color-accent,#53FC18);
    color:var(--nx-on-accent,#0a0e0a);font-size:11px;font-weight:800;letter-spacing:.5px;vertical-align:middle}
  .board-table tbody td.col-author{order:3;flex:1 1 auto;width:auto;max-width:none;
    margin-top:5px;text-align:left;font-size:11px}
  .board-table tbody td.col-date{order:4;flex:0 0 auto;width:auto;margin-top:5px;margin-left:10px;font-size:11px}
  .board-table tbody td.col-view{order:5;flex:0 0 auto;width:auto;margin-top:5px;margin-left:10px;font-size:11px}
  .board-table tbody td.col-recommend{order:6;flex:0 0 auto;width:auto;margin-top:5px;margin-left:10px;font-size:11px}
  .board-table tbody td.col-date .bd-full{display:none}
  .board-table tbody td.col-date .bd-short{display:inline}
  .board-table tbody td.col-view::before{content:"조회 "}
  .board-table tbody td.col-recommend::before{content:"추천 "}
  .board-table tbody tr.board-empty-row td{flex:1 1 100%}
  .board-table .col-author{width:auto;max-width:84px;font-size:12px}
  .board-table .col-view{width:50px;font-size:12px}
}

/* ============================================================
   [v0.9.102] 추천/비추천 버튼 (글 상세)
   ============================================================ */
.vote-box{display:flex;gap:12px;justify-content:center;margin:22px 0 4px}
.vote-box form{margin:0}
.vote-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 22px;border-radius:10px;
  font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;transition:all .15s;
  border:1px solid var(--nx-line-strong);background:var(--nx-fill);color:var(--color-text)}
.vote-btn b{font-size:15px}
.vote-btn:hover{background:var(--nx-line-soft)}
/* [v0.9.118] 게시물 본인 수정/삭제 액션 — .post-owner-actions 하위로만 스코프(댓글 버튼 등 다른 .btn 무영향) */
.post-owner-actions{display:flex;gap:8px;justify-content:flex-end;margin:12px 0 0}
.post-owner-actions form{margin:0}
.post-owner-actions .btn{display:inline-flex;align-items:center;padding:7px 16px;border-radius:9px;
  border:1px solid var(--nx-line-strong);background:transparent;color:var(--color-text);
  font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;text-decoration:none;transition:all .15s}
.post-owner-actions .btn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.post-owner-actions .btn.danger:hover{border-color:#ff6b6b;color:#ff6b6b}
/* 추천: 사이트 강조색 계열 / 비추천: 무채색 */
.vote-up{border-color:rgba(83,252,24,.4)}
.vote-up b{color:var(--color-accent,#53FC18)}
.vote-up:hover{border-color:var(--color-accent,#53FC18);background:rgba(83,252,24,.1)}
.vote-up.active{background:var(--color-accent,#53FC18);color:var(--nx-on-accent,#0a0e0a);border-color:var(--color-accent,#53FC18)}
.vote-up.active b{color:var(--nx-on-accent,#0a0e0a)}
.vote-down.active{background:rgba(255,90,90,.18);border-color:rgba(255,90,90,.5);color:#ff8a8a}
.vote-down.active b{color:#ff8a8a}

/* [v0.9.103] 게시판 목록 추천 컬럼 */
.board-table .col-recommend{width:64px;color:var(--color-muted,#8a9a82);font-size:13px;font-weight:700}
.board-table .col-recommend.has-rec{color:var(--color-accent,#53FC18)}
@media (max-width:640px){
  .board-table .col-recommend{width:48px;font-size:12px}
}

/* ============================================================
   [v0.9.105] 작성자 레벨 배지 (목록/상세) — 레벨 숫자 + 닉네임
   ============================================================ */
/* [v0.9.317] ★깜빡임을 없앤다(사장님 지시). 움직이는 효과는 전부 빼고
   은은한 발광만 늘 켜 둔다 — 「동작 줄이기」를 켠 분이 보시던 그 모양이다.
   ★이렇게 하면 PC·모바일·접근성 설정과 관계없이 모두가 같은 모양을 본다. */
.lv-badge{display:inline-block;min-width:34px;text-align:center;padding:2px 7px;margin-right:5px;
  border-radius:5px;background:rgba(83,252,24,.14);border:1px solid rgba(83,252,24,.35);
  color:var(--color-accent,#53FC18);font-size:13px;font-weight:800;line-height:1.5;vertical-align:middle;
  box-shadow:0 0 7px 1px rgba(83,252,24,.42)}

/* [v0.9.312] ★레벨 배지 살아 있는 느낌 — 사장님이 보내주신 영상과 같은 박자(3.3초).
   ① 호흡: 천천히 흐려졌다 다시 또렷해진다(꺼질 때보다 켜질 때가 느리다)
   ② 발광: 다시 켜지는 동안 테두리가 은은히 번진다
   ③ 광택: 켜질 때 빛줄기가 한 번 스윽 지나간다
   ★모든 배지가 같은 박자로 움직인다(사장님 확정).
   ★움직임을 줄여 달라고 설정한 분에게는 아예 멈춘다(아래 reduce 규칙). */
/* [v0.9.317] ★배지의 움직임 정의 세 가지와 광택 덧대기, 그리고 그것들을 멈추던
   「동작 줄이기」 규칙을 함께 지웠다. 이제 멈출 움직임 자체가 없다.
   ★P-62: 게이트가 세는 이름은 주석에 적지 않는다. */
.op-badge{display:inline-block;padding:1px 7px;border-radius:5px;background:var(--nx-line-soft);
  border:1px solid var(--nx-line-strong);color:var(--color-muted,#8a9a82);font-size:11px;font-weight:700;vertical-align:middle}
.board-table .col-author .lv-badge{margin-right:0}

/* [v0.9.312] ★작성자 칸 정렬 (사장님 확정: 배치 ⓑ)
   ★예전 문제: 칸 전체가 가운데 정렬이라 배지와 닉네임이 한 덩어리로 가운데 몰렸다.
     닉네임이 길면 배지가 왼쪽으로, 짧으면 오른쪽으로 밀려 세로줄이 안 맞았다.
   ★고친 방법: 배지는 왼쪽에 고정해 세로줄을 맞추고, 닉네임은 남은 칸에서 가운데 정렬한다.
     닉네임 칸에 최대 폭을 둬서 배지와 너무 벌어지지 않게 했다.
   ★td 자체에 flex 를 걸면 표 레이아웃이 깨질 수 있어 안쪽 상자에 건다. */
.board-table .col-author .author-box{display:flex;align-items:center;width:100%}
.board-table .col-author .author-lv{flex:0 0 auto;display:flex}
.board-table .col-author .author-nick{flex:1 1 auto;min-width:0;margin-left:6px;max-width:96px;
  text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* [v0.9.313] ★중단점을 640 으로 맞춘다.
   예전엔 작성자 칸만 640 에서 줄고 배지·닉네임은 600 에서 줄어,
   601~640px 화면에서 닉네임이 32px(약 2글자)까지 눌렸다. */
@media (max-width:640px){
  /* [v0.9.315] ★한 줄일 때 필요했던 44px 제한을 푼다.
     두 줄 배치에서는 자리가 넉넉한데 그대로 남아 20행 중 7행이 잘렸다(N-29). */
  /* [v0.9.317] ★N-31 — 이 두 규칙은 원래 파일 앞쪽 모바일 블록에 있었는데,
     같은 굵기(선택자 개수)의 기본 규칙이 뒤에 있어 **아예 먹지 않았다**.
     그래서 닉네임 칸이 96px 로 늘고 글자가 가운데로 몰려 배지와 32px 벌어져 보였다.
     기본 규칙 뒤로 옮겨서 실제로 적용되게 한다(사장님 지적). */
  .board-table .col-author .author-box{width:auto}
  .board-table .col-author .author-nick{flex:0 1 auto;text-align:left;margin-left:4px}
  .lv-badge{min-width:30px;padding:1px 5px;font-size:11px}
}

/* [v0.9.107] 목록 제목 옆 이미지 아이콘 (이미지 포함 글) */
.board-table .img-icon{display:inline-block;vertical-align:middle;margin-left:5px;
  color:var(--color-accent,#53FC18);opacity:.85}

/* [v0.9.133] 회원 액션 패널 — 마이페이지/출석체크/알림함/아이템함 (로그인 시). 데스크톱+모바일 공통, 넘치면 가로스크롤 */
.member-bar{background:var(--color-surface,#12160f);border-bottom:1px solid rgba(83,252,24,.12)}
.member-menu{display:flex;align-items:center;justify-content:safe center;gap:8px;padding:8px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.member-menu::-webkit-scrollbar{display:none}
.member-menu .mbtn{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  padding:8px 16px;font-size:14px;font-weight:800;border-radius:9px;text-decoration:none;
  color:var(--color-text,#e8f0e3);background:var(--color-bg,#0b0f08);border:1px solid var(--nx-line)}
.member-menu a.mbtn:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.member-menu .mbtn-soon{color:var(--color-muted,#8a9a82);cursor:not-allowed;opacity:.7}
.member-menu .mbtn-soon em{font-style:normal;font-size:10px;font-weight:700;color:var(--nx-on-accent,#0b0f08);
  background:var(--color-muted,#8a9a82);border-radius:5px;padding:1px 5px}
@media (max-width:768px){
  .member-menu{gap:6px;padding:7px 0}
  .member-menu .mbtn{padding:7px 13px;font-size:13px}
}

/* [v0.9.135] 회원 액션 버튼: PC=사이드바(홈 side-login), 모바일=헤더 패널(member-bar) → 반응형 분리 */
/* [v0.9.136] 사이드바 버튼을 한 줄 가로 배치(슬롯버프4 스타일 — 컴팩트 4열) */
.side-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:2px;padding-top:10px;border-top:1px solid var(--nx-line-soft)}
.side-act.side-btn{padding:9px 3px;font-size:11px;font-weight:700;border-radius:8px}
.side-act-soon{opacity:.5;cursor:not-allowed}
/* PC(>900px): 헤더 회원 패널 숨김 — 사이드바가 대체(슬롯버프4 위치) */
/* [FINAL CLOSURE §8] 회원 액션 바(member-bar)를 PC 에서도 노출 — 홈 우측 레일(side-actions) 제거 후 회원 액션의 단일 소스가 헤더 패널이다. @media 블록 유지(카운트 불변). */
@media (min-width:901px){ .member-bar .member-menu{max-width:1200px;margin:0 auto} }
/* 모바일/태블릿(≤900px): 사이드바 액션 버튼 숨김 — 헤더 패널이 대체(모바일 위치 유지) */
@media (max-width:900px){ .side-actions{display:none} }

/* [v0.9.137] 알림 안읽음 배지 (슬롯버프4식). 헤더=인라인(스크롤 클리핑 회피), 사이드바=우상단 코너 */
.mbtn-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;margin-left:5px;
  font-size:10px;font-weight:800;color:#fff;background:#e5484d;border-radius:999px;line-height:1}
.side-act{position:relative}
.side-act-badge{position:absolute;top:-6px;right:-6px;min-width:17px;height:17px;padding:0 4px;
  display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;
  background:#e5484d;border-radius:999px;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.4)}


/* ============================================================
   [v0.9.256] 홈 게시판 탭 카드 (ht-*)
   - 전부 신규 클래스. 기존 선택자는 하나도 건드리지 않는다(기존 화면 영향 0).
   - 모바일 분기 기준폭 900px = .home-grid 기준폭과 동일(사장님 확정).
     ※ 메뉴 기준폭 860px 과는 별개다. 두 값을 섞지 말 것.
   ============================================================ */
.ht-sec{margin-bottom:var(--sec-gap,22px)}
.board-tabs{border:1px solid var(--nx-line);border-radius:14px;overflow:hidden;
  background:var(--nx-fill-soft)}
.ht-head{display:flex;align-items:center;gap:10px;padding:0 12px;
  border-bottom:1px solid var(--nx-line);background:rgba(0,0,0,.18)}
.ht-nav{display:flex;flex:1 1 auto;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ht-nav::-webkit-scrollbar{display:none}
.ht-tab{flex:0 0 auto;padding:13px 14px;border:0;background:none;cursor:pointer;
  color:var(--color-muted,#8a9a82);font-size:14px;font-weight:700;white-space:nowrap;
  border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.ht-tab:hover{color:var(--color-text,#e8f5e0)}
/* 선택된 탭: 형광 글자 + 형광 밑줄 */
.ht-tab.is-active{color:var(--color-accent,#53FC18);border-bottom-color:var(--color-accent,#53FC18)}
.ht-more{flex:0 0 auto;color:var(--color-muted,#8a9a82);font-size:13px;text-decoration:none;white-space:nowrap}
.ht-more:hover{color:var(--color-accent,#53FC18)}
.ht-body{padding:12px 14px;min-height:120px}
.ht-body.is-loading{opacity:.45}
.ht-empty{padding:26px 4px;text-align:center;color:var(--color-muted,#8a9a82);font-size:13px}

/* 목록형 */
.ht-list{list-style:none;margin:0;padding:0}
.ht-row{display:flex;align-items:center;gap:10px;padding:9px 2px;
  border-bottom:1px solid var(--nx-line-soft)}
.ht-row:last-child{border-bottom:0}
.ht-row-title{flex:1 1 auto;min-width:0;color:var(--color-text,#e8f5e0);font-size:14px;text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-row-title:hover{color:var(--color-accent,#53FC18)}
.ht-cmt{color:var(--color-accent,#53FC18);font-size:12px}
/* [v0.9.266] 메타를 「표처럼」 칸 폭을 고정한다. 값이 없어도 칸이 남아 세로 라인이 맞는다.
   숫자는 tabular-nums 로 자릿수가 달라도 폭이 흔들리지 않는다. 작성자는 길면 …로 자른다. */
.ht-row-meta{flex:0 0 auto;display:flex;gap:8px;color:var(--color-muted,#8a9a82);font-size:12px;
  font-variant-numeric:tabular-nums}
.ht-row-author{flex:0 0 84px;width:84px;text-align:right;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-row-date{flex:0 0 82px;width:82px;text-align:right;white-space:nowrap}
.ht-row-rec{flex:0 0 52px;width:52px;text-align:right;white-space:nowrap}
.ht-row-view{flex:0 0 56px;width:56px;text-align:right;white-space:nowrap}
/* [v0.9.314] ★탭 안의 글 전부가 추천 0 이면 그 칸이 통째로 죽은 여백이 된다(모바일 52px).
   마크업(span)은 그대로 두고 CSS 로만 감춘다 → 한 탭 안에서는 전부 같이 사라져 세로줄이 유지된다. */
.ht-list.no-rec .ht-row-rec{display:none}

/* 카드형(보증사이트 등) */
/* [v0.9.260] 카드형 탭(보증사이트)은 3열 — 칸이 넓어져 썸네일이 커진다.
   썸네일 원본을 그대로 쓰므로(post.thumbnail=원본 URL) 확대해도 화질이 떨어지지 않는다.
   모바일(<=900px)은 사장님 확정대로 2열 유지. 갤러리형(.ht-tiles)은 손대지 않는다. */
.ht-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
/* [v0.9.262] 썸네일을 카드 가장자리까지 붙여(padding 0) 가로폭을 최대로 쓰고,
   제목은 그 아래에 여백을 줘서 넣는다. 게시판 페이지 카드(.pc-card)와 같은 구성. */
.ht-card{display:flex;flex-direction:column;gap:0;text-decoration:none;
  border:1px solid var(--nx-line);border-radius:12px;padding:0;overflow:hidden;
  background:var(--nx-fill-soft);transition:border-color .15s,transform .15s}
.ht-card:hover{border-color:var(--color-accent,#53FC18);transform:translateY(-3px)}
/* [v0.9.262] 5:2(700x280) -> 7:4(700x400). 세로가 40% 커져 배너 글씨가 읽힌다.
   모서리는 카드(.ht-card{overflow:hidden})가 잘라 주므로 여기선 둥글리지 않는다. */
.ht-card-thumb{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:7/4;
  overflow:hidden;background:rgba(0,0,0,.25)}
.ht-card-thumb img{width:100%;height:100%;object-fit:contain}
.ht-card-title{color:var(--color-text,#e8f5e0);font-size:14px;font-weight:700;
  padding:9px 11px 11px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-card-sum{color:var(--color-muted,#8a9a82);font-size:12px;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ht-noimg{color:var(--color-muted,#8a9a82);font-size:12px}
/* [v0.9.345] 그림이 안 뜰 때 대신 보이는 이름표(사이트 전체 공통).
   담고 있는 칸을 가득 채우고 가운데 정렬 — 칸 크기가 변하지 않아 배치가 흐트러지지 않는다. */
.img-fallback{display:flex;align-items:center;justify-content:center;text-align:center;
  width:100%;height:100%;min-height:38px;padding:6px 8px;box-sizing:border-box;
  color:var(--color-muted,#8a9a82);font-size:11.5px;line-height:1.35;
  background:var(--nx-fill);border-radius:6px;word-break:keep-all}

/* [v0.9.261] 카드형 탭 가로 슬라이더 — 한 줄 3개(모바일 2개), 넘치면 옆으로 밀림.
   overflow-x:auto 라 모바일 스와이프가 기본 지원된다(인기게임 슬라이더와 동일 방식).
   PC 3개 = (100% - gap*2) / 3.  모바일 2개는 아래 900px 블록에서. */
.ht-slider{position:relative}
.ht-slider-track{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x mandatory}
.ht-slider-track::-webkit-scrollbar{display:none}
.ht-slider-track > .ht-card{flex:0 0 calc((100% - 24px) / 3);scroll-snap-align:start}
/* [v0.9.340] 보증사이트 카드 — 보증금 배지 + 입금수단 줄 (사장님 확정 사양 B-2형)
   ★.ht-card-title 규칙 자체는 손대지 않는다(F100 계약: padding:9px 11px 11px).
     제목은 아래 머리줄 안에서 flex 로 줄어들게만 만든다. */
.ht-card-head{display:flex;align-items:center;gap:8px;padding:0 11px 0 0}
.ht-card-head > .ht-card-title{flex:1 1 auto;min-width:0}
.ht-dep{position:relative;flex:0 0 auto;display:inline-flex;border-radius:11px;background:#000;overflow:hidden}
/* [v0.9.341] 빛줄기를 '사각 테두리를 정확히 도는' 방식으로 바꿨다(사장님 지적).
   예전의 원뿔형 그라디언트 회전은 배지 한가운데를 기준으로 각도만 돌아서, 가로로 긴 배지에서는
   모서리에서 빨라지고 위아래 변에서 느려졌다 — 사각을 따라가는 게 아니었다.
   이제 네 변에 조각을 하나씩 두고 1.8초를 4등분해 순서대로 켠다 → 빛줄기는 항상 한 개다. */
.ht-dep .ht-dep-beam{position:absolute;inset:0}
.ht-dep .ht-dep-beam i{position:absolute;opacity:0;will-change:transform;
  animation-duration:1.8s;animation-timing-function:linear;animation-iteration-count:infinite}
.ht-dep .ht-dep-beam .e-t,.ht-dep .ht-dep-beam .e-b{height:2.5px;width:46%;
  background:linear-gradient(90deg,transparent,#53FC18 38%,#f2ffe4 50%,#53FC18 62%,transparent)}
.ht-dep .ht-dep-beam .e-r,.ht-dep .ht-dep-beam .e-l{width:2.5px;height:60%;
  background:linear-gradient(180deg,transparent,#53FC18 38%,#f2ffe4 50%,#53FC18 62%,transparent)}
.ht-dep .ht-dep-beam .e-t{top:0;left:0;animation-name:htDepRunT}
.ht-dep .ht-dep-beam .e-r{top:0;right:0;animation-name:htDepRunR}
.ht-dep .ht-dep-beam .e-b{bottom:0;left:0;animation-name:htDepRunB}
.ht-dep .ht-dep-beam .e-l{bottom:0;left:0;animation-name:htDepRunL}
.ht-dep .ht-dep-in{position:relative;margin:2.5px;border-radius:8.5px;background:#000;
  display:inline-flex;align-items:center;gap:5px;padding:3px 9px}
.ht-dep .ht-dep-ico{width:16px;height:16px;object-fit:contain;flex:0 0 auto}
/* [v0.9.341] 글씨는 번짐(글로우)을 없애고 키웠다 — 3겹 번짐이 11.5px 글씨를 뭉개서
   「뚜렷해야 하는데 뿌옇다」는 지적을 받았다(사장님). 이제 획이 그대로 보인다. */
.ht-dep .ht-dep-txt{font-size:12.5px;font-weight:900;white-space:nowrap;color:#eaffdc;
  letter-spacing:-.2px;text-shadow:none;
  animation:htDepBlink 2.4s steps(1,end) infinite}
.ht-dep.is-none{background:var(--nx-line-soft)}
.ht-dep.is-none .ht-dep-in{background:rgba(0,0,0,.35)}
.ht-dep.is-none .ht-dep-ico{filter:grayscale(1);opacity:.5}
.ht-dep.is-none .ht-dep-txt{color:#8b938a;text-shadow:none;animation:none;font-weight:700}
/* 카드가 여러 장이면 시차를 줘서 같은 순간에 몰려 그려지지 않게 한다 */
.ht-slider-track > .ht-card:nth-child(2n) .ht-dep-beam i{animation-delay:-.45s}
.ht-slider-track > .ht-card:nth-child(3n) .ht-dep-beam i{animation-delay:-.9s}
.ht-pay{display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  padding:7px 11px 10px;border-top:1px solid rgba(255,255,255,.08);margin-top:auto}
.ht-pay-lb{font-size:11px;color:#8b938a;flex:0 0 auto}
.ht-pay-it{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;color:#cfe6c6}
.ht-pay-it img{width:14px;height:14px;object-fit:contain}
/* 네 변을 1.8초에 4등분해 순서대로 지나간다(빛줄기는 언제나 한 개) */
@keyframes htDepRunT{0%{opacity:1;transform:translateX(-100%)}24.9%{opacity:1;transform:translateX(217%)}25%,100%{opacity:0;transform:translateX(217%)}}
@keyframes htDepRunR{0%,25%{opacity:0;transform:translateY(-100%)}25.01%{opacity:1;transform:translateY(-100%)}49.9%{opacity:1;transform:translateY(167%)}50%,100%{opacity:0}}
@keyframes htDepRunB{0%,50%{opacity:0;transform:translateX(217%)}50.01%{opacity:1;transform:translateX(217%)}74.9%{opacity:1;transform:translateX(-100%)}75%,100%{opacity:0}}
@keyframes htDepRunL{0%,75%{opacity:0;transform:translateY(167%)}75.01%{opacity:1;transform:translateY(167%)}99.9%{opacity:1;transform:translateY(-100%)}100%{opacity:0}}
/* [v0.9.341] 두 번 깜빡 — 2.4초마다 짧게 두 번 완전히 꺼졌다 켜진다(사장님 확정 「나」안).
   ※ 예전 확정(최소 0.5 까지만 흐려짐)은 사장님 지시로 대체됐다. */
@keyframes htDepBlink{0%,66%{opacity:1}67%,72%{opacity:0}73%,78%{opacity:1}79%,84%{opacity:0}85%,100%{opacity:1}}

.ht-slider-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:32px;height:32px;border-radius:50%;border:1px solid var(--nx-line-strong);
  background:rgba(0,0,0,.55);color:var(--color-text,#e8f5e0);font-size:18px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center}
.ht-slider-nav:hover{border-color:var(--color-accent,#53FC18);color:var(--color-accent,#53FC18)}
.ht-slider-nav[hidden]{display:none}
.ht-slider-nav.prev{left:-6px}
.ht-slider-nav.next{right:-6px}

/* [v0.9.261] 갤러리형 탭 가로형(먹튀 확정) — 썸네일 왼쪽 좁게 + 제목/설명/메타 오른쪽. */
.ht-hrows{display:flex;flex-direction:column;gap:10px}
.ht-hrow{display:flex;gap:12px;text-decoration:none;align-items:flex-start;
  border:1px solid var(--nx-line);border-radius:12px;padding:10px;
  background:var(--nx-fill-soft);transition:border-color .15s}
.ht-hrow:hover{border-color:var(--color-accent,#53FC18)}
/* [v0.9.263] 4:3 -> 1:1. 갤러리형 권장 크기(400x400 정사각)·게시판 페이지(.pt-thumb 1:1)와
   같은 비율이라야 같은 이미지가 두 화면에서 다르게 보이지 않는다. v0.9.261 의 내 실수 교정. */
.ht-hrow-thumb{flex:0 0 108px;width:108px;aspect-ratio:1/1;border-radius:8px;overflow:hidden;
  background:rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center}
.ht-hrow-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ht-hrow-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.ht-hrow-title{color:var(--color-text,#e8f5e0);font-size:14px;font-weight:700;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-hrow:hover .ht-hrow-title{color:var(--color-accent,#53FC18)}
.ht-hrow-sum{color:rgba(232,245,224,.82);font-size:12px;line-height:1.55;white-space:pre-wrap;
  word-break:break-word;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.ht-hrow-meta{color:var(--color-muted,#8a9a82);font-size:12px}

/* [v0.9.264] 보증업체 상세 카드 — 글 상세(post_view) 본문 위에 표시.
   값이 없는 항목은 서버가 아예 안 그리므로 여기엔 '있을 때' 모양만 정의한다.
   색은 기존 테마 변수(--color-accent 등)를 그대로 쓴다. */
.pi-card{border:1px solid rgba(83,252,24,.28);border-radius:18px;overflow:hidden;margin:0 0 18px;
  background:linear-gradient(145deg,rgba(14,25,18,.98),rgba(5,10,7,.99))}
.pi-head{position:relative;padding:24px 22px 18px;border-bottom:1px solid rgba(83,252,24,.16);
  background:radial-gradient(circle at 82% 18%,rgba(83,252,24,.16),transparent 36%)}
.pi-badge{position:absolute;top:16px;right:16px;padding:6px 11px;border-radius:999px;
  color:var(--nx-on-accent,#041208);background:var(--color-accent,#53FC18);font-size:12px;font-weight:800}
.pi-eyebrow{margin-bottom:7px;color:var(--color-accent,#53FC18);font-size:11px;font-weight:800;letter-spacing:.14em}
.pi-name{margin:0;color:#fff;font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1.25}
.pi-desc{margin:9px 0 0;color:var(--color-muted,#8a9a82);font-size:13px;line-height:1.6}
.pi-body{padding:18px;display:flex;flex-direction:column;gap:12px}
.pi-sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pi-item{min-width:0;padding:14px;border:1px solid var(--nx-line-soft);border-radius:14px;
  background:var(--nx-fill-soft)}
.pi-featured{border-color:rgba(83,252,24,.28);background:rgba(83,252,24,.05)}
.pi-label{margin-bottom:7px;color:#9fb1a5;font-size:12px;font-weight:700}
.pi-val{color:var(--color-text,#e8f5e0);font-size:14px;line-height:1.65;white-space:pre-wrap;word-break:break-word}
.pi-deposit{color:var(--color-accent,#53FC18);font-size:22px;font-weight:800;letter-spacing:-.03em}
.pi-join{display:inline-flex;align-items:center;gap:6px;padding:10px 13px;border-radius:11px;
  color:var(--nx-on-accent,#05150a);background:var(--color-accent,#53FC18);font-weight:800;text-decoration:none}
.pi-join:hover{filter:brightness(1.07)}
.pi-code-wrap{display:flex;gap:8px;align-items:stretch}
.pi-code{flex:1;min-width:0;padding:9px 12px;display:flex;align-items:center;border-radius:11px;
  border:1px solid rgba(83,252,24,.24);color:var(--color-accent,#53FC18);background:rgba(83,252,24,.06);
  font-size:15px;font-weight:800;letter-spacing:.05em;word-break:break-all}
.pi-copy{flex:0 0 auto;padding:0 13px;border-radius:11px;cursor:pointer;
  border:1px solid rgba(83,252,24,.22);color:#dfffe8;background:rgba(83,252,24,.08);font-size:12px;font-weight:700}
.pi-copy:hover{border-color:rgba(83,252,24,.4);background:rgba(83,252,24,.14)}
.pi-copy-msg{min-height:16px;margin-top:6px;color:var(--color-muted,#8a9a82);font-size:11px}
.pi-block{padding:14px;border:1px solid var(--nx-line-soft);border-radius:14px;background:var(--nx-fill-soft)}
.pi-block-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px;flex-wrap:wrap}
.pi-block-title{margin:0;color:#effff3;font-size:14px;font-weight:800}
.pi-note{color:#65776c;font-size:11px}
.pi-cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pi-cat{min-width:0;padding:12px;border:1px solid rgba(83,252,24,.12);border-radius:12px;background:var(--nx-fill-soft)}
.pi-cat-name{margin-bottom:9px;color:#f3fff6;font-size:13px;font-weight:800}
.pi-chips{display:flex;flex-wrap:wrap;gap:6px}
.pi-chip{padding:5px 9px;border-radius:999px;border:1px solid rgba(83,252,24,.18);
  color:#cfffe6;background:rgba(83,252,24,.05);font-size:11px;font-weight:700;line-height:1.25}
.pi-lim{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;
  padding:7px 9px;border-radius:9px;border:1px solid var(--nx-fill);background:rgba(0,0,0,.16)}
.pi-lim-k{color:var(--color-muted,#8a9a82);font-size:10px;font-weight:800}
.pi-lim-v{color:var(--color-text,#e8f5e0);font-size:12px;font-weight:800;text-align:right;word-break:break-all}
.pi-max{color:var(--color-accent,#53FC18)}

/* 갤러리형(먹튀 확정 등) */
.ht-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ht-tile{display:flex;flex-direction:column;gap:6px;text-decoration:none}
.ht-tile-thumb{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;
  border-radius:10px;overflow:hidden;background:rgba(0,0,0,.25);border:1px solid var(--nx-line)}
.ht-tile-thumb img{width:100%;height:100%;object-fit:cover}
.ht-tile-title{color:var(--color-text,#e8f5e0);font-size:13px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht-tile:hover .ht-tile-title{color:var(--color-accent,#53FC18)}

@media (max-width:900px){
  .ht-head{padding:0 8px}
  .ht-tab{padding:11px 10px;font-size:13px}
  .ht-body{padding:10px}
  .ht-cards{grid-template-columns:repeat(2,1fr)}
  /* [v0.9.264] 보증업체 카드 모바일: 요약 3칸→1칸, 분류 4칸→2칸 */
  .pi-sum{grid-template-columns:1fr}
  .pi-grid{grid-template-columns:1fr}
  .pi-cats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pi-head{padding:20px 16px 16px}
  .pi-name{font-size:22px}
  .pi-body{padding:14px}
  /* [v0.9.261] 모바일은 사장님 확정대로 2개씩. 슬라이더 한 칸 = (100% - gap) / 2 */
  .ht-slider-track > .ht-card{flex:0 0 calc((100% - 12px) / 2)}
  /* ★[v0.9.346] 모바일 보증사이트 카드 — 제목과 보증금을 다시 '같은 줄'로(사장님 지시).
     ★v0.9.345 는 배지를 아랫줄로 내렸는데 사장님이 「생각한 것과 다르다」고 하셨다.
       그래서 한 줄로 되돌리되, 제목이 잘리던 원래 문제를 배지 쪽을 줄여서 푼다.
     ★줄인 것: 배지 글자 12.5 → 11px · 방패 16 → 13px · 안쪽 여백 3px 9px → 1px 4px ·
       글자 사이 5 → 2px · 「금」 한 글자 숨김 · 머리줄/제목 좌우 여백 · 제목 14 → 12.5px.
       → 배지 폭 100 → 67px, 제목이 쓸 수 있는 폭 38 → 89px(한글 약 7자).
     ★[v0.9.347] 검은 여백이 많아 보인다는 사장님 지적으로 안쪽 여백을 한 번 더 줄였다
       (2px 5px → 1px 4px, 글자 사이 3 → 2px). 배지 70×27 → 67×25.
     ★[v0.9.348] 이어서 '세로 높이'를 줄였다(사장님 지시).
       ★실측으로 밝힌 원인: 머리줄 38px 중 38px 전부가 제목 몫이었다
         (위 여백 8 + 줄 높이 20 + 아래 여백 10). 배지는 25px 라 높이에 영향이 없었다.
       ★머리줄 38 → 30 (제목 여백 6/7 · 줄 높이 17)
       ★보증칸 25 → 21 (배지 글자 줄 높이 1.25)
       ★입금칸 36 → 28 (위아래 여백 5/7 · 글자 줄 높이 1.3)
       ★카드 전체 193 → 176
       ※ 줄 높이를 1 로 만들면 배지가 overflow:hidden 이라 한글 아래가 잘릴 수 있다.
         1.2~1.25 는 실측에서 잘림이 없음을 확인하고 채택했다(글자 14px < 검은칸 16px).
       ※ 좌우 여백은 사장님 요청 범위가 아니라 그대로 둔다.
     ★줄이지 않은 것: 초록 테두리 2.5px (1.5px 는 안 보인다고 하셨다 — ERR-39).
     ★PC(901px 이상)는 이 규칙이 적용되지 않아 「보증금 5억」·12.5px 그대로다.
     ※ 위쪽의 .ht-card-title / .ht-card-head 원본 규칙은 손대지 않고 여기서만 덮어쓴다. */
  .ht-card-head{align-items:center;gap:5px;padding:0 6px 0 0}
  .ht-card-head > .ht-card-title{font-size:12.5px;padding:6px 5px 7px;line-height:17px}
  .ht-dep .ht-dep-in{gap:2px;padding:1px 4px}
  .ht-dep .ht-dep-ico{width:13px;height:13px}
  .ht-dep .ht-dep-txt{font-size:11px;line-height:1.25}
  .ht-pay{padding:5px 11px 7px}
  .ht-pay-lb,.ht-pay-it{line-height:1.3}
  .ht-dep-gum{display:none}
  .ht-hrow-thumb{flex:0 0 88px;width:88px}
  .ht-tiles{grid-template-columns:repeat(2,1fr)}
  /* [v0.9.266] 모바일은 칸 폭을 줄이고 조회 칸은 계속 감춘다(기존 정책 유지). */
  .ht-row-meta{gap:6px}
  .ht-row-author{flex:0 0 62px;width:62px}
  .ht-row-date{flex:0 0 74px;width:74px}
  .ht-row-rec{flex:0 0 46px;width:46px}
  .ht-row-view{display:none}
}

/* ============================================================
   [v0.9.320] 회원 프로필 팝업 — 닉네임을 누르면 뜨는 카드
   ★기존 목록·배지·작성자 칸 규칙은 한 줄도 건드리지 않는다.
     여기서 새로 만드는 이름(pf-)만 쓴다.
   ★움직이는 효과는 넣지 않는다 — 사장님이 확정한 방침(깜빡임 삭제)과 같은 결.
   ============================================================ */
[data-mid]{cursor:pointer}
[data-mid]:hover{text-decoration:underline}
body.pf-open{overflow:hidden}
.pf-back{display:none}
.pf-back.is-open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1299}
.pf-sheet{display:none}
.pf-sheet.is-open{display:flex;flex-direction:column;position:fixed;z-index:1300;
  left:50%;top:50%;transform:translate(-50%,-50%);
  width:360px;max-width:calc(100vw - 32px);max-height:86vh;
  background:#0d120a;border:1px solid rgba(83,252,24,.35);border-radius:14px;
  box-shadow:0 10px 40px rgba(0,0,0,.6);overflow:hidden}
/* [v0.9.326] 상단 로고 띠 — 사이트 로고를 그대로 가져와 쓴다(가로 3:1 이라 원 안에 넣으면 뭉개진다). */
.pf-brand{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 12px;background:#080b08;border-bottom:1px solid var(--nx-line-soft)}
.pf-logo{display:block;width:132px;height:auto;max-height:34px;object-fit:contain}
.pf-logo-t{font-size:16px;font-weight:800;letter-spacing:.4px;color:var(--color-accent,#53FC18)}
.pf-x{appearance:none;-webkit-appearance:none;background:none;border:0;padding:2px 4px;
  font-size:15px;line-height:1;color:var(--color-muted,#8a9a82);cursor:pointer}
.pf-x:hover{color:var(--color-text,#e8f5e0)}
/* [v0.9.327] 원형 아바타를 빼고 구도를 다시 잡았다 —
     레벨 배지 + 닉네임을 한 줄로 가운데 모으고, 그 아래 가입 경과일·경험치까지 한 덩어리. */
.pf-head{padding:16px 16px 14px;text-align:center}
.pf-line{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.pf-lv{flex:0 0 auto;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:800;
  color:var(--nx-on-accent,#0b0f08);background:var(--color-accent,#53FC18);
  box-shadow:0 0 7px 1px rgba(83,252,24,.42)}
.pf-nick{min-width:0;font-size:19px;font-weight:800;color:var(--color-text,#e8f5e0);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-sub2{margin-top:6px;font-size:12px;color:var(--color-muted,#8a9a82)}
.pf-body{flex:1;min-height:0;overflow-y:auto}
/* 경험치 진행 */
.pf-exp{margin-top:14px;text-align:left}
.pf-exp-top{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px;font-size:11.5px}
.pf-exp-k{color:var(--color-muted,#8a9a82)}
.pf-exp-v{color:var(--color-accent,#53FC18);font-weight:700}
.pf-bar{height:7px;border-radius:999px;background:var(--nx-line-soft);overflow:hidden}
.pf-bar-in{height:100%;background:var(--color-accent,#53FC18);transition:width .25s ease}
/* 통계 4칸 */
.pf-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--nx-line-soft);border-top:1px solid var(--nx-line-soft);
  border-bottom:1px solid var(--nx-line-soft)}
.pf-st{background:#0d120a;padding:11px 3px;text-align:center}
.pf-st-n{font-size:15px;font-weight:800;color:var(--color-text,#e8f5e0)}
.pf-st-n.pf-accent{color:var(--color-accent,#53FC18)}
.pf-st-k{margin-top:2px;font-size:11px;color:var(--color-muted,#8a9a82)}
.pf-rows{display:flex;flex-direction:column;gap:6px;padding:12px 16px;
  border-bottom:1px solid var(--nx-line-soft)}
.pf-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pf-k{font-size:12.5px;color:var(--color-muted,#8a9a82)}
.pf-v{font-size:13px;font-weight:700;color:var(--color-text,#e8f5e0)}
.pf-v.pf-accent{color:var(--color-accent,#53FC18)}
.pf-sec{padding:12px 16px 0}
.pf-h{margin:0 0 6px;font-size:12.5px;font-weight:800;color:var(--color-muted,#8a9a82)}
.pf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.pf-item{display:block;padding:6px 8px;border-radius:8px;text-decoration:none;
  background:var(--nx-fill-soft)}
.pf-item:hover{background:rgba(83,252,24,.08)}
.pf-t{display:block;font-size:12.5px;line-height:1.4;color:var(--color-text,#e8f5e0);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-sub{display:block;font-size:11px;color:var(--color-muted,#8a9a82);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-d{display:block;font-size:11px;color:var(--color-muted,#8a9a82)}
.pf-empty{margin:0;padding:8px 16px;font-size:12.5px;color:var(--color-muted,#8a9a82)}
/* [v0.9.326] 비로그인 안내 — 서버가 401 을 줄 때만 나온다. */
.pf-need{padding:30px 24px 20px;text-align:center}
.pf-need-i{width:56px;height:56px;margin:0 auto 16px;border-radius:50%;font-size:24px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(83,252,24,.10);border:1px solid rgba(83,252,24,.35)}
.pf-need-t{font-size:15px;font-weight:700;color:var(--color-text,#e8f5e0)}
.pf-need-s{margin-top:6px;font-size:12.5px;line-height:1.6;color:var(--color-muted,#8a9a82)}
.pf-go{display:block;margin-top:18px;padding:11px;border-radius:10px;text-align:center;
  text-decoration:none;font-size:13px;font-weight:800;color:var(--nx-on-accent,#0b0f08);
  background:var(--color-accent,#53FC18)}
.pf-foot{padding:10px 16px;border-top:1px solid var(--nx-line-soft)}
.pf-close{width:100%;padding:10px;border:0;border-radius:10px;cursor:pointer;
  font-size:13px;font-weight:800;color:var(--nx-on-accent,#0b0f08);background:var(--color-accent,#53FC18)}
/* ★모바일은 아래에서 올라오는 바텀시트 — 엄지로 닫기 쉽다.
     아이폰 홈바(safe-area)만큼 아래 여백을 더 준다. */
@media (max-width:640px){
  .pf-sheet.is-open{left:0;right:0;bottom:0;top:auto;transform:none;
    width:100%;max-width:100%;max-height:88vh;
    border-radius:16px 16px 0 0;border-left:0;border-right:0;border-bottom:0}
  .pf-foot{padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
  .pf-nick{font-size:18px}
  .pf-st-k{font-size:10.5px}
}

/* ============================================================================
   CS-26 NEXIVON Intelligence — 화이트 에디토리얼 컴포넌트 오버라이드
   목적: 레거시 다크/네온 리터럴(회귀 핀 보존을 위해 위쪽에 그대로 둔다)을
        화이트 테마에서 토큰 기반으로 재도장한다.
   원리: 파일 뒤쪽의 동일 명시도 규칙이 캐스케이드에서 승리 → 핀 문자열은 위에
        그대로 남아 scripts/check.py 회귀 GREEN, 렌더는 에디토리얼 화이트.
   토큰 기반이므로 legacy_dark 프리셋 선택 시에도 자연스럽게 어울린다(네온 글로우만 평면화).
   ============================================================================ */

/* ---- 레벨/랭크 배지 — 네온 글로우 제거, 포인트색 칩 ---- */
.lv-badge,.mw-lv-badge{
  background:var(--nx-tint);border:1px solid var(--nx-line);
  box-shadow:none;color:var(--color-accent)}
.pf-lv{background:var(--nx-tint);border:1px solid var(--nx-line);box-shadow:none;color:var(--color-accent)}
.side-wallet .wallet-level{background:var(--nx-tint);border-color:var(--nx-line);box-shadow:none}
.mobile-wallet{border-top:1px solid var(--nx-line-soft)}

/* ---- 플래시/상태 메시지 ---- */
.flash-success{background:color-mix(in srgb,var(--nx-positive) 10%,transparent);
  border-color:color-mix(in srgb,var(--nx-positive) 32%,transparent);color:var(--color-text)}

/* ---- 인용/본문 ---- */
.rich-content blockquote{border-left:3px solid var(--color-accent);
  background:var(--nx-surface-soft);color:var(--color-text)}

/* ---- 커머스 칩 ---- */
.cmall-cat-n{background:var(--nx-tint);color:var(--color-accent)}

/* ---- 슬롯 배지(다크 그라디언트 → 라이트 칩) ---- */
.slot-badge{background:var(--nx-surface-2);color:var(--color-muted);border:1px solid var(--nx-line-soft)}

/* ---- 공지 행(네온 테두리 → 은은한 포인트 톤) ---- */
.board-table tr.is-notice{background:var(--nx-tint-soft)}

/* ---- 로그아웃 도어(다크 링 → 은은한 서페이스 링, 호버 포인트색) ---- */
.logout .ring{background:var(--nx-surface-2);border:1px solid var(--nx-line)}
.logout .ring-in{background:var(--nx-surface-soft)}
.logout:hover .ring{background:color-mix(in srgb,var(--color-accent) 16%,var(--color-surface));
  box-shadow:0 0 0 3px var(--nx-tint-soft)}

/* ---- 회원 바(모바일 하단) ---- */
.member-bar{background:var(--color-surface);border-bottom:1px solid var(--nx-line)}

/* ---- 보증업체 배지 .ht-dep (검정 → 네이비, 러닝 빔 포인트색) ---- */
.ht-dep{background:var(--nx-brand)}
.ht-dep .ht-dep-in{background:var(--nx-brand)}
.ht-dep .ht-dep-beam .e-t,.ht-dep .ht-dep-beam .e-b{
  background:linear-gradient(90deg,transparent,var(--color-accent) 38%,#fff 50%,var(--color-accent) 62%,transparent)}
.ht-dep .ht-dep-beam .e-r,.ht-dep .ht-dep-beam .e-l{
  background:linear-gradient(180deg,transparent,var(--color-accent) 38%,#fff 50%,var(--color-accent) 62%,transparent)}

/* ---- 제휴사 정보 패널 pi-* (다크 표면 → 화이트) ---- */
.pi-card{background:var(--color-surface);border:1px solid var(--nx-line)}
.pi-head{background:var(--nx-surface-soft)}
.pi-featured{background:var(--nx-surface-soft)}
.pi-copy{background:var(--nx-surface-2);border-color:var(--nx-line);color:var(--color-text)}
.pi-copy:hover{border-color:var(--color-accent);background:var(--nx-tint)}
.pi-cat{background:var(--nx-tint);color:var(--color-accent)}
.pi-chip{background:var(--nx-surface-2);border-color:var(--nx-line);color:var(--color-muted)}

/* ---- 실적/증빙 피드 pf-* (다크 시트 → 화이트) ---- */
.pf-sheet,.pf-sheet.is-open{background:var(--color-surface);border-color:var(--nx-line)}
.pf-item:hover{background:var(--nx-surface-soft)}
.pf-need-i{background:var(--nx-tint);border-color:var(--nx-line);color:var(--color-accent)}
.pf-foot{border-top:1px solid var(--nx-line)}
.pf-st{background:var(--nx-surface-soft)}

/* ---- 트러스트월렛/USDT 카드 .wv-* : 파랑 유지, 인증 배지만 네온→긍정 그린 ---- */
.wv-card.is-verified::before{background:linear-gradient(90deg,var(--nx-positive),var(--nx-mining))}
.wv-notice{border-color:var(--nx-line)}

/* ---- USDT 마이닝 강조(§21: 네온 아님, 딥 틸) — 공용 유틸 클래스 ---- */
.nx-mining-accent{color:var(--nx-mining)}
.nx-mining-chip{background:var(--nx-mining-tint);color:var(--nx-mining);border:1px solid color-mix(in srgb,var(--nx-mining) 30%,transparent)}