/**
 * 여유판 — 「답답해서 오래 보기 어렵다」(2026-10-09 운영자)를 덜어 낸 값. 시안 3(claude.ai 아티팩트 42iV…)에서 운영자가 고른 것.
 *
 * 왜 답답했나(같은 날 PC 1440×900 첫 화면 실측, 커뮤니티 ↔ Recraft):
 *   굵은 글씨 41% ↔ 약 8% · 테두리 칸 22 ↔ 0 · 색 면 칩·배지 13 ↔ 0 · 머리글 135px + 왼쪽 메뉴 두 겹 ↔ 왼쪽 메뉴 하나.
 *   많이 담아서가 아니라 굵기·선·색·바탕이 여러 겹으로 겹쳐서다. 그래서 배치는 그대로 두고 덜어 내기만 한다:
 *   굵은 글씨는 제목 하나 · 구획은 테두리 대신 간격 · 상태는 색 면 배지 대신 색 글자 · 색은 내용(하트·사진)에만.
 *
 * 새 머리글(nav2)과 같은 스위치로 실린다(inc/custom-navigation.php nav2 절) — 공개 전엔 관리자·검수 쿠키만 본다.
 *   머리글 몫은 css/nav2.css, AI 활용 몫은 css/ai-hub.css 에 바로 적었다(둘 다 미리보기에만 실리는 파일).
 * 원래 파일(community.css · community-mobile.css · wiki.css · page-lecture-home.css)보다 뒤에 실려
 * 같은 선택자로 순서에서 이긴다 — 명시도를 올리지 않아야 「좋아요 누름」 같은 상태 규칙이 그대로 이긴다.
 * 공개 뒤에는 각 규칙을 원래 파일로 옮기고 이 파일을 지운다. !important·그라디언트 없음.
 */

/* ── 왼쪽 패널 「지금 칸」 — 커뮤니티·실무 위키·무료 강의 한 벌: 초록 면 → 진한 글자·진한 아이콘 ──
   ⚠️ 토큰 --sidenav-active-bg 는 건드리지 않는다 — 설문 「내 표」·검색 자동완성 선택 줄·이모지 선택 등도 같은 토큰을 쓴다. */
.oc-community .oc-board-item.is-active { background: transparent; font-weight: 600; color: var(--gray-900); }
.oc-community .oc-board-item.is-active > .oc-ic { color: var(--gray-900); }
.oc-community .oc-board-item-n,
.oc-community .oc-board-item.is-active .oc-board-item-n { font-weight: 400; color: var(--gray-400); }
.wk-pitem--on { background: transparent; font-weight: 600; }
.wk-pitem--on > svg { color: var(--gray-900); }
#lecture-home .lh-nav-item.is-active { background: transparent; font-weight: 600; color: var(--gray-900); }
#lecture-home .lh-nav-item.is-active .lh-nav-i { color: var(--gray-900); }

/* ── 커뮤니티 목록 ── */
/* 칸 사이를 넓힌다 — 넓은 PC 만(1120 이하·휴대폰 틀은 원래 여백) */
@media (min-width: 1121px) {
	.oc-community .oc-grid { gap: 44px; padding: 36px 40px; }
}

/* 글 한 건 — 구분선 대신 간격, 배지 대신 회색 글자, 좋아요는 글자 단추. 상세 화면의 배지·글쓴이는 그대로 둔다 */
.oc-community .oc-feed-card { padding: 26px 22px; border-bottom: 0; border-radius: 8px; }
.oc-community .oc-feed-head { margin-bottom: 12px; }
.oc-community .oc-feed-card .oc-chips { gap: 10px; margin-bottom: 8px; }
.oc-community .oc-feed-card .oc-chips .oc-badge { padding: 0; background: transparent; box-shadow: none; font-size: 12.5px; font-weight: 500; color: var(--gray-500); }
.oc-community .oc-feed-card .oc-chips .oc-badge-unresolved { color: var(--color-warning-text); }
.oc-community .oc-feed-card .oc-chips .oc-badge-resolved { color: var(--color-success-text); }
.oc-community .oc-feed-title { font-size: 16px; margin-bottom: 6px; }
.oc-community .oc-feed-card .oc-author { font-weight: 400; }
/* 좋아요 0 = 회색 알약 → 회색 글자(누른 뒤 빨간 하트는 .is-liked 가 그대로 이긴다) */
.oc-community .oc-like { height: auto; padding: 0; background: transparent; color: var(--gray-500); font-weight: 400; }
.oc-community .oc-like:hover { background: transparent; color: var(--gray-700); }
/* ⋯ 단추는 마우스를 올린 글에서만 — 마우스가 없는 화면(터치)은 늘 보인다 */
@media (hover: hover) {
	.oc-community .oc-more-btn { opacity: 0; }
	.oc-community .oc-feed-card:hover .oc-more-btn,
	.oc-community .oc-more-btn:focus-visible,
	.oc-community .oc-more-btn[aria-expanded="true"] { opacity: 1; }
}

/* 설문 보기 — 테두리 칸 대신 옅은 회색 면(밸런스 타일은 원래 모양) */
.oc-community .oc-poll-opt,
.oc-community .oc-feed-card .oc-poll-opt { border: 0; background: var(--gray-50); }
.oc-community .oc-poll-opt:hover { background: var(--gray-100); }

/* 오른쪽 — 상자 테두리를 걷고 간격으로 */
.oc-community .oc-widgets { gap: 28px; }
.oc-community .oc-widgets .oc-card { border: 0; background: var(--gray-50); }
.oc-community .oc-now-head { font-weight: 500; }