/* ===== 커뮤니티 팀 화면 배치 (커뮤니티·게시글·신고·프로필·검색·알림) — 토큰과 공통 부품 위에만 얹는다 ===== */
.d-block { display: block; }
.c-inline-form { display: inline-flex; margin: 0; }
.c-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.c-section-title { display: flex; align-items: center; gap: var(--s-2); font-family: var(--f-display); font-weight: 700; font-size: var(--t-xl); color: var(--c-plum); }
.c-url { overflow-wrap: anywhere; }

/* 커뮤니티 목록 — 머리는 공통 .page-head 띠 배너, 3단 배치는 34-community-list.css */
.c-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s-4) var(--s-6); flex-wrap: wrap; margin-bottom: var(--s-6); }
.c-hero .page-title { font-size: 24px; letter-spacing: -.02em; }
.c-hero .page-desc { margin-top: 4px; font-size: 15px; }
.c-hero .btn-group { gap: var(--s-2); }
.c-hero :focus-visible { outline-color: #fff; }
.c-page { padding-top: 0; }
.c-board-note { display: flex; align-items: flex-start; gap: var(--s-2); padding: 10px 14px; border: 1px solid var(--c-line-2); border-radius: var(--r-sm); background: #fff; font-size: var(--t-sm); color: var(--c-ink); }
.c-board-note.anon { background: var(--c-plum); border-color: var(--c-plum); color: #fff; }
.c-board-note .ico { margin-top: 3px; }
.c-list { display: grid; gap: var(--s-1); }
.c-row { position: relative; display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-5) var(--s-6); background: #fff; border: 0; border-radius: var(--r-md); transition: transform var(--m-fast) var(--ease), box-shadow var(--m-fast) var(--ease); }
.c-row:hover { background: var(--c-surface-2); }
.c-row-title { font-size: var(--t-lg); font-weight: 700; line-height: 1.45; }
.c-stretch::after { content: ""; position: absolute; inset: 0; border-radius: var(--r-md); }
.c-stretch:focus-visible { outline: none; box-shadow: none; }
.c-stretch:focus-visible::after { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.c-row-excerpt { color: var(--c-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.c-row-foot { margin-top: var(--s-1); }
.c-row-author { display: inline-flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.c-author-link { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: var(--s-2); min-height: 44px; border-radius: var(--r-pill); padding-right: var(--s-2); }
a.c-author-link:hover .bold { color: var(--c-berry); text-decoration: underline; }
.c-raise { position: relative; z-index: 1; }

/* 게시글 상세 */
.c-detail { padding-bottom: var(--s-12); }
.c-detail .subbar { margin-bottom: var(--s-2); }
.c-article { background: #fff; border: 1px solid var(--c-line-2); border-radius: var(--r-md); padding: var(--s-8); display: flex; flex-direction: column; gap: var(--s-4); }
.c-article > .meta { gap: 4px 10px; font-size: var(--t-xs); }
.c-article > .meta .board-tag { font-size: var(--t-xs); padding: 3px 10px; }
.c-title { font-family: var(--f-display); font-weight: 700; font-size: 26px; line-height: 1.35; letter-spacing: -.02em; color: var(--c-ink); }
.c-author-row { padding-bottom: var(--s-3); border-bottom: 1px solid var(--c-line); }
.c-author-link.is-static { cursor: default; }
.c-body { font-size: var(--t-md); line-height: 1.75; color: var(--c-ink); }
.c-body p + p { margin-top: var(--s-3); }
.c-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.c-photo-link { display: block; border: 1px solid var(--c-line); border-radius: var(--r-sm); overflow: hidden; aspect-ratio: 4 / 3; background: var(--c-milk); }
.c-photo-link img { width: 100%; height: 100%; object-fit: cover; }
.c-linkcard { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border: 1px solid var(--c-line-2); border-radius: var(--r-sm); background: #fff; transition: box-shadow var(--m-fast) var(--ease); }
.c-linkcard:hover { box-shadow: var(--shadow-3); }
.c-poll { padding: var(--s-4) var(--s-5); border: 1px solid var(--c-line-2); border-radius: var(--r-md); background: var(--c-surface-2); }
.c-poll-title { display: flex; align-items: center; gap: var(--s-2); font-size: var(--t-md); font-weight: 700; color: var(--c-ink); }
.c-poll-form { margin-top: var(--s-3); }
.c-poll-opt { padding: 0 var(--s-3); background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-sm); }
.c-poll-opt + .c-poll-opt { margin-top: var(--s-2); }
.c-poll-results { list-style: none; display: grid; gap: var(--s-2); margin-top: var(--s-3); }
.c-poll-bar { position: relative; display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); min-height: 48px; padding: 0 var(--s-4); background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-sm); overflow: hidden; font-weight: 700; }
.c-poll-fill { position: absolute; inset: 0 auto 0 0; background: var(--c-milk-2); }
.c-poll-bar.is-mine { border-color: var(--c-berry); box-shadow: inset 0 0 0 1px var(--c-berry); }
.c-poll-bar.is-mine .c-poll-fill { background: var(--c-pink); }
.c-poll-label, .c-poll-pct { position: relative; display: inline-flex; align-items: center; gap: 6px; }
.c-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); padding-top: var(--s-4); border-top: 1px solid var(--c-line); }
.c-actions-gap { flex: 1; }
.c-act { min-height: 44px; padding: 0 16px; font-size: var(--t-sm); }
.c-act.is-on .c-heart { fill: var(--c-plum); }
.c-like-wrap { display: inline-flex; }
.c-gone { min-height: 40vh; background: #fff; border: 1px dashed var(--c-line-2); border-radius: var(--r-md); }

/* 댓글 */
.c-comments { margin-top: var(--s-4); padding: var(--s-5) var(--s-8) var(--s-6); background: #fff; border: 1px solid var(--c-line-2); border-radius: var(--r-md); }
.c-comments .c-section-title { font-size: 18px; color: var(--c-ink); }
.c-comment-list { list-style: none; margin-top: var(--s-3); border-top: 1px solid var(--c-line-2); }
.c-comment { padding: var(--s-3) 0 var(--s-2); border-bottom: 1px solid var(--c-line); }
.c-comment-head { display: flex; align-items: flex-start; gap: var(--s-3); }
.c-comment-body { margin: var(--s-1) 0 0 44px; font-size: var(--t-sm); line-height: 1.65; white-space: pre-line; }
.c-comment-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin: 0 0 0 34px; }
.c-comment-gone { display: flex; align-items: center; gap: 6px; padding: var(--s-2) 0; }
.c-replies { list-style: none; margin: var(--s-2) 0 0 44px; padding-left: var(--s-4); border-left: 2px solid var(--c-line-2); }
.c-replies .c-comment { padding: var(--s-3) 0; }
.c-replies .c-comment:last-child { border-bottom: 0; }
.c-mini { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 10px; border: 0; border-radius: var(--r-pill); background: transparent; color: var(--c-muted); font-size: var(--t-sm); font-weight: 700; cursor: pointer; }
.c-mini:hover { background: var(--c-surface-2); color: var(--c-ink); }
.c-mini.is-on { color: var(--c-berry); }
.c-mini.is-on .c-heart { fill: var(--c-berry); }
.c-mini.is-static { cursor: default; }
.c-mini.is-static:hover { background: transparent; color: var(--c-muted); }
.c-no-comments { padding: var(--s-6) 0; text-align: center; }
.c-comment-form { margin-top: var(--s-5); display: flex; flex-direction: column; gap: var(--s-2); }
.c-comment-input { display: flex; gap: var(--s-2); align-items: stretch; }
.c-comment-input .c-textarea { min-height: 56px; flex: 1; }
.c-reply-banner { display: flex; align-items: center; gap: var(--s-2); padding: 0 0 0 var(--s-3); background: var(--c-surface-2); border-radius: var(--r-sm); font-weight: 700; }
.c-reply-banner > span { flex: 1; }

/* 글쓰기·수정 */
.c-form-page { padding-bottom: var(--s-12); }
.c-form-page .subbar h1 { font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--c-ink); }
.c-form-page > .card { border: 1px solid var(--c-line-2); border-radius: var(--r-md); box-shadow: none; }
.c-hint { display: flex; align-items: flex-start; gap: var(--s-2); margin-top: var(--s-2); padding: var(--s-3) var(--s-4); border-radius: var(--r-sm); background: var(--c-milk); font-size: var(--t-sm); }
.c-hint.anon { background: var(--c-plum); color: #fff; }
.c-hint .ico { margin-top: 3px; }
.c-body-input { min-height: 240px; }
.c-attach + .c-attach { margin-top: var(--s-3); }
.c-attach-toggle { display: block; max-width: 180px; }
.c-attach-toggle span { justify-content: flex-start; }
.c-attach-panel { margin-top: var(--s-3); padding: var(--s-4); border: 1px solid var(--c-line-2); border-radius: var(--r-sm); background: var(--c-surface-2); }
.c-poll-fields { list-style: none; margin-top: var(--s-2); }
.c-poll-fields .field + .field { margin-top: var(--s-3); }
.c-poll-row { display: flex; gap: var(--s-2); align-items: center; }
.c-poll-row .input { flex: 1; }
.c-date { max-width: 240px; }
.c-photo-list, .c-file-list { list-style: none; display: grid; gap: var(--s-2); margin-top: var(--s-3); }
.c-photo-list:empty { display: none; }
.c-photo, .c-file { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-2); border: 1px solid var(--c-line-2); border-radius: var(--r-sm); background: #fff; }
.c-photo img, .c-file-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; border: 1px solid var(--c-line); flex: none; }
.c-photo-meta { flex: 1; min-width: 0; font-size: var(--t-sm); overflow-wrap: anywhere; }
.c-file-list { margin: 0 0 var(--s-3); }
.c-form-foot { display: flex; justify-content: flex-end; gap: var(--s-2); margin-top: var(--s-8); padding-top: var(--s-5); border-top: var(--border-soft); }
.file-drop.is-invalid { border-color: var(--c-danger); background: var(--c-danger-bg); }

/* 내가 쓴 글 */
.c-mine-list { list-style: none; display: grid; gap: var(--s-3); }
.c-mine { position: relative; padding: var(--s-4) var(--s-5); border: var(--border); border-radius: var(--r-md); background: #fff; display: flex; flex-direction: column; gap: var(--s-2); }
.c-mine:not(.is-gone):hover { background: var(--c-milk); }
.c-mine.is-gone { border-style: dashed; background: var(--c-milk); }
.c-mine-title { font-weight: 700; font-size: var(--t-md); display: inline-flex; align-items: center; gap: 6px; }
.c-mine-main { align-items: center; }
.c-mine-side { gap: var(--s-3); }

/* 신고 시트 */
.c-sheet-bg { padding: var(--s-6) var(--gutter) var(--s-10); }
.c-sheet .card { border: 1px solid var(--c-line-2); border-radius: var(--r-md); box-shadow: none; overflow: hidden; }
.c-target { padding: var(--s-3) var(--s-4); border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-surface-2); display: grid; gap: var(--s-1); }
.c-target-title { overflow-wrap: anywhere; }
.c-reasons { display: grid; gap: 2px; margin-top: var(--s-2); }
.c-reason { padding: 0 var(--s-2); border-radius: var(--r-sm); }
.c-reason:hover { background: var(--c-milk); }
.c-block-toggle { padding: var(--s-3) var(--s-4); border: 1px solid var(--c-line-2); border-radius: var(--r-sm); }
.c-sheet-foot { padding: var(--s-2) 0 0; }

/* 프로필·팔로우 */
.c-profile { display: flex; flex-direction: column; gap: var(--s-4); }
.c-profile-top { display: flex; align-items: center; gap: var(--s-4); flex-wrap: wrap; }
.c-profile-name { font-family: var(--f-display); font-weight: 700; font-size: var(--t-2xl); color: var(--c-plum); }
.c-profile-bio { padding: var(--s-4); background: var(--c-milk); border-radius: var(--r-md); }
.c-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; border: var(--border); border-radius: var(--r-md); overflow: hidden; }
.c-stats > div { padding: var(--s-3) var(--s-2); text-align: center; }
.c-stats > div + div { border-left: var(--border-soft); }
.c-stats dt { font-size: var(--t-xs); color: var(--c-muted); font-weight: 700; }
.c-stats dd { margin: 0; font-weight: 700; font-size: var(--t-xl); color: var(--c-plum); }
.c-stat-link { display: inline-flex; align-items: center; min-height: 24px; text-decoration: underline; text-underline-offset: 3px; color: var(--c-berry); }
.c-res-grid { gap: var(--s-4); }
.c-price { color: var(--c-plum); }
.c-portfolio-intro { font-size: var(--t-lg); font-weight: 700; }
.c-person-head { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-4); border: var(--border); border-radius: var(--r-md); background: var(--c-milk); }
.c-people { list-style: none; overflow: hidden; }
.c-person { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); }
.c-person + .c-person { border-top: var(--border-soft); }
.c-person-link { flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--s-3); min-height: 48px; }
.c-person-link:hover .bold { color: var(--c-berry); text-decoration: underline; }

