/* =====================================================================
   체인지리더스 「멤버스 클럽」 시험판 스킨 — 1단계: 뼈대(배경·메뉴·상단바·색·글꼴)
   대표님 2026-10-14 확정. 모든 규칙은 html.cl-club 아래 → 시험판(?skin=club) 켠 기기에서만 보임.
   끄기: ?skin=off
   ===================================================================== */
html.cl-club{
  --primary:#5B1A26; --primary-light:#9A4A5A; --primary-soft:#F4EAE6; --primary-dark:#3E0F19;
  --text:#1C1A17; --text-sub:#6F675C; --text-light:#A39A8C;
  --border:#DCD3C3; --border-light:#EAE3D6;
  --bg:#F3EEE5; --bg-card:#FBF8F2;
  --club-paper:#F3EEE5; --club-card:#FBF8F2; --club-ink:#1C1A17; --club-wine:#5B1A26; --club-gold:#B8925A; --club-gold2:#D9BE8C;
  --club-serif:'SUIT Variable','SUIT','Pretendard Variable',Pretendard,sans-serif; --club-en:'SUIT Variable','SUIT','Pretendard Variable',Pretendard,sans-serif;
  background:#F3EEE5;
}
/* 배경: 오로라 → 종이 질감 */
html.cl-club body::before{
  background:#F3EEE5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.3 0 0 0 0 0.22 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") !important;
}
html.cl-club body{color:#1C1A17;}

/* ── 사이드바 ── */
html.cl-club .sidebar{background:rgba(243,238,229,.86) !important;border-right:1px solid #DCD3C3 !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
html.cl-club .brand{border-bottom:1px solid #DCD3C3 !important;}
html.cl-club .brand-title,html.cl-club .brand-title .b1,html.cl-club .brand-title .b3,html.cl-club .brand-title .kr{color:#1C1A17 !important;font-family:var(--club-serif) !important;}
html.cl-club .brand-title .b2{background:none !important;-webkit-text-fill-color:#5B1A26 !important;color:#5B1A26 !important;animation:none !important;}
html.cl-club .brand-plane{display:none !important;}
/* 묶음 제목 = 작은 대문자풍 */
html.cl-club #sidebar .nav-section-title,
html.cl-club #sidebar .dfj-mission-label,
html.cl-club #sidebar .dfj-plaza-side-label{
  font-size:11px !important;letter-spacing:.14em !important;font-weight:700 !important;color:#8F8577 !important;
  text-transform:none !important;background:none !important;padding:16px 12px 6px !important;margin:0 !important;border:0 !important;
}
html.cl-club #sidebar .nav-section-title .live-dot{display:none !important;}
/* 메뉴 항목: 아이콘 칩 → 작은 점, 선택 = 검정 알약 */
html.cl-club #sidebar .nav-item.cl-nav{
  color:#3D3830 !important;font-weight:600 !important;font-size:14.5px !important;border-radius:9px !important;
  padding:8px 12px !important;background:transparent !important;border:1px solid transparent !important;box-shadow:none !important;
}
html.cl-club #sidebar .nav-item.cl-nav:hover{background:rgba(255,255,255,.55) !important;}
html.cl-club #sidebar .cl-nav-ic{
  width:6px !important;height:6px !important;flex:0 0 6px !important;border-radius:50% !important;margin-right:12px !important;
  background:currentColor !important;opacity:.35;font-size:0 !important;filter:none !important;box-shadow:none !important;
}
html.cl-club #sidebar .nav-item.cl-nav.active,
html.cl-club #sidebar .nav-item.cl-nav[aria-current="page"]{background:#1C1A17 !important;color:#F3EEE5 !important;}
html.cl-club #sidebar .nav-item.cl-nav.active .cl-nav-ic{background:#D9BE8C !important;opacity:1;}
/* 반짝이·하이라이트 효과 끄기 (차분하게) */
html.cl-club #sidebar [class*="-shine"]::before,html.cl-club #sidebar [class*="-shine"]::after{display:none !important;}
html.cl-club #sidebar .dfj-mission-highlight,html.cl-club #sidebar .dfj-plaza-highlight{background:transparent !important;border:0 !important;box-shadow:none !important;}
/* NEW·HOT 배지: 작고 조용하게 / MUST만 와인색 */
html.cl-club #sidebar .badge-new,html.cl-club #sidebar .badge-soon,html.cl-club #sidebar .badge-live{
  background:transparent !important;color:#A39A8C !important;border:0 !important;font-size:10px !important;font-weight:700 !important;letter-spacing:.06em;padding:0 !important;box-shadow:none !important;animation:none !important;
}
html.cl-club #sidebar .badge-must{background:#5B1A26 !important;color:#F3E6CF !important;border:0 !important;font-size:10px !important;animation:none !important;}

/* ── 상단바 ── */
html.cl-club .topbar{background:rgba(243,238,229,.92) !important;border-bottom:1px solid #1C1A17 !important;box-shadow:none !important;backdrop-filter:blur(6px);}
html.cl-club .topbar-title{font-family:var(--club-serif) !important;font-weight:700 !important;color:#1C1A17 !important;letter-spacing:-.4px;}
html.cl-club .topbar-sub{color:#6F675C !important;}

/* ── 공통 버튼 색 (보라 → 와인) ── */
html.cl-club .btn-primary,html.cl-club button.primary{background:#5B1A26 !important;border-color:#5B1A26 !important;color:#F7EFE3 !important;}

/* 광장·출석 메뉴의 빨간 왼쪽 줄 끄기 (기존 강조 규칙 덮기) */
html.cl-club #sidebar .nav-item.cl-nav[data-route]:not(.active){box-shadow:none !important;}

/* 폰 맨 아래 메뉴줄: 흰 바탕·알록달록 → 종이색·잉크 (2단계 뼈대 보강, 10/14) */
html.cl-club .cl-mtabbar{background:rgba(243,238,229,.96) !important;border-top:1px solid #DCD3C3 !important;box-shadow:0 -8px 20px -14px rgba(28,26,23,.35) !important;backdrop-filter:blur(8px)}
html.cl-club .cl-mtab{color:#A39A8C !important}
html.cl-club .cl-mtab .dot{filter:grayscale(1) opacity(.55);background:transparent !important}
html.cl-club .cl-mtab.on{color:#1C1A17 !important}
html.cl-club .cl-mtab.on .dot{filter:none;background:#1C1A17 !important;box-shadow:0 6px 14px -8px rgba(28,26,23,.7)}

/* 왼쪽 메뉴 맨 위 로고: 새 앱 아이콘(와인+금색 CL)을 작게 — 대표님 10/14 */
html.cl-club .brand{align-items:center !important;gap:12px !important}
html.cl-club .brand::before{content:"";width:44px;height:44px;flex:0 0 44px;border-radius:11px;background:url(/cl-logo-mark-120.png) center/cover no-repeat;box-shadow:0 8px 16px -10px rgba(91,26,38,.7)}
/* 🩹 2026-10-14 사이드바 로고 글자 삐져나감 → 칸에 맞게 (240px 사이드바: 마크 40 + 글자 18px≈126px) */
html.cl-club .brand{gap:10px !important;padding:0 10px 16px !important;flex-shrink:0 !important}  /* overflow:hidden 쓰면 세로로 눌려 위가 잘림(10/14) */
html.cl-club .brand::before{width:40px !important;height:40px !important;flex:0 0 40px !important;border-radius:10px !important}
html.cl-club .brand > div{min-width:0;flex:1 1 auto}
html.cl-club .brand-title{font-size:18px !important;letter-spacing:-0.7px !important;white-space:nowrap}
html.cl-club .brand-title .kr{font-size:12.5px !important;display:block;margin-top:3px}
html.cl-club .sidebar{overflow-x:hidden !important}  /* 로고가 넘쳐 메뉴 전체가 왼쪽으로 밀려 잘리던 것 방지 */
/* ⭐ 자주 쓰는 메뉴(체리 광장·미션·전체 도구) 은은하게 강조 — 10/14 대표님 "눈에 잘 들어오게, 조화롭게, 튀지 않게" */
html.cl-club #sidebar .nav-item.cl-nav[data-route="plaza"]:not(.active),
html.cl-club #sidebar .nav-item.cl-nav[data-route="missions"]:not(.active),
html.cl-club #sidebar .nav-item.cl-nav[data-route="tools"]:not(.active){
  background:rgba(91,26,38,.06) !important;border:1px solid rgba(91,26,38,.14) !important;color:#5B1A26 !important;font-weight:800 !important;margin:2px 0 !important;
}
html.cl-club #sidebar .nav-item.cl-nav[data-route="plaza"]:not(.active):hover,
html.cl-club #sidebar .nav-item.cl-nav[data-route="missions"]:not(.active):hover,
html.cl-club #sidebar .nav-item.cl-nav[data-route="tools"]:not(.active):hover{background:rgba(91,26,38,.1) !important;}
html.cl-club #sidebar .nav-item.cl-nav[data-route="plaza"]:not(.active) .cl-nav-ic,
html.cl-club #sidebar .nav-item.cl-nav[data-route="missions"]:not(.active) .cl-nav-ic,
html.cl-club #sidebar .nav-item.cl-nav[data-route="tools"]:not(.active) .cl-nav-ic{background:#C9A25E !important;opacity:1 !important;width:7px !important;height:7px !important;flex-basis:7px !important;}
