/* 페이스튜디오 모바일 — 공지사항 (목록: 카드 / 상세: 헤더 카드 + 본문 카드) */
.pm-notice-page { padding: 16px; }

/* 목록 (썸네일 없이 제목 + 날짜, 카드형) */
.pm-nlist { display: flex; flex-direction: column; gap: 10px; }
.pm-nitem {
    background: var(--pm-card);
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(31, 41, 51, .05);
}
.pm-nitem a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px;
}
.pm-nitem__badge {
    font-size: 11px;
    font-weight: 600;
    color: var(--pm-green);
    background: var(--pm-soft);
    padding: 3px 8px;
    border-radius: 7px;
    flex: none;
}
.pm-nitem__title {
    flex: 1;
    min-width: 0;
    font-size: 15px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pm-nitem__date { font-size: 12px; color: var(--pm-muted); flex: none; }

/* 빈 상태 */
.pm-empty-box { display: flex; flex-direction: column; align-items: center; gap: 11px; padding: 60px 24px; color: var(--pm-muted); }
.pm-empty-box__ic {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--pm-soft);
    color: var(--pm-green);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}
.pm-empty-box p { font-size: 14px; }

/* 상세 — 헤더 카드(제목·작성자·작성일) + 본문 카드 */
.pm-ndetail { padding: 16px; display: flex; flex-direction: column; gap: 13px; }
.pm-ndetail__head {
    background: var(--pm-card);
    border-radius: 16px;
    padding: 20px 18px;
    box-shadow: 0 2px 10px rgba(31, 41, 51, .05);
}
.pm-ndetail__title { font-size: 20px; font-weight: 700; line-height: 1.35; }
.pm-ndetail__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 11px;
    font-size: 13px;
    color: var(--pm-muted);
}
.pm-ndetail__dot { opacity: .5; }
.pm-ndetail__card {
    background: var(--pm-card);
    border-radius: 16px;
    padding: 20px 18px;
    box-shadow: 0 2px 10px rgba(31, 41, 51, .05);
}
.pm-ndetail__content { font-size: 15px; line-height: 1.7; color: var(--pm-text); word-break: break-word; }
.pm-ndetail__content img { max-width: 100%; height: auto; border-radius: 10px; margin: 10px 0; }
.pm-ndetail__content p { margin-bottom: 13px; }
.pm-ndetail__content h1, .pm-ndetail__content h2, .pm-ndetail__content h3 { font-weight: 700; margin: 18px 0 10px; line-height: 1.4; }
.pm-ndetail__content ul, .pm-ndetail__content ol { margin: 0 0 13px 20px; }
.pm-ndetail__content a { color: var(--pm-green); text-decoration: underline; }