/* 검색 */
.c-search-box { display: flex; align-items: center; gap: var(--s-2); padding: 4px 4px 4px 14px; border: var(--border); border-radius: var(--r-pill); background: #fff; box-shadow: var(--shadow-1); }
.c-search-box:focus-within { box-shadow: var(--shadow-2); }
.c-search-box.is-invalid { border-color: var(--c-danger); }
.c-search-box > .ico { color: var(--c-plum); }
.c-search-input { flex: 1; min-width: 0; min-height: 44px; border: 0; background: transparent; outline: none; }
.c-search-input::-webkit-search-cancel-button { display: none; }
.c-search-form .btn { flex: none; }
.c-recent { list-style: none; }
.c-recent li { display: flex; align-items: center; justify-content: space-between; border-bottom: var(--border-soft); }
.c-recent-q { flex: 1; display: flex; align-items: center; gap: var(--s-2); min-height: 48px; font-weight: 700; }
.c-recent-q:hover { color: var(--c-berry); }
.c-no-recent { padding: var(--s-4); background: var(--c-milk); border-radius: var(--r-md); }
.c-summary { margin-top: var(--s-2); font-size: var(--t-lg); }
.c-sort { display: flex; align-items: center; gap: var(--s-1); color: var(--c-muted); }
.c-sort-link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 10px; border-radius: var(--r-pill); font-weight: 700; font-size: var(--t-sm); }
.c-sort-link[aria-current="true"] { color: var(--c-plum); background: var(--c-milk-2); }
.c-results { display: grid; gap: var(--s-4); }
.c-result-res .res-card { flex-direction: row; }
.c-result-res .res-thumb { width: 132px; aspect-ratio: 4 / 5; border-bottom: 0; border-right: var(--border); flex: none; }
.c-empty-title { font-family: var(--f-display); font-weight: 700; font-size: var(--t-xl); }
.c-center-group { justify-content: center; }

