/* ==========================================================================
   코린이 (corin2) 레이아웃 — 코인판식 커뮤니티 껍데기
   파란 브랜드(#2f6fed) / Pretendard / 헤더+상단카테고리+우측사이드바+푸터
   ========================================================================== */
/* Pretendard는 레이아웃 head의 preconnect+link로 로드(렌더블로킹 완화) */

:root {
	--cp-brand: #2f6fed; --cp-brand-h: #1f5fd6;
	--cp-ink: #1f2933; --cp-sub: #6b7684; --cp-faint: #6b7280;
	--cp-bg: #f4f5f7; --cp-panel: #fff; --cp-line: #e4e7eb; --cp-head-bg: #fff;
}
html.dark, html.rx_dark {
	--cp-brand: #4c8dff; --cp-brand-h: #3b7ae0;
	--cp-ink: #d8e1eb; --cp-sub: #8b949e; --cp-faint: #8b949e;
	--cp-bg: #0d1117; --cp-panel: #161b22; --cp-line: #232a33; --cp-head-bg: #10151c;
}

body {
	margin: 0; background: var(--cp-bg); color: var(--cp-ink);
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
	font-size: 13px; letter-spacing: -0.01em; line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
a { color: inherit; }

/* ── 헤더 ── */
.cp-head { background: var(--cp-head-bg); border-bottom: 1px solid var(--cp-line); position: sticky; top: 0; z-index: 100; }
.cp-head-inner { max-width: 1280px; margin: 0 auto; padding: 0 16px; height: 56px; display: flex; align-items: center; gap: 20px; }
.cp-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; font-size: 20px; font-weight: 900; color: var(--cp-brand); flex-shrink: 0; }
.cp-logo img { width: 30px; height: 30px; }
.cp-gnb { flex: 1; min-width: 0; overflow-x: auto; }
/* 데스크톱: 메뉴 5칸이라 가로스크롤 불필요 — overflow를 풀어야 드롭다운 패널이 잘리지 않음 */
@media (min-width: 901px){ .cp-gnb{ overflow: visible; } }
.cp-gnb ul { display: flex; align-items: center; gap: 1px; list-style: none; margin: 0; padding: 0; white-space: nowrap; }
.cp-gnb li a { display: inline-block; padding: 8px 8px; font-size: 13px; font-weight: 600; color: var(--cp-sub); text-decoration: none; border-radius: 6px; }
.cp-gnb li a:hover { color: var(--cp-brand); background: rgba(47,111,237,.06); }
.cp-gnb li.on a { color: var(--cp-brand); font-weight: 700; }
.cp-account { display: flex; align-items: center; gap: 8px; flex-shrink: 0; font-size: 13px; }
.cp-account a { text-decoration: none; color: var(--cp-sub); font-weight: 600; white-space: nowrap; }
.cp-account a:hover { color: var(--cp-ink); }
.cp-account .cp-join { background: var(--cp-brand); color: #fff; padding: 7px 14px; border-radius: 6px; }
.cp-account .cp-join:hover { background: var(--cp-brand-h); color: #fff; }
.cp-account .cp-nick { font-weight: 700; color: var(--cp-ink); }

/* ── 본문 + 사이드바 ── */
.cp-body { max-width: 1280px; margin: 20px auto; padding: 0 16px; display: flex; gap: 20px; align-items: flex-start; }
.cp-content { flex: 1; min-width: 0; background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 10px; padding: 20px; }
.cp-side { width: 280px; flex-shrink: 0; display: flex; flex-direction: column; gap: 14px; }
.cp-card { background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 10px; padding: 14px; }
.cp-card-head { font-size: 13px; font-weight: 800; color: var(--cp-ink); margin-bottom: 10px; padding-bottom: 8px; border-bottom: 2px solid var(--cp-brand); }
.cp-side-link { display: block; padding: 9px 10px; border-radius: 8px; text-decoration: none; color: var(--cp-ink); font-weight: 600; font-size: 13px; }
.cp-side-link:hover { background: rgba(47,111,237,.06); color: var(--cp-brand); }
.cp-side-note { color: var(--cp-sub); font-size: 12.5px; margin: 0 0 12px; line-height: 1.6; }
.cp-side-btn { display: block; text-align: center; background: var(--cp-brand); color: #fff; padding: 10px; border-radius: 8px; font-weight: 700; text-decoration: none; font-size: 13px; }
.cp-side-btn:hover { background: var(--cp-brand-h); }

/* ── 실시간 시세 위젯 ── */
.cp-ticker .cp-card-head { display: flex; align-items: center; }
.cp-ticker-src { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--cp-faint); }
.cp-ticker-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #1e8e3e; margin-left: 5px; animation: cpPulse 1.5s infinite; }
@keyframes cpPulse { 0%,100%{opacity:1;} 50%{opacity:.25;} }
.cp-ticker ul { list-style: none; margin: 0; padding: 0; }
.cp-ticker li { display: flex; align-items: center; gap: 8px; padding: 7px 2px; border-bottom: 1px solid var(--cp-line); font-size: 12.5px; }
.cp-ticker li:last-child { border-bottom: none; }
.cp-ticker .cp-tk-loading { color: var(--cp-faint); justify-content: center; }
.cp-tk-name { font-weight: 600; color: var(--cp-ink); flex: 1; white-space: nowrap; }
.cp-tk-price { color: var(--cp-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cp-tk-rate { width: 58px; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.cp-tk-rate.up { color: #d92d33; }
.cp-tk-rate.dn { color: #1e8e3e; }

/* ── 홈 포털 대시보드 ── */
.cp-home { display: flex; flex-direction: column; gap: 16px; }
.cp-home-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.cph-metric { display: flex; flex-direction: column; gap: 3px; padding: 14px; border: 1px solid var(--cp-line); border-radius: 10px; background: var(--cp-panel); text-decoration: none; color: inherit; transition: border-color .12s; }
.cph-metric:hover { border-color: var(--cp-brand); }
.cph-lbl { font-size: 11.5px; font-weight: 600; color: var(--cp-sub); }
.cph-val { font-size: 22px; font-weight: 800; color: var(--cp-ink); line-height: 1.1; font-variant-numeric: tabular-nums; }
.cph-metric.up .cph-val { color: #d92d33; }
.cph-metric.dn .cph-val { color: #1e8e3e; }
.cph-sub { font-size: 11px; color: var(--cp-faint); font-variant-numeric: tabular-nums; }
.cph-coins { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.cph-coin { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--cp-line); border-radius: 9px; background: var(--cp-panel); }
.cph-cn { font-size: 12px; font-weight: 700; color: var(--cp-ink); }
.cph-cp { font-size: 14px; font-weight: 700; color: var(--cp-ink); font-variant-numeric: tabular-nums; }
.cph-cu { font-size: 11px; color: var(--cp-sub); font-variant-numeric: tabular-nums; }
.cph-cu em { font-style: normal; font-size: 9.5px; color: var(--cp-faint); font-weight: 700; }
.cph-cc { font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.cph-cc.up { color: #d92d33; } .cph-cc.dn { color: #1e8e3e; }
.cp-home-posts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cph-postcol { background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 10px; padding: 4px 14px 12px; }
.cph-h { font-size: 14px; font-weight: 800; color: var(--cp-ink); margin: 12px 2px 8px; padding-bottom: 8px; border-bottom: 2px solid var(--cp-brand); }
.cph-list { list-style: none; margin: 0; padding: 0; }
.cph-list li { border-bottom: 1px solid var(--cp-line); }
.cph-list li:last-child { border-bottom: none; }
.cph-list li a { display: block; padding: 8px 2px; text-decoration: none; color: inherit; }
.cph-list li a:hover .cph-t { color: var(--cp-brand); text-decoration: underline; }
.cph-bd { display: inline-block; font-size: 10.5px; font-weight: 700; color: var(--cp-brand); background: rgba(47,111,237,.08); border-radius: 4px; padding: 1px 6px; margin-right: 6px; vertical-align: middle; }
.cph-t { font-size: 13px; font-weight: 500; color: var(--cp-ink); }
.cph-cmt { font-size: 11.5px; font-weight: 700; color: #d92d33; margin-left: 4px; }
.cph-meta { display: block; font-size: 11px; color: var(--cp-faint); margin-top: 3px; }
.cph-load { padding: 12px 2px; color: var(--cp-faint); font-size: 12.5px; list-style: none; }
.cph-tools { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.cph-tool { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 13px; border-radius: 10px; background: var(--cp-brand); color: #fff; font-weight: 700; font-size: 13px; text-decoration: none; }
.cph-tool:hover { background: var(--cp-brand-h); }
@media (max-width: 640px) {
	.cp-home-metrics { grid-template-columns: repeat(2, 1fr); }
	.cph-coins { grid-template-columns: repeat(2, 1fr); }
	.cp-home-posts { grid-template-columns: 1fr; }
	.cph-tools { grid-template-columns: repeat(2, 1fr); }
	.cph-val { font-size: 19px; }
}

/* ── 푸터 ── */
.cp-foot { border-top: 1px solid var(--cp-line); margin-top: 30px; background: var(--cp-head-bg); }
.cp-foot-inner { max-width: 1280px; margin: 0 auto; padding: 22px 16px; display: flex; flex-direction: column; gap: 6px; }
.cp-foot-brand { font-weight: 800; color: var(--cp-brand); font-size: 14px; }
.cp-foot-text { color: var(--cp-faint); font-size: 12px; }

/* ── 모바일 ── */
@media (max-width: 900px) {
	/* column 전환시 align-items:flex-start(데스크톱 잔재)가 자식을 max-content 폭으로 만들어
	   내부 고정폭(에디터 등)이 판을 밀었음 → stretch + width 강제 */
	.cp-body { flex-direction: column; align-items: stretch; }
	.cp-content { width: 100%; max-width: 100%; box-sizing: border-box; }
	.cp-side { width: 100%; flex-direction: row; flex-wrap: wrap; }
	.cp-card { flex: 1; min-width: 240px; }
}
@media (max-width: 600px) {
	.cp-head-inner { gap: 10px; padding: 0 12px; }
	.cp-logo span { display: none; }
	.cp-gnb li a { padding: 0 12px; font-size: 13px; min-height: 44px; display: inline-flex; align-items: center; }
	.cp-account .cp-login { display: none; }
	.cp-content { padding: 14px; border-radius: 8px; }
}

/* 야간루프 1회차: 회원 모듈(로그인/가입) 모바일 고정폭 해제 */
@media (max-width:600px) {
	.cp-content section.xm, .cp-content .xm { width: 100% !important; min-width: 0 !important; max-width: 100% !important; }
	.cp-content .xm input[type="text"], .cp-content .xm input[type="password"], .cp-content .xm input[type="email"],
	.cp-content .xm input[type="tel"], .cp-content .xm select { max-width: 100%; box-sizing: border-box; }
	.cp-content .xm fieldset, .cp-content .xm .x_control-group { max-width: 100%; }
}

/* 야간루프 1회차b: 모바일 본문 가로스크롤 안전망 (회원모듈 등 고정폭 잔재 클리핑) */
@media (max-width: 600px) {
	.cp-content { overflow-x: hidden; }
	.cp-content .xm li, .cp-content .xm ul { max-width: 100%; }
}

/* ============================================================
   야간루프 2회차 (Batch A): 모바일 헤더/회원폼/버튼/터치/다크 정비
   ============================================================ */

/* [mobile-ux high] GNB 우측 페이드 — '더 있다' 시각단서 */
@media (max-width: 900px){
  .cp-gnb{ -webkit-mask-image:linear-gradient(90deg,#000 80%,transparent); mask-image:linear-gradient(90deg,#000 80%,transparent); }
  .cp-gnb::-webkit-scrollbar{ height:0; }
}

/* [mobile-ux high] 모바일 로그인 진입점 복원 (기존 display:none 무력화) */
@media (max-width: 600px){
  .cp-account .cp-login{ display:inline-block !important; padding:7px 10px; font-size:13px; font-weight:700; color:var(--cp-brand); }
  .cp-account{ gap:6px; }
  .cp-account .cp-join{ padding:7px 12px; }
}

/* [designer high] 전역 버튼 통일 — 구 XE bevel(gradient/radius2) 제거 */
.cp-content .btn, .cp-content input[type="submit"], .cp-content button.btn, .cp-content .submit{
  display:inline-flex; align-items:center; justify-content:center;
  background:#eef1f5; background-image:none !important; box-shadow:none !important; text-shadow:none !important;
  border:1px solid var(--cp-line); border-radius:8px; min-height:40px; padding:0 16px;
  font-size:14px; font-weight:600; color:var(--cp-ink); text-decoration:none; cursor:pointer; line-height:1;
}
.cp-content .btn:hover{ border-color:var(--cp-brand); color:var(--cp-brand); }
.cp-content .btn-inverse, .cp-content input[type="submit"].btn-inverse, .cp-content .submit.btn-inverse{
  background:var(--cp-brand) !important; border-color:var(--cp-brand); color:#fff !important;
}
.cp-content .btn-inverse:hover{ background:var(--cp-brand-h) !important; color:#fff !important; }

/* [designer high] 회원 로그인/가입 카드 — Bootstrap2 잔재 → corin2 톤 */
.cp-content .signin{ max-width:400px; margin:24px auto; background:var(--cp-panel); border:1px solid var(--cp-line); border-radius:12px; overflow:hidden; }
.cp-content .signin .login-header{ padding:18px 22px; border-bottom:1px solid var(--cp-line); background:var(--cp-head-bg); }
.cp-content .signin .login-header h1{ margin:0; font-size:18px; font-weight:800; color:var(--cp-ink); }
.cp-content .signin .login-header i{ color:var(--cp-brand); }
.cp-content .signin .login-body{ padding:20px 22px; }
.cp-content .signin .login-footer{ padding:14px 22px; border-top:1px solid var(--cp-line); background:var(--cp-head-bg); font-size:13px; text-align:center; color:var(--cp-sub); }
.cp-content .signin .login-footer a{ color:var(--cp-brand); text-decoration:none; }
.cp-content .signin .control-group{ margin:0 0 12px; }
.cp-content .signin .submit{ width:100%; margin-top:6px; }

/* 회원 입력창 공통 */
.cp-content .signin input[type="text"], .cp-content .signin input[type="password"], .cp-content .signin input[type="email"],
.cp-content .form-horizontal input[type="text"], .cp-content .form-horizontal input[type="password"],
.cp-content .form-horizontal input[type="email"], .cp-content .form-horizontal input[type="tel"], .cp-content .form-horizontal select, .cp-content .form-horizontal textarea{
  width:100%; box-sizing:border-box; min-height:44px; padding:0 12px;
  border:1px solid var(--cp-line); border-radius:8px; font-size:15px; color:var(--cp-ink); background:var(--cp-panel);
  font-family:"Pretendard Variable",Pretendard,-apple-system,sans-serif;
}
.cp-content .form-horizontal textarea{ padding:10px 12px; min-height:96px; }
.cp-content .signin input:focus, .cp-content .form-horizontal input:focus, .cp-content .form-horizontal select:focus{ outline:none; border-color:var(--cp-brand); box-shadow:0 0 0 3px rgba(47,111,237,.12); }

/* [designer high] 회원가입 form-horizontal — 라벨 상단배치(전 폭 대응) */
.cp-content .form-horizontal{ max-width:560px; margin:20px auto; }
.cp-content .form-horizontal .control-group{ margin:0 0 16px; }
.cp-content .form-horizontal .control-label{ display:block; float:none; width:auto; text-align:left; margin:0 0 6px; padding:0; font-size:13px; font-weight:700; color:var(--cp-ink); }
.cp-content .form-horizontal .controls{ margin-left:0; }
.cp-content .form-horizontal .help-inline, .cp-content .form-horizontal .help-block{ display:block; margin:6px 0 0; font-size:12px; color:var(--cp-faint); }
.cp-content .form-horizontal .agreement{ border:1px solid var(--cp-line); border-radius:8px; padding:14px 16px; margin:0 0 16px; background:var(--cp-head-bg); }
.cp-content .form-horizontal .agreement .title{ font-weight:700; margin-bottom:8px; }
.cp-content .form-horizontal .agreement .text{ max-height:120px; overflow:auto; font-size:12px; color:var(--cp-sub); }
.cp-content .form-horizontal .btnArea{ display:flex; gap:8px; margin-top:8px; }
.cp-content .form-horizontal .btnArea .pull-right{ order:2; margin-left:auto; }
.cp-content .form-horizontal .btnArea .pull-left{ order:1; }

/* [designer low / mobile] 스팸 유인 홈페이지 필드 숨김(가입·댓글) */
.cp-content .control-group:has(input[name="homepage"]){ display:none; }
.cp-content input[name="homepage"]{ display:none; }

/* [mobile-ux medium] 터치타겟 44px — 체크박스/라디오 + 라벨 */
@media (max-width: 768px){
  .cp-content input, .cp-content textarea, .cp-content select{ font-size:16px !important; } /* iOS 포커스 확대 방지 */
  .cp-content input[type="checkbox"], .cp-content input[type="radio"]{ width:20px; height:20px; vertical-align:middle; }
  .cp-content .control-group label{ display:inline-flex; align-items:center; gap:6px; min-height:36px; }
  .cp-content .btn, .cp-content input[type="submit"], .cp-content .submit{ min-height:44px; }
}

/* [mobile-ux high] 회원가입 폼 모바일 — 라벨/입력 세로 스택 확정 */
@media (max-width: 640px){
  .cp-content .form-horizontal, .cp-content .signin{ max-width:100%; }
  .cp-content .form-horizontal .control-label, .cp-content .form-horizontal .controls{ width:100% !important; box-sizing:border-box; }
  .cp-content .form-horizontal input, .cp-content .form-horizontal select, .cp-content .form-horizontal textarea{ width:100% !important; max-width:100% !important; }
}

/* [designer high] 다크모드 — 로그인/가입 카드(흰 블록 잔존 해소) */
html.dark .cp-content .signin, html.rx_dark .cp-content .signin,
html.dark .cp-content .form-horizontal .agreement, html.rx_dark .cp-content .form-horizontal .agreement{ background:var(--cp-panel); border-color:var(--cp-line); }
html.dark .cp-content .signin input, html.rx_dark .cp-content .signin input,
html.dark .cp-content .form-horizontal input, html.rx_dark .cp-content .form-horizontal input,
html.dark .cp-content .form-horizontal select, html.rx_dark .cp-content .form-horizontal select,
html.dark .cp-content .form-horizontal textarea, html.rx_dark .cp-content .form-horizontal textarea{ background:#0d1117; color:var(--cp-ink); border-color:var(--cp-line); }

/* [seo] 홈 h1 슬로건 */
.cp-home-h1{ font-size:20px; font-weight:800; color:var(--cp-ink); margin:0 0 14px; letter-spacing:-.3px; }
.cp-home-h1 span{ font-weight:600; color:var(--cp-sub); font-size:15px; }
@media (max-width:640px){ .cp-home-h1{ font-size:17px; } .cp-home-h1 span{ display:block; font-size:13px; margin-top:2px; } }

/* [perf/CWV] 홈 비동기 위젯 공간예약(컨테이너 단위) — 로드시 레이아웃 시프트(CLS) 제거 */
.cp-home-metrics{ min-height:94px; }
#cphCoins{ min-height:100px; }
.cp-home-posts{ min-height:520px; }
.cp-ticker #cpTicker{ min-height:170px; }
@media (max-width:640px){
  .cp-home-metrics{ min-height:191px; }
  #cphCoins{ min-height:318px; }
  .cp-home-posts{ min-height:1180px; }
  .cp-ticker #cpTicker{ min-height:170px; }
}

/* [designer low] 회원가입 스팸유인 레거시필드(블로그) 숨김 — homepage와 함께 */
.cp-content .control-group:has(input[name="blog"]){ display:none; }
.cp-content input[name="blog"]{ display:none; }

/* [marketer] 가입 마찰↓: 생일 필드 숨김(블로그/홈페이지에 이어) */
.cp-content .control-group:has(input[name="birthday"]), .cp-content .control-group:has(select[name*="birthday"]){ display:none; }

/* [marketer] 첫방문 가입 CTA 밴드(로그아웃시) */
.cp-cta{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 14px; padding:14px 18px; background:linear-gradient(90deg,rgba(47,111,237,.10),rgba(47,111,237,.03)); border:1px solid rgba(47,111,237,.25); border-radius:12px; }
.cp-cta-text{ font-size:14px; font-weight:600; color:var(--cp-ink); }
.cp-cta-btn{ flex-shrink:0; display:inline-flex; align-items:center; background:var(--cp-brand); color:#fff; padding:10px 20px; border-radius:8px; font-weight:800; font-size:14px; text-decoration:none; }
.cp-cta-btn:hover{ background:var(--cp-brand-h); color:#fff; }
/* [marketer] 홈 활력 지표 스트립 */
.cp-vitals{ display:flex; gap:20px; flex-wrap:wrap; margin:0 0 16px; padding:12px 16px; background:var(--cp-head-bg); border:1px solid var(--cp-line); border-radius:10px; }
.cp-vital{ font-size:13px; color:var(--cp-sub); }
.cp-vital b{ color:var(--cp-brand); font-weight:800; font-size:15px; margin-right:3px; }
@media (max-width:640px){ .cp-cta{ flex-direction:column; align-items:stretch; text-align:center; } .cp-cta-btn{ justify-content:center; } .cp-vitals{ justify-content:space-around; gap:10px; } }

/* [marketer] 가입 마찰↓: 이름(user_name) 숨김 — 닉네임만 사용(선택필드라 안전) */
.cp-content .control-group:has(input[name="user_name"]){ display:none; }

/* [a11y] 본문 바로가기 - 포커스시만 노출 */
.cp-skip{ position:absolute; left:-9999px; top:0; z-index:1000; background:var(--cp-brand); color:#fff; padding:10px 16px; border-radius:0 0 8px 0; font-weight:700; text-decoration:none; }
.cp-skip:focus{ left:0; }

/* [a11y] 커스텀 인터랙티브 요소 포커스 링 통일 */
a:focus-visible, button:focus-visible, .cph-metric:focus-visible, .cph-tool:focus-visible, .cp-cta-btn:focus-visible, .cph-tool:focus-visible, .cp-side-link:focus-visible{ outline:2px solid var(--cp-brand); outline-offset:2px; border-radius:4px; }
/* [seo] 푸터 키워드 내부링크 */
.cp-foot-links{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:2px; }
.cp-foot-links a{ font-size:12px; color:var(--cp-sub); text-decoration:none; }
.cp-foot-links a:hover{ color:var(--cp-brand); text-decoration:underline; }

/* [theme] 라이트/다크 토글 버튼 */
.cp-theme-btn{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; margin-right:4px; border:1px solid var(--cp-line); background:transparent; border-radius:8px; color:var(--cp-sub); cursor:pointer; vertical-align:middle; }
.cp-theme-btn:hover{ color:var(--cp-brand); border-color:var(--cp-brand); }
.cp-theme-btn svg{ display:block; }
.cp-theme-btn .cp-th-sun{ display:none; }
html.dark .cp-theme-btn .cp-th-sun{ display:block; }
html.dark .cp-theme-btn .cp-th-moon{ display:none; }
@media (max-width:600px){ .cp-theme-btn{ width:34px; height:34px; } }

/* [onchain-menu] 온체인 드롭다운 (body portal) */


/* GNB 드롭다운 (2026-07-09 오너지시: 온체인 기능 메뉴 그룹핑) */
.cp-gnb li.cp-dd { position: relative; }
.cp-gnb li.cp-dd > a::after { content: ""; display: inline-block; margin-left: 5px; vertical-align: 2px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4.5px solid currentColor; opacity: .55; }
.cp-gnb .cp-dd-menu { display: none; position: absolute; top: calc(100% + 2px); left: 0; min-width: 138px; background: var(--cp-panel); border: 1px solid var(--cp-line); border-radius: 10px; box-shadow: 0 10px 28px rgba(15,23,42,.12); padding: 6px; margin: 0; list-style: none; z-index: 60; }
.cp-gnb li.cp-dd::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 4px; }
.cp-gnb li.cp-dd:hover > .cp-dd-menu, .cp-gnb li.cp-dd:focus-within > .cp-dd-menu, .cp-gnb li.cp-dd.open > .cp-dd-menu { display: block; }
.cp-gnb .cp-dd-menu li { display: block; }
.cp-gnb .cp-dd-menu a { display: block; padding: 8px 12px; border-radius: 7px; font-size: 13px; white-space: nowrap; }
.cp-gnb .cp-dd-menu a:hover { background: rgba(47,111,237,.06); color: var(--cp-brand); }
.cp-gnb a.on { color: var(--cp-brand); font-weight: 700; }
@media (max-width: 900px) {
  /* 모바일: 드롭다운 해체 -> 가로 스크롤 평면 메뉴에 병합 */
  .cp-gnb li.cp-dd { display: contents; }
  .cp-gnb li.cp-dd > a { display: none; }
  .cp-gnb .cp-dd-menu { display: contents; }
  .cp-gnb .cp-dd-menu li { display: inline-block; }
  .cp-gnb .cp-dd-menu a { display: inline-flex; align-items: center; padding: 0 12px; min-height: 44px; border-radius: 6px; background: none; }
}


/* 사이드바 모의선물 랭킹 (2026-07-09) */
.cp-rank-list{ list-style:none; margin:0; padding:4px 0 0; }
.cp-rank-list li{ display:flex; align-items:center; gap:8px; padding:6px 2px; font-size:13px; border-bottom:1px solid var(--cp-faint); }
.cp-rank-list li:last-child{ border-bottom:0; }
.cp-rk-no{ width:18px; height:18px; border-radius:5px; background:var(--cp-bg); color:var(--cp-sub); font-size:11px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.cp-rank-list li:first-child .cp-rk-no{ background:var(--cp-brand); color:#fff; }
.cp-rk-nick{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; color:var(--cp-ink); }
.cp-rk-roi{ font-variant-numeric:tabular-nums; font-weight:700; font-size:12.5px; }
.cp-rk-up{ color:#e0304e; } .cp-rk-down{ color:#2f6fed; }
.cp-rank-more{ float:right; font-size:12px; color:var(--cp-brand); text-decoration:none; font-weight:600; }

/* 로그인 폼 — 체크박스 행/안내문 겹침 수정 (모바일 로그인창 깨짐)
   원인: member 스킨 CSS가 .submit을 position:absolute로 띄워 '로그인 유지' 라벨 위에 겹침 -> 흐름 배치로 강제 */
.cp-content .signin .control-group{ height:auto !important; }
.cp-content .signin .control-group label{ display:flex !important; align-items:center; gap:8px; margin:0 0 12px; font-size:13px; color:var(--cp-sub); line-height:1.5; cursor:pointer; position:static !important; }
.cp-content .signin input[type="checkbox"]{ width:16px; height:16px; margin:0; accent-color:var(--cp-brand); flex-shrink:0; position:static !important; }
.cp-content .signin .submit, .cp-content .signin input[type="submit"]{ position:static !important; display:block; width:100%; margin-top:6px; }
.cp-content .signin #warning p{ margin:0 0 12px; font-size:12px; color:var(--cp-sub); line-height:1.5; background:var(--cp-bg); border:1px solid var(--cp-line); border-radius:8px; padding:10px 12px; }
.cp-content .signin fieldset{ border:0; margin:0; padding:0; min-width:0; }


/* 소셜 로그인 버튼 (로그인/가입 페이지, 키 설정 시 자동 노출) */
.cp-social-login{ max-width:400px; margin:24px auto 0; display:flex; flex-direction:column; gap:10px; }
.cp-sso-btn{ display:flex; align-items:center; justify-content:center; gap:9px; padding:12px 16px; border-radius:10px; font-size:14px; font-weight:700; text-decoration:none; border:1px solid var(--cp-line); transition:filter .12s; }
.cp-sso-btn:hover{ filter:brightness(.96); }
.cp-sso-google{ background:#fff; color:#1f2933; }
.cp-sso-kakao{ background:#FEE500; color:#191919; border-color:#FEE500; }
.cp-sso-naver{ background:#03C75A; color:#fff; border-color:#03C75A; }
.cp-sso-or{ text-align:center; font-size:12px; color:var(--cp-sub); margin-top:2px; }
html.dark .cp-sso-google{ background:#fff; color:#1f2933; }
@media (max-width:640px){ .cp-social-login{ max-width:100%; padding:0 4px; } }