/* member: 내 정보, 내 글, 내 댓글, 스크랩, 헤더 회원 메뉴 */

/* 헤더 회원 메뉴 */
.user-menu { min-width: 0; }
.header-user .who { display: inline-flex; align-items: center; gap: 0; padding: 6px 4px; background: none; border: 0; border-radius: var(--r-sm); font: inherit; font-weight: 600; cursor: pointer; }
.header-user .who:hover, .header-user .who[aria-expanded="true"] { color: var(--accent-hi); }
/* 닉네임은 최대 5자라 줄이지 않고 다 보여 준다 */
.header-user .who-name { white-space: nowrap; }
.header-user .who .caret { flex: 0 0 auto; margin-left: 6px; font-size: 10px; opacity: .6; }
.user-menu .dropdown-menu { --bs-dropdown-bg: var(--surface); --bs-dropdown-border-color: var(--line-strong); --bs-dropdown-link-color: #e3e9f6; --bs-dropdown-link-hover-color: #fff; --bs-dropdown-link-hover-bg: var(--surface-3); --bs-dropdown-link-active-color: #fff; --bs-dropdown-link-active-bg: var(--surface-3); --bs-dropdown-divider-bg: var(--line); --bs-dropdown-border-radius: var(--r-md); --bs-dropdown-font-size: var(--fs-sm); min-width: 160px; padding: 6px; box-shadow: var(--shadow); }
.user-menu .dropdown-menu .dropdown-item { min-height: 40px; padding: 8px 12px; border-radius: var(--r-sm); font-weight: 600; }
/* 헤더 버튼 (본문 밖이라 따로 맞춤) */
.header-user .btn-sm { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 0 14px; font-size: 14px; }
/* 알림 종: 숫자는 안 읽은 알림이 있을 때만 */
.header-user .bell { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 40px; height: 40px; color: #d9e1f2; border-radius: var(--r-md); transition: color .15s, background-color .15s; }
.header-user .bell:hover { color: #fff; background: var(--surface-2); }
.header-user .bell.is-current { color: var(--accent-hi); background: var(--accent-wash); }
.header-user .bell > .ico { width: 20px; height: 20px; vertical-align: 0; }
.bell-count { position: absolute; top: 2px; left: 21px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 800; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; letter-spacing: -.02em; box-shadow: 0 0 0 2px var(--bg); pointer-events: none; }

/* 알림 목록 */
.noti-list .noti-link { display: flex; align-items: flex-start; gap: 12px; }
.noti-ico { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 34px; height: 34px; margin-top: 1px; color: var(--muted); background: var(--surface-2); border-radius: 999px; }
.noti-ico .ico { width: 16px; height: 16px; vertical-align: 0; }
.noti-list .is-new .noti-link { background: var(--accent-wash); }
.noti-list .is-new .noti-link:hover { background: rgba(91, 155, 255, .17); }
.noti-list .is-new .noti-ico { color: var(--accent-hi); box-shadow: inset 0 0 0 1px var(--accent-line); }
.noti-list .is-new .my-excerpt { color: #fff; font-weight: 600; }
.noti-dot { display: inline-block; width: 7px; height: 7px; margin: 0 7px 0 0; border-radius: 50%; background: var(--accent); vertical-align: .15em; }

/* 모바일 메뉴 회원 링크 */
.drawer-user { flex-wrap: wrap; }
.drawer-user .drawer-my { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; width: 100%; padding-top: 10px; margin-top: 2px; border-top: 1px solid var(--line-soft); }
.drawer-user .drawer-my a { display: block; padding: 8px 2px; color: #e3e9f6; font-size: var(--fs-sm); font-weight: 700; text-align: center; background: var(--surface-2); border-radius: var(--r-sm); }
.drawer .drawer-user .drawer-my a { min-height: 44px; font-size: 14px; }
/* 드로어 버튼: 링크 버튼도 글자를 가운데로 */
.drawer-user > .btn, .drawer-foot .btn { display: flex; align-items: center; justify-content: center; min-height: 44px; font-size: 14px; }
.drawer-user .drawer-my a:hover { color: #fff; background: var(--surface-3); }

/* 내 정보 활동 요약 */
.profile-grid .panel-head { flex-wrap: wrap; }
.my-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.my-stats li { border-bottom: 1px solid var(--line-soft); }
.my-stats li:nth-child(odd) { border-right: 1px solid var(--line-soft); }
.my-stats li:nth-last-child(-n+2) { border-bottom: 0; }
.my-stats a { display: flex; flex-direction: column; gap: 2px; padding: 14px 18px; color: var(--text); font-size: var(--fs-sm); transition: background-color .15s; }
.my-stats a:hover { background: var(--surface-2); color: #fff; }
.my-stats strong { font-size: var(--fs-lg); font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }

/* 목록 */
.my-table tbody tr { position: relative; transition: box-shadow .15s; } /* 배경은 그림자로 (board-list.css 참고) */
.my-table tbody tr:hover { background: none; box-shadow: inset 0 0 0 999px rgba(91, 155, 255, .05); }
.my-table .post-title-link::after { content: ""; position: absolute; inset: 0; } /* 줄 전체를 누를 수 있게 */
.my-table tbody tr:hover .post-title-link { color: var(--accent-hi); }
.my-table .post-title-link { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; } /* 긴 제목은 두 줄까지 */
.my-table .t-check { position: relative; z-index: 1; width: 1%; padding-right: 0; }
.my-table .form-check-input { margin: 0; background-color: var(--field); border-color: var(--line-strong); }
.my-table .form-check-input:checked { background-color: var(--accent); border-color: var(--accent); }
.my-list { margin: 0; padding: 0; list-style: none; }
.my-item + .my-item { border-top: 1px solid var(--line-soft); }
.my-item-link { display: block; padding: 13px 18px; color: var(--text); transition: background-color .15s; }
.my-item-link:hover { background: rgba(91, 155, 255, .05); color: #fff; }
.my-excerpt { display: block; font-size: var(--fs-md); overflow-wrap: anywhere; }
.my-meta { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 4px; color: var(--muted); font-size: var(--fs-xs); min-width: 0; }
.my-meta .my-post-title { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #cfd8ea; }
.my-meta .my-date { font-variant-numeric: tabular-nums; }
.my-actions { display: flex; justify-content: flex-end; padding: 10px 18px; border-top: 1px solid var(--line-soft); }
.my-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 16px; padding: 14px 18px; border-top: 1px solid var(--line-soft); }
.my-rows { display: flex; align-items: center; gap: 6px; margin: 0; }
.my-rows .form-select { width: auto; min-height: 36px; font-size: 14px; }
.my-rows label { white-space: nowrap; }

/* 내 활동 탭: 탭 줄 안에서만 가로 스크롤 */
.my-panel, .profile-grid > div { min-width: 0; }
.my-tabs { overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.my-tabs a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; font-size: 14px; }
.my-tabs-panel { overflow: hidden; }
.my-tabs-panel .cat-tabs { border-bottom: 0; }

/* 목록 보조 */
.my-cmt-count { color: var(--accent-hi); font-size: var(--fs-sm); font-weight: 700; font-variant-numeric: tabular-nums; }
.my-meta .my-post-title .ico { width: 12px; height: 12px; margin-right: 3px; vertical-align: -.1em; color: var(--muted); }
.my-search-note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 12px 18px; color: var(--muted); font-size: var(--fs-sm); border-bottom: 1px solid var(--line-soft); }
.my-search-note > span { min-width: 0; }
.my-search-note strong { color: #fff; font-weight: 700; overflow-wrap: anywhere; }
.my-search-clear { display: inline-flex; align-items: center; min-height: 36px; padding: 4px 2px; color: var(--accent-hi); font-weight: 700; white-space: nowrap; }
.my-search-clear:hover { color: #fff; }
.my-search { align-items: center; }
.my-search-field { position: relative; flex: 1; min-width: 0; }
.my-search-field .form-control { width: 100%; padding-left: 34px; }
.my-search-ico { position: absolute; left: 11px; top: 50%; width: 15px; height: 15px; margin-top: -7.5px; color: var(--muted); pointer-events: none; }
.my-search .btn { flex: 0 0 auto; min-height: 44px; min-width: 88px; }

/* 빈 목록 */
.my-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 48px 20px; }
.my-empty p { margin: 0; max-width: 34em; font-size: var(--fs-sm); line-height: 1.6; }
.my-empty .btn { margin-top: 2px; }
.my-empty-ico { width: 34px; height: 34px; color: var(--muted); opacity: .55; stroke-width: 1.5; }

/* 스크랩 선택 */
.check-hit { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px; margin: -6px 0; cursor: pointer; }
.my-table .form-check-input { width: 18px; height: 18px; cursor: pointer; }
.my-table .form-check-input:indeterminate { background-color: var(--accent); border-color: var(--accent); }
.my-table tbody tr:has(.form-check-input:checked) { box-shadow: inset 0 0 0 999px var(--accent-wash); }
.my-actions { align-items: center; justify-content: space-between; gap: 12px; }
.my-sel { font-variant-numeric: tabular-nums; }
.my-sel strong { color: #fff; }
.btn-del:not(:disabled):hover { color: var(--danger-hi); border-color: rgba(255, 90, 106, .45); background: rgba(255, 90, 106, .08); }
.btn-del:disabled { opacity: .45; }

/* 페이지 이동 */
.my-pager { flex-wrap: wrap; justify-content: center; gap: 4px; }
.my-pager .page-link { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 8px; font-variant-numeric: tabular-nums; }
.my-pager .page-link .ico { width: 14px; height: 14px; }
.my-pager .page-item.disabled .page-link { background: transparent; border-color: var(--line-soft); color: var(--muted); opacity: .45; }
.my-pager .page-gap .page-link { border-color: transparent; opacity: 1; }

/* 폼 */
.auth-form .asteriskField, .my-form .asteriskField { display: none; }
.auth-form .form-control.is-invalid, .my-form .form-control.is-invalid { border-color: rgba(255, 90, 106, .55) !important; background-image: none; padding-right: .75rem; }
.auth-form .form-control.is-invalid:focus, .my-form .form-control.is-invalid:focus { border-color: var(--danger) !important; box-shadow: 0 0 0 4px rgba(255, 90, 106, .14) !important; }
.auth-form .invalid-feedback, .my-form .invalid-feedback { display: block; margin-top: 6px; font-size: var(--fs-xs); }
.auth-form .invalid-feedback p, .my-form .invalid-feedback p { margin: 0; }
.auth-form .invalid-feedback strong, .my-form .invalid-feedback strong { font-weight: 600; }
.auth-form .alert-block, .my-form .alert-block { padding: 10px 14px; font-size: var(--fs-sm); border-radius: var(--r-md); }
.auth-form .alert-block ul, .my-form .alert-block ul { padding-left: 0; list-style: none; }
.auth-form .form-control, .my-form .form-control { min-height: 44px; }
.field-ro { position: relative; }
.field-ro .form-control[readonly] { padding-right: 38px; color: var(--muted) !important; background: var(--surface-2) !important; cursor: not-allowed; }
.field-ro-ico { position: absolute; right: 13px; top: 50%; width: 14px; height: 14px; margin-top: -7px; color: var(--muted); pointer-events: none; }
.form-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 8px; margin-top: 8px; }
.form-actions .btn { min-height: 48px; min-width: 120px; font-size: var(--fs-md); }
.form-foot-link { margin-top: 16px; text-align: center; font-size: var(--fs-sm); }
.form-foot-link a { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 4px; color: var(--muted); }
.form-foot-link a:hover { color: #fff; }

/* 비밀번호 보기 */
.pw-field { position: relative; }
.pw-field .form-control { padding-right: 48px; }
.pw-toggle { position: absolute; right: 2px; top: 50%; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 40px; margin-top: -20px; padding: 0; color: var(--muted); background: none; border: 0; border-radius: var(--r-sm); cursor: pointer; }
.pw-toggle:hover, .pw-toggle[aria-pressed="true"] { color: var(--accent-hi); }
.pw-toggle .ico { width: 18px; height: 18px; }
.pw-field ~ .invalid-feedback { display: block; }

/* 전송 중 */
.btn.is-busy { pointer-events: none; opacity: .7; }
.btn:disabled.is-busy { cursor: progress; }

/* 내 정보 */
.profile-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.profile-who { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; min-width: 0; }
.profile-name { min-width: 0; overflow-wrap: anywhere; }
.pt-own { font-variant-numeric: tabular-nums; }
.state-ok { color: #6fd6a6; font-weight: 600; }
.level-progress-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; margin-bottom: 8px; font-size: var(--fs-sm); }
.level-progress-head strong { color: #fff; font-weight: 800; }
/* 경험치 막대: 채움은 파란 강조색 (금색은 배지 전용) */
.lp-total { color: var(--muted); }
.lp-track { height: 10px; border-radius: 999px; background: var(--surface-3); box-shadow: inset 0 0 0 1px var(--line-soft); overflow: hidden; }
.lp-fill { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #3f6fe0 0%, var(--accent) 100%); }
.lp-ends { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; }
.lp-ends .level-badge { margin-right: 0; }
.level-progress.is-compact { margin: 0 0 14px; padding: 10px 12px; }
.is-compact .level-progress-head { margin-bottom: 6px; font-size: var(--fs-xs); }
.is-compact .lp-track { height: 6px; }
.drawer-user .level-progress { width: 100%; margin-bottom: 4px; }
.ref-copy { display: flex !important; align-items: center; justify-content: center; gap: 10px; min-height: 48px; }
.ref-copy .ico { width: 16px; height: 16px; color: var(--accent-hi); stroke-width: 2; }
.ref-code { letter-spacing: .2em; margin-right: -.2em; font-variant-numeric: tabular-nums; }
.invite-box .btn { flex: 0 0 auto; white-space: nowrap; }
.invite-box input { min-height: 40px; font-size: var(--fs-sm); }
.ex-hint { margin-top: 14px; color: var(--muted); font-size: var(--fs-sm); line-height: 1.55; }
.ex-hint .num { color: #fff; font-weight: 700; }
.my-stat-label { color: var(--muted); }
.my-stats a:hover .my-stat-label { color: #cfd8ea; }
.lv-row > span:first-child { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.lv-row.is-current > span:first-child { color: var(--accent-hi); }
.lv-row .lv-top { color: var(--gold); }
.lv-now { padding: 0 7px; line-height: 18px; font-size: 12px; font-weight: 700; color: var(--accent-hi); background: var(--accent-wash); border-radius: 999px; box-shadow: inset 0 0 0 1px var(--accent-line); }

/* 포인트, 환전 내역 */
.pt-val { white-space: nowrap; font-weight: 700; font-variant-numeric: tabular-nums; }
.pt-plus { color: #6fd6a6; color: color-mix(in srgb, var(--ok) 72%, var(--muted)); }
.pt-minus { color: #e98691; color: color-mix(in srgb, var(--danger-hi) 78%, var(--muted)); }
.ex-status { display: inline-block; padding: 0 8px; line-height: 22px; font-size: 12px; font-weight: 700; white-space: nowrap; border-radius: 999px; }
.ex-pending { color: var(--accent-hi); background: var(--accent-wash); box-shadow: inset 0 0 0 1px var(--accent-line); }
.ex-approved { color: #6fd6a6; background: rgba(47, 211, 138, .1); box-shadow: inset 0 0 0 1px rgba(47, 211, 138, .32); }
.ex-rejected { color: #e98691; background: rgba(255, 90, 106, .08); box-shadow: inset 0 0 0 1px rgba(255, 90, 106, .3); }
.ex-wallet { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: var(--fs-xs) !important; }

/* 환전 신청 */
.ex-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 14px; background: var(--field); border: 1px solid var(--line-soft); border-radius: var(--r-md); }
.ex-summary > div { padding: 12px 14px; min-width: 0; }
.ex-summary > div + div { border-left: 1px solid var(--line-soft); }
.ex-summary dt { margin-bottom: 4px; color: var(--muted); font-size: var(--fs-xs); font-weight: 600; }
.ex-summary dd { margin: 0; color: #fff; font-size: var(--fs-md); font-weight: 800; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ex-summary dd.num-gold { color: var(--gold); }
.ex-summary dd.is-over { color: var(--danger-hi); }
.ex-note { font-size: var(--fs-sm); line-height: 1.6; }
.ex-note p { margin: 0; }
.ex-fill { margin-top: 8px; }

@media (max-width: 767.98px) {
  .my-item-link { padding: 12px 14px; }
  .my-actions, .my-foot { padding: 10px 14px; }
  .my-stats a { padding: 12px 14px; }
  .my-search-note { padding: 10px 14px; }
  .my-search { padding: 12px 14px; }
  .my-tabs a { flex: 0 0 auto; min-height: 44px; padding: 0 14px; }
  .my-table .post-meta-sm { display: flex; flex-wrap: wrap; gap: 2px 10px; font-variant-numeric: tabular-nums; }
  .my-meta-sm > span { display: inline-flex; align-items: center; gap: 3px; }
  .my-meta-sm .ico { width: 12px; height: 12px; }
  .check-hit { min-width: 44px; min-height: 44px; margin: -12px -6px; }
  .my-pager .page-link { min-width: 40px; height: 40px; }
  .my-pager .page-gap { display: none; }
  .my-rows .form-select, .my-search .form-control, .my-search .btn,
  .my-actions .btn, .profile-actions .btn, .invite-box .btn, .invite-box input, .ex-fill { min-height: 44px; }
  .header-user .btn-sm { min-height: 44px; padding: 0 16px; }
  .header-user .bell { height: 44px; }
  .profile-actions { width: 100%; }
  .profile-actions .btn { flex: 1 1 0; }
  .my-item-link .my-meta { gap: 2px 8px; }
  .ex-summary { grid-template-columns: minmax(0, 1fr); }
  .ex-summary > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 10px 14px; }
  .ex-summary > div + div { border-left: 0; border-top: 1px solid var(--line-soft); }
  .ex-summary dt { margin: 0; }
  .ex-fill { width: 100%; }
}
@media (max-width: 380px) {
  .my-pager .page-step:first-child, .my-pager .page-step:last-child { display: none; }
}
/* 좁은 휴대폰: 종이 들어간 만큼 머리글 간격과 회원 메뉴 화살표를 줄여 한 줄에 맞춘다 */
@media (max-width: 400px) {
  .site-header .bar { gap: 8px; }
  .site-header .header-user { gap: 2px; }
  .header-user .who .caret { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .my-stats a, .my-item-link, .header-user .bell { transition: none; }
}

.auth-sub .btn-link { font-size: inherit; color: var(--royal-2, #6ea2ff); }
/* 메인 화면 로그인 칸 (회원 카드 자리) */
.login-card { scroll-margin-top: 90px; }
.login-title { margin: 0 0 12px; font-size: var(--fs-md); font-weight: 800; color: #fff; }
.login-form { display: grid; gap: 8px; }
.login-form .form-control { min-height: 46px; font-size: var(--fs-md); }
.login-form .btn-gold { display: flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 4px; padding: 0 18px; font-size: var(--fs-md); }
/* 가입 화면의 주 버튼 */
.auth-card .auth-form .btn-gold { min-height: 48px; padding: 0 18px; }
/* 회원 카드 버튼 */
.me-card .btn { min-height: 44px; }
.login-error { display: flex; align-items: flex-start; gap: 6px; margin: 0 0 4px; font-size: var(--fs-sm); color: var(--danger-hi); }
.login-error .ico { flex: none; margin-top: .25em; }
.login-sub { margin: 12px 0 0; font-size: var(--fs-sm); color: var(--muted); text-align: center; }
/* 휴대폰: 내 정보와 로그인은 왼쪽 메뉴 안에서만 보인다 */
.drawer-guest { display: block; }
.drawer-guest .login-sub { margin-top: 10px; }
.drawer-user .drawer-nums { width: 100%; margin: 4px 0 0; }
/* 좁은 메뉴 칸에서 큰 숫자가 P 앞에서 줄바꿈되지 않게 */
.drawer-user .drawer-nums strong { display: block; font-size: var(--fs-md); white-space: nowrap; }
.drawer-user .drawer-nums + .btn, .drawer-user .drawer-nums + .me-hint { margin-top: -2px; }
.drawer-user .me-hint { width: 100%; }
@media (max-width: 991.98px) {
  .o-me { display: none !important; }
}