/* 알림 */
.c-noti-list { list-style: none; overflow: hidden; }
.c-noti + .c-noti { border-top: var(--border-soft); }
.c-noti-link { display: flex; align-items: flex-start; gap: var(--s-3); padding: var(--s-4) var(--s-5); }
.c-noti-link:hover { background: var(--c-milk); }
.c-noti.is-unread { background: #fdf3f5; }
.c-noti-body { overflow-wrap: anywhere; }
.c-unread-dot { flex: none; width: 12px; height: 12px; margin-top: 6px; border-radius: 50%; background: var(--c-accent); }
.c-push-cta { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-4) var(--s-5); border: var(--border); border-radius: var(--r-md); background: var(--c-milk); box-shadow: var(--shadow-1); }
.c-push-cta:hover { background: var(--c-milk-2); }
.c-push-hero { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--s-3); padding: var(--s-6) 0 0; }
.c-push-title { font-family: var(--f-display); font-weight: 700; font-size: var(--t-2xl); line-height: 1.25; color: var(--c-plum); }
.c-toggles { list-style: none; margin-top: var(--s-3); }
.c-toggles li + li { border-top: var(--border-soft); }
.c-toggle-text { flex-wrap: nowrap; align-items: flex-start; gap: var(--s-3); }
.c-toggle-text .ico { margin-top: 3px; color: var(--c-berry); }

@media (max-width: 720px) {
  .c-hero { margin-bottom: var(--s-4); }
  .c-hero .page-title { font-size: 20px; }
  .c-hero .page-desc { font-size: 13px; }
  .c-hero .btn-group { width: 100%; }
  .c-hero .btn-group .btn { flex: 1; padding: 0 12px; }
  .c-row { padding: var(--s-4); }
  .c-article { padding: var(--s-5) var(--s-4); }
  .c-title { font-size: 21px; }
  .c-comments { padding: var(--s-4) var(--s-4) var(--s-5); }
  .c-act span:not(.num) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .c-act { padding: 0 12px; }
  .c-actions { gap: 6px; }
  .c-comment-form { position: sticky; bottom: 84px; z-index: 30; background: #fff; padding: var(--s-3) var(--s-4); margin-left: calc(var(--s-4) * -1); margin-right: calc(var(--s-4) * -1); border-top: 1px solid var(--c-line-2); }
  .c-comment-input .btn { padding: 0 14px; }
  .c-comment-body { margin-left: 0; }
  .c-comment-acts { margin-left: -10px; }
  .c-replies { margin-left: var(--s-2); padding-left: var(--s-3); }
  .c-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .c-stats > div:nth-child(4) { border-left: 0; }
  .c-stats > div:nth-child(n+4) { border-top: var(--border-soft); }
  .c-sheet-bg { padding: 0; }
  .c-sheet { margin: 0 auto; }
  .c-sheet .card { border-radius: var(--r-lg) var(--r-lg) 0 0; box-shadow: none; border-bottom: 0; }
  .c-sheet .modal-body { padding: var(--s-4); }
  .c-form-foot .btn { flex: 1; }
  .c-result-res .res-thumb { width: 104px; }
  .c-mine-main { flex-direction: column; align-items: flex-start; }
}
.c-poll .link { color: var(--c-plum); }
.c-notice-row { align-items: center; }
.c-file { flex-wrap: wrap; }
.c-file .grow { min-width: 120px; }
.c-file .c-url { word-break: break-all; }
.c-comment-acts { margin-left: 34px; }
@media (max-width: 720px) {
  .c-comment-acts { margin-left: -10px; }
}
