/**
 * NRS Workflow — Article View Page CSS
 *
 * [기사 상세 보기] admin 페이지의 스타일.
 * 색상은 nrs-shared의 CSS 변수 활용 (다크 모드 자동 적용).
 */

/* ─── 페이지 컨테이너 — LAYOUT_GRID_REQUIREMENTS §3.1: container 1200 = main 880 + gap 20 + side 300 */
.nrs-wf-article-view {
    max-width: 1200px;
    margin: 0 auto;
}

/* ─── 우상단 액션 바 ──────────────────────────────────────────────────── */
.nrs-wf-actions-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 12px 16px;
    margin: 16px 0 20px;
    background: var(--nrs-bg-secondary, #f9fafb);
    border: 1px solid var(--nrs-border-secondary, #e5e7eb);
    border-radius: 6px;
}

/* 상태 배지 */
.nrs-wf-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

/* 수정 요청 있음 배지 (점멸·강조) */
.nrs-wf-pending-revision-badge {
    background: var(--nrs-warning-primary, #d97706);
    color: #fff;
    border: none;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    animation: nrs-wf-pulse 1.6s ease-in-out infinite;
}

@keyframes nrs-wf-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.85; transform: scale(1.05); }
}

.nrs-wf-pending-revision-badge:hover {
    background: var(--nrs-warning-hover, #b45309);
}

/* 버튼 영역 */
.nrs-wf-actions-buttons {
    margin-left: auto;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

/* 개별 버튼 색상 변형 */
.nrs-wf-btn--preview { color: var(--nrs-text-secondary, #50575e); }
.nrs-wf-btn--edit   {  }
.nrs-wf-btn--revision-request { background: var(--nrs-accent-primary, #2563eb); color: #fff; }
.nrs-wf-btn--delete { color: var(--nrs-danger-primary, #dc2626); border-color: var(--nrs-danger-primary, #dc2626); }
.nrs-wf-btn--reject { color: var(--nrs-warning-primary, #d97706); border-color: var(--nrs-warning-primary, #d97706); }
.nrs-wf-btn--approve { background: var(--nrs-success-primary, #16a34a); color: #fff; border-color: var(--nrs-success-primary, #16a34a); }
.nrs-wf-btn--request { background: var(--nrs-accent-primary, #2563eb); color: #fff; }

/* ─── 레이아웃 (Round 19 single source) — v2.2.0-227: 타임라인 우측 복원(2열) ───── */
.nrs-wf-article-view__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
}

@media (max-width: 1024px) {
    .nrs-wf-article-view__layout {
        grid-template-columns: 1fr;
    }
}

.nrs-wf-article-view__main {
    max-width: 880px;
    margin: 0 auto;
    width: 100%;
    min-width: 0;
    background: var(--nrs-bg-primary, #fff);
    border: 1px solid var(--nrs-border-secondary, #e5e7eb);
    border-radius: 6px;
    padding: 24px;
    box-sizing: border-box;
}

.nrs-wf-article-view__sidebar {
    /* NRS_WF_Sidebar가 책임 */
}

/* ─── 메타 정보 ─────────────────────────────────────────────────────── */
.nrs-wf-article-meta {
    /* v2.2.0-4 (요구5): 아티클 메타 너비 830 → 780px. */
    max-width: 780px;
    margin: 0 auto 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--nrs-border-secondary, #e5e7eb);
}
/* v2.2.0-207: 메타(발행/수정일시·등록자)가 본문 컬럼(.nrs-article-root 680px) 안으로 이동(v2.2.0-206).
   옛 상단 780px 중앙정렬 잔재 탓에 태블릿 폭에서 본문보다 우측으로 치우쳐 보였다 → 본문 좌측선에
   정확히 정렬되도록 자체 폭/좌우 마진 해제(데스크탑·모바일·태블릿 모두 동일 좌측선). */
/* v2.2.0-211: 메타(일시·등록자)는 본문 컬럼(.nrs-article-root)의 직계 자식이므로, 부모(본문)와
   100% 동일한 박스를 갖도록 강제(!important). 테마의 680 중앙정렬(.nrs-single-cols)·옛 780 중앙정렬
   규칙에 밀려 어긋나던 현상 차단 — 프런트/관리자, 모든 폭(데스크탑·태블릿·모바일)에서 제목과 동일 좌측선. */
.nrs-article-root > .nrs-wf-article-meta {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* 내부 날짜 행도 좌측선 고정(자체 들여쓰기 방지). */
.nrs-article-root > .nrs-wf-article-meta > .nrs-wf-article-dates {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* v2.2.0-4 (2026-05-31 운영자 지시): 톱바·프로필·저작권·태그·댓글 780px 중앙 정렬은
   editor-ui.css 의 각 규칙에서 margin 좌우 auto + max-width:780px 로 일원화(로드 순서
   충돌 방지). 본문(.nrs-article-root)은 가독성 위해 680px 유지. */

.nrs-wf-article-title {
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 16px;
    color: var(--nrs-text-primary, #111827);
}

.nrs-wf-meta-grid {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 8px 16px;
    margin: 0 auto;        /* v2.2.0-67: 본문과 동일하게 중앙정렬 */
    max-width: 680px;      /* v2.2.0-67: UID·주소·조회수 등 운영메타도 680px 폭 통일 */
    font-size: 13px;
}

.nrs-wf-meta-grid dt {
    font-weight: 600;
    color: var(--nrs-text-secondary, #50575e);
}

.nrs-wf-meta-grid dd {
    margin: 0;
    color: var(--nrs-text-primary, #111827);
}

.nrs-wf-meta-grid code {
    background: var(--nrs-bg-tertiary, #f3f4f6);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 12px;
}

/* ─── 미해결 수정 요청 영역 ─────────────────────────────────────────── */
.nrs-wf-pending-revision {
    margin: 20px 0;
    padding: 16px;
    background: var(--nrs-warning-bg, #fef3c7);
    border-left: 4px solid var(--nrs-warning-primary, #d97706);
    border-radius: 4px;
}

.nrs-wf-pending-revision h3 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--nrs-warning-primary, #d97706);
}

.nrs-wf-pending-revision__meta {
    font-size: 12px;
    color: var(--nrs-text-secondary, #50575e);
    margin: 0 0 12px;
}

.nrs-wf-pending-revision__notice {
    font-size: 12px;
    color: var(--nrs-text-tertiary, #6b7280);
    font-style: italic;
    margin: 8px 0 0;
}

/* ─── 본문 영역 ─────────────────────────────────────────────────────── */
.nrs-wf-article-content h3 {
    font-size: 16px;
    margin: 0 0 12px;
    color: var(--nrs-text-primary, #111827);
}

/* Round 19 (2026-05-24): `.nrs-wf-content-body` 의 폰트·크기·너비는 nrs-article.css 의
 * `.nrs-article-body` 가 책임 — 마크업이 두 클래스를 함께 사용하도록 ArticleViewPage 가 갱신됨.
 * 이 selector 는 호환을 위해 남기되 사이즈/폰트 정의는 하지 않는다. */
.nrs-wf-content-body { /* container only */ text-align: justify; } /* v2.2.0-19: 본문 양끝 정렬. */

.nrs-wf-content-body p {
    margin: 0 0 16px;
    text-align: justify;
}

.nrs-wf-content-body img {
    max-width: 100%;
    height: auto;
    margin: 8px 0;
}

/* ─────────────────────────────────────────────────────────────────────
 * Round 15 (2026-05-23) — 본문 미디어 강제 컨테인 + 메타 셀 줄바꿈
 *   - PC: <figure>/<img> 가 컬럼(780px)을 벗어나는 overflow 차단
 *   - PC: figure UA 기본 margin(1em 40px) reset — 텍스트(p) 좌측 정렬선과 일치
 *   - 모바일: 주소 행의 긴 URL/UID 강제 줄바꿈
 * ───────────────────────────────────────────────────────────────────── */

.nrs-wf-content-body { overflow-wrap: anywhere; }

/* Round 35 (2026-05-24): width: auto 제거 — TinyMCE 의 HTML width="N" 속성 존중. */
.nrs-wf-content-body img,
.nrs-wf-content-body video,
.nrs-wf-content-body iframe,
.nrs-wf-content-body embed,
.nrs-wf-content-body object {
    max-width: 100% !important;
    height: auto;
}

/* figure 류 — Round 29 (2026-05-24): top/bottom margin 도 16px 로 명시 (글 보기·미리보기 통일) */
.nrs-wf-content-body figure,
.nrs-wf-content-body .nrs-block-image,
.nrs-wf-content-body .nrs-block-embed,
.nrs-wf-content-body .nrs-block-video,
.nrs-wf-content-body .nrs-caption {
    max-width: 100% !important;
    /* Round 36 (2026-05-24): width: auto !important 제거 — inline style="width: Npx" 존중 */
    margin: 16px 0 !important;
    padding: 0 !important;
}
.nrs-wf-content-body figure img,
.nrs-wf-content-body .nrs-caption img {
    display: block;
    margin: 0 !important;
}

/* Round 35·36 (2026-05-24): NRS 표준 align 클래스 — longhand 명시 + float reset + clear. */
.nrs-wf-content-body .alignleft,
.nrs-wf-content-body figure.alignleft,
.nrs-wf-content-body img.alignleft {
    float: left !important;
    margin-top: 8px !important;
    margin-right: 1.5em !important;
    margin-bottom: 8px !important;
    margin-left: 0 !important;
    clear: none;
}
.nrs-wf-content-body .alignright,
.nrs-wf-content-body figure.alignright,
.nrs-wf-content-body img.alignright {
    float: right !important;
    margin-top: 8px !important;
    margin-right: 0 !important;
    margin-bottom: 8px !important;
    margin-left: 1.5em !important;
    clear: none;
}
.nrs-wf-content-body .aligncenter,
.nrs-wf-content-body figure.aligncenter {
    display: block !important;
    float: none !important;
    margin-top: 16px !important;
    margin-right: auto !important;
    margin-bottom: 16px !important;
    margin-left: auto !important;
    text-align: center;
    clear: both;
}
.nrs-wf-content-body .alignnone,
.nrs-wf-content-body figure.alignnone {
    float: none !important;
    margin-top: 8px !important;
    margin-right: 0 !important;
    margin-bottom: 8px !important;
    margin-left: 0 !important;
}
.nrs-wf-content-body::after {
    content: "";
    display: table;
    clear: both;
}

/* figcaption — Round 29: 사진과의 여백 8px 고정 (admin core CSS leak 차단) */
.nrs-wf-content-body figure figcaption,
.nrs-wf-content-body .nrs-block-image figcaption,
.nrs-wf-content-body .nrs-caption .nrs-caption-text,
.nrs-wf-content-body .nrs-caption-text {
    margin: 8px 0 0 !important;
    padding: 0 !important;
    text-align: left;
    font-size: 14px;
    line-height: 1.4;
    color: var(--nrs-text-primary, #111827);   /* 2026-09-27 안 A(옛 #6b7280) */
}

/* Gutenberg align 변형도 컬럼 폭에 가둠 */
.nrs-wf-content-body .alignwide,
.nrs-wf-content-body .alignfull {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 메타 그리드 — 긴 URL/UID 강제 줄바꿈 */
.nrs-wf-meta-grid dd {
    min-width: 0;
    word-break: break-all;
    overflow-wrap: anywhere;
}
.nrs-wf-meta-grid dd a,
.nrs-wf-meta-grid dd code {
    word-break: break-all;
    overflow-wrap: anywhere;
}

/* ─── 모달 다이얼로그 ──────────────────────────────────────────────── */
.nrs-wf-modal-overlay {
    position: fixed;
    inset: 0;
    background: var(--nrs-overlay-bg, rgba(0,0,0,0.5));
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.nrs-wf-modal {
    background: var(--nrs-bg-primary, #fff);
    border-radius: 8px;
    box-shadow: var(--nrs-shadow-modal, 0 25px 50px rgba(0,0,0,0.25));
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

.nrs-wf-modal--wide {
    max-width: 1100px;
}

.nrs-wf-modal__header {
    padding: 16px 20px;
    border-bottom: 1px solid var(--nrs-border-secondary, #e5e7eb);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nrs-wf-modal__title {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    color: var(--nrs-text-primary, #111827);
}

.nrs-wf-modal__body {
    padding: 20px;
}

.nrs-wf-modal__footer {
    padding: 12px 20px;
    border-top: 1px solid var(--nrs-border-secondary, #e5e7eb);
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.nrs-wf-modal__close {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 20px;
    color: var(--nrs-text-tertiary, #6b7280);
}

/* 모달 내 입력 */
.nrs-wf-modal__field {
    margin-bottom: 16px;
}

.nrs-wf-modal__field label {
    display: block;
    margin-bottom: 4px;
    font-size: 13px;
    color: var(--nrs-text-secondary, #50575e);
}

.nrs-wf-modal__field textarea {
    width: 100%;
    min-height: 80px;
    padding: 8px;
    border: 1px solid var(--nrs-border-primary, #d1d5db);
    border-radius: 4px;
}

/* (다국어 매핑 영역 — 휴지통·반려 창의 그 칸과 함께 2026-09-29 E5 로 지움) */

/* 수정 본문 비교 모달 */
.nrs-wf-revision-compare {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 16px 0;
}

.nrs-wf-revision-compare__panel {
    padding: 16px;
    background: var(--nrs-bg-secondary, #f9fafb);
    border: 1px solid var(--nrs-border-secondary, #e5e7eb);
    border-radius: 4px;
    max-height: 400px;
    overflow-y: auto;
}

.nrs-wf-revision-compare__panel h4 {
    margin: 0 0 8px;
    font-size: 13px;
    color: var(--nrs-text-secondary, #50575e);
}

.nrs-wf-revision-compare__content {
    font-size: 13px;
    line-height: 1.6;
}

.nrs-wf-diff-added {
    background: var(--nrs-success-bg, #dcfce7);
    color: var(--nrs-success-primary, #16a34a);
}

.nrs-wf-diff-removed {
    background: var(--nrs-danger-bg, #fee2e2);
    color: var(--nrs-danger-primary, #dc2626);
    text-decoration: line-through;
}

/* ─── 모바일 반응형 ────────────────────────────────────────────────── */
@media (max-width: 640px) {
    .nrs-wf-actions-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .nrs-wf-actions-buttons {
        margin-left: 0;
        width: 100%;
    }

    .nrs-wf-actions-buttons .nrs-wf-btn {
        flex: 1;
        min-width: 0;
    }

    .nrs-wf-meta-grid {
        grid-template-columns: 80px 1fr;
        font-size: 12px;
    }

    .nrs-wf-revision-compare {
        grid-template-columns: 1fr;
    }
}

/* ─── 본문비교 모달 (이벤트 [본문비교] 버튼) ───────────────────── */
.nrs-wf-compare-modal[hidden] { display: none !important; }
.nrs-wf-compare-modal {
    position: fixed;
    inset: 0;
    z-index: 100100;
}
.nrs-wf-compare-modal__bd {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
}
.nrs-wf-compare-modal__dlg {
    position: relative;
    margin: 4vh auto;
    width: min(95vw, 1280px);
    height: 90vh;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 24px 48px rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.nrs-wf-compare-modal__hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    background: #1f2937;
    color: #fff;
    flex: 0 0 auto;
}
.nrs-wf-compare-modal__hd h3 { margin: 0; font-size: 16px; color: #fff; }
.nrs-wf-compare-modal__close {
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
/* 2026-09-20: iframe(revision.php) → AJAX 로 받은 차이 표(코어 리비전 화면과 같은 table.diff — 색은 코어 revisions.css) */
.nrs-wf-compare-modal__body {
    flex: 1;
    overflow: auto;
    background: #fff;
    padding: 12px 18px 18px;
}
.nrs-wf-compare-modal__meta { margin: 0 0 8px; color: #4b5563; font-size: 13px; white-space: pre-wrap; }
.nrs-wf-compare-modal__meta:empty { display: none; }
.nrs-wf-compare-modal__status { margin: 24px 0; color: #6b7280; text-align: center; }
.nrs-wf-compare-modal__status--error { color: #b91c1c; }
.nrs-wf-compare-field__name { margin: 16px 0 6px; font-size: 14px; color: #111827; }
.nrs-wf-compare-field__name:first-child { margin-top: 4px; }
.nrs-wf-compare-field__diff table.diff { width: 100%; }

/* 이벤트 항목의 [본문비교] 버튼 스타일 */
.nrs-wf-event-item__compare {
    background: #e0f2fe;
    color: #075985;
    border: 1px solid #bae6fd;
    border-radius: 12px;
    padding: 1px 8px;
    font-size: 11px;
    line-height: 1.4;
    cursor: pointer;
}
.nrs-wf-event-item__compare:hover {
    background: #bae6fd;
}

/* ── 다국어 페어링 언어 스위처(독자용) — 같은 UID 연결 기사로 이동. N개국어 데이터 구동. ── */
.nrs-lang-switcher {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    /* v2.2.0-214: 본문(680px)과 동일 폭으로 제한·중앙정렬. 관리자 글보기(__main 880)에서 스위처가
       full-width 로 본문보다 넓게 나오던 문제 수정. 프런트 태블릿/모바일(≤1023)은 아래 단일기사
       리셋에서 100%(본문과 동일)로 풀린다. */
    /* v2.2.0-215: 관리자 글보기는 테마 style.css(전역 box-sizing:border-box)를 로드하지 않아,
       max-width:680 이 콘텐츠폭으로 해석되고 좌우 패딩·테두리가 더해져 바깥폭이 ~706 → 본문(680)보다
       튀어나왔다. border-box 명시로 max-width:680 = 바깥폭 = 본문폭 일치(프런트는 이미 border-box라 무변화). */
    box-sizing: border-box;
    max-width: 680px;
    margin: 0 auto 14px;
    padding: 7px 12px;
    background: #f4f6f8;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-size: 13px;
}
.nrs-lang-switcher__label {
    color: #6b7280;
    font-weight: 600;
    /* v2.2.0-133: 콜론(:) 제거. 라벨↔언어버튼 여백을 버튼 간격(8px)의 1.5배(=12px)로:
     *   flex gap 8px + 라벨 margin-right 4px = 12px. (버튼↔버튼은 8px 유지.) */
    margin-right: 4px;
}
.nrs-lang-switcher__current {
    font-weight: 700;
    color: #111827;
    padding: 2px 8px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 4px;
}
.nrs-lang-switcher__link {
    padding: 2px 8px;
    color: var(--nrs-color-primary, #0a3a6b);
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.nrs-lang-switcher__link:hover {
    background: #fff;
    border-color: #c7d2e0;
    text-decoration: underline;
}

/* v2.2.0-135: 독자용 날짜 — 수정일시 옆 꺽쇠(클릭 시 발행일시 펼침).
   2026-09-29(운영자 "수정일시의 위치가 변하면 안 된다"): 두 칸 격자 — 윗줄 수정일시·꺾쇠, 펼치면 발행일시만 아랫줄에.
   (옛 flex-wrap 은 펼친 발행일시가 줄 전체 폭을 차지해 묶음 폭이 커지고 옆 칸이 밀렸다.) */
.nrs-wf-article-dates--reader { display: grid; grid-template-columns: max-content max-content; justify-content: start; align-items: center; gap: 4px 8px; }
.nrs-article-date-toggle {
    -webkit-appearance: none; appearance: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; background: none; border: 0; margin: 0 0 0 2px; padding: 0;
    cursor: pointer; color: #9aa3ad; line-height: 0; border-radius: 4px;
    transition: background .12s ease, color .12s ease;
}
.nrs-article-date-toggle:hover { color: #4b5563; background: #f3f4f6; }
.nrs-article-date-toggle__chevron { display: inline-flex; }
.nrs-article-date-toggle__chevron svg { display: block; }
.nrs-article-date-toggle__chevron .nrs-chev--up { display: none; }
.nrs-article-date-toggle.is-open .nrs-article-date-toggle__chevron .nrs-chev--down { display: none; }
.nrs-article-date-toggle.is-open .nrs-article-date-toggle__chevron .nrs-chev--up { display: block; }
.nrs-wf-article-dates--reader .nrs-article-date-pub[hidden] { display: none; }
/* 펼친 발행일시: 아랫줄 왼쪽부터(두 칸에 걸침). 칸 폭 계산에서는 뺀다(contain) — 발행일시가 더 길어도
   (영어 'Published' > 'Updated') 윗줄 칸이 넓어져 꺾쇠·옆 단추가 밀리지 않게. */
.nrs-wf-article-dates--reader .nrs-article-date-pub { grid-column: 1 / -1; margin: 0; color: #6b7280; contain: inline-size; white-space: nowrap; }
/* 구글 선호 출처 단추가 날짜 옆에 있으면 윗줄을 단추 높이(28px — blocks.css .nrs-article-gpref 와 짝)로 맞추고
   단추는 위에 붙인다 — 머리 메타를 가로로 놓은 테마(공정경제 = 가운데 맞춤)에서 펼쳐도 단추가 내려오지 않게. */
.nrs-wf-article-meta:has(> .nrs-article-gpref) > .nrs-wf-article-dates--reader { grid-template-rows: minmax(28px, auto); }
.nrs-wf-article-meta > .nrs-article-gpref { align-self: flex-start; }

/* ──────────────────────────────────────────────────────────────────────────
 * v2.2.0-188: 독자 도구 바(뉴스웍스식 아이콘 quick-tool)
 * 출력 · 글씨 줄이기/키우기 · 즐겨찾기 · 공유 — 아이콘 버튼 + hover 툴팁(title).
 * ────────────────────────────────────────────────────────────────────────── */
.nrs-article-tools.nrs-quick-tool {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 0 0 auto;
    flex-wrap: wrap;
    /* v2.2.0-204: 팝오버(글자크기·즐겨찾기·공유) 박스를 각 버튼이 아니라 '바' 오른쪽 끝(=공유 버튼
       오른쪽 끝)에 정렬하기 위해 바를 위치 기준(positioning context)으로 삼는다. */
    position: relative;
}
/* v2.2.0-199: (구) 인라인 글씨크기 칩 무력화 규칙 제거 — 이제 .nrs-article-scale-tools 는
   글자크기 '팝오버 메뉴'에만 붙으므로, 무력화하면 팝오버 박스(테두리·배경)가 사라진다.
   팝오버 박스 스타일은 아래 .nrs-article-fontsize__menu 가 책임진다. */

/* v2.2.0-198(로이터식): 공통 아이콘 버튼 — 라운드 옅은 회색 정사각 외곽선 박스 + 아이콘. */
.nrs-qt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    background: #fff;
    border: 1px solid #d9dde3;
    border-radius: 8px;
    color: #374151;
    cursor: pointer;
    line-height: 0;
    text-decoration: none;
    transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.nrs-qt-btn:hover { background: #f3f4f6; border-color: #c3c9d2; color: #111827; }
.nrs-qt-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 1px; }
.nrs-qt-btn[aria-expanded="true"] { background: #eef2ff; border-color: #c7d2fe; color: #1d4ed8; }
.nrs-qt-ico, .nrs-qt-btn svg { display: block; }

/* 글자 크기 토글 'Aa' 표준 글리프(v2.2.0-229, 운영자 승인): 큰 A + 작은 a 로 크기 대비
   (macOS·iOS·NYT 표준 텍스트크기 아이콘). 같은 크기 평문 'aA'(인지 어려움) 대체. */
.nrs-qt-fs-ico { display: inline-flex; align-items: baseline; font-family: inherit; font-weight: 700; line-height: 1; color: inherit; }
.nrs-qt-fs-lg { font-size: 18px; }
.nrs-qt-fs-sm { font-size: 12px; margin-left: .5px; }

/* 글자 크기 팝오버(로이터식 '가' — 서로 다른 크기, 클릭 시 그 크기로 본문 변경).
   2026-09-29 7단계 → 5단계(운영자 지시 · 목업 승인): 글리프 12·15·18·23·28px(예전 7개의 양 끝·가운데 그대로 + 사이 둘). */
/* v2.2.0-204: 래퍼를 static 으로 — 메뉴 right:0 이 버튼이 아니라 '바'(toolbar) 오른쪽 끝에 정렬되도록. */
.nrs-article-fontsize { position: static; }
.nrs-article-fontsize__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    margin: 0;   /* nrs-article.css 의 .nrs-article-scale-tools margin:12px 0 무력화 */
    display: flex;
    align-items: flex-end;
    gap: 4px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
}
.nrs-article-fontsize__menu[hidden] { display: none; }
.nrs-fs-step {
    -webkit-appearance: none; appearance: none;
    background: none; border: 0; margin: 0; padding: 2px 6px;
    /* nrs-article.css .nrs-article-scale-tools__btn(min-width:32px·height:28px) 무력화 */
    min-width: 0; width: auto; height: auto; min-height: 0;
    cursor: pointer; color: var(--nrs-text-primary, #111827); font-family: inherit; font-weight: 700;   /* 2026-09-27 안 A(옛 #6b7280) */
    line-height: 1; border-radius: 4px;
}
.nrs-fs-step:hover { background: #f3f4f6; color: #111827; }
.nrs-fs-step--m2 { font-size: 12px; }
.nrs-fs-step--m1 { font-size: 15px; }
.nrs-fs-step--0  { font-size: 18px; }
.nrs-fs-step--p1 { font-size: 23px; }
.nrs-fs-step--p2 { font-size: 28px; }
/* 현재 단계 강조(스케일 엔진이 active 클래스 부여). */
.nrs-fs-step.nrs-article-scale-tools__btn--active { color: #1d4ed8; background: #eef2ff; }

/* 즐겨찾기 ON — 리본 채움 + 강조색. */
.nrs-article-bookmark.is-on { color: #f59e0b; border-color: #fcd34d; background: #fffbeb; }
.nrs-article-bookmark.is-on .nrs-bm-mark { fill: #f59e0b; stroke: #f59e0b; }

/* 공유 드롭다운. */
.nrs-article-share { position: static; }
.nrs-article-share__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    min-width: 170px;
    padding: 6px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.nrs-article-share__menu[hidden] { display: none; }
.nrs-share-item {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 8px 10px;
    background: none;
    border: 0;
    border-radius: 6px;
    color: #1f2937;
    font-size: 13px;
    font-family: inherit;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}
.nrs-share-item:hover { background: #f3f4f6; }
.nrs-share-item__dot {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    display: inline-block;
}
.nrs-share-item__label { white-space: nowrap; }

/* 토스트 알림. */
.nrs-reader-toast {
    position: fixed;
    left: 50%;
    bottom: 32px;
    transform: translateX(-50%) translateY(12px);
    z-index: 9999;
    max-width: 90vw;
    padding: 10px 18px;
    background: rgba(17, 24, 39, .92);
    color: #fff;
    font-size: 13px;
    border-radius: 999px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
}
.nrs-reader-toast.is-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* v2.2.0-187: 즐겨찾기 패널 — 스위치 + 담은 기사 리스트. */
.nrs-article-bookmark-wrap { position: static; }
.nrs-article-bookmark-panel {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    width: 280px;
    max-width: 86vw;
    padding: 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
}
.nrs-article-bookmark-panel[hidden] { display: none; }
.nrs-bm-panel__head {
    font-size: 13px;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px;
}

/* 선택/해제 스위치 행. */
.nrs-bm-switch-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0 10px;
    border-bottom: 1px solid #f0f1f3;
}
.nrs-bm-switch-row__label { font-size: 13px; color: #374151; }
.nrs-bm-switch {
    position: relative;
    flex: 0 0 auto;
    width: 40px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #cbd5e1;
    cursor: pointer;
    transition: background .15s ease;
}
.nrs-bm-switch__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
    transition: transform .15s ease;
}
.nrs-bm-switch[aria-checked="true"] { background: #f59e0b; }
.nrs-bm-switch[aria-checked="true"] .nrs-bm-switch__thumb { transform: translateX(18px); }

/* 담은 기사 리스트. */
.nrs-bm-list { padding-top: 9px; }
.nrs-bm-list__title {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    margin: 0 0 6px;
}
.nrs-bm-list__items {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 240px;
    overflow-y: auto;
}
.nrs-bm-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 0;
}
.nrs-bm-item__link {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
    color: #1f2937;
    text-decoration: none;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.nrs-bm-item__link:hover { color: #1d4ed8; text-decoration: underline; }
.nrs-bm-item__remove {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    line-height: 1;
    font-size: 16px;
    color: #9ca3af;
    background: none;
    border: 0;
    border-radius: 4px;
    cursor: pointer;
}
.nrs-bm-item__remove:hover { color: #dc2626; background: #fef2f2; }
.nrs-bm-list__loading,
.nrs-bm-list__empty {
    font-size: 12px;
    color: #9ca3af;
    padding: 6px 0;
}

/* 로그인 안내(미로그인). */
.nrs-bm-login { text-align: center; padding: 6px 0 2px; }
.nrs-bm-login__msg { font-size: 13px; color: #4b5563; margin: 0 0 10px; }
.nrs-bm-login__btn {
    display: inline-block;
    padding: 7px 18px;
    background: #f59e0b;
    color: #fff;
    font-size: 13px;
    border-radius: 6px;
    text-decoration: none;
}
.nrs-bm-login__btn:hover { background: #d97706; }

/* 모바일: 아이콘 버튼 약간 축소. */
@media (max-width: 600px) {
    .nrs-qt-btn { width: 32px; height: 32px; }
}

/* 다크 모드 — 기사 도구 단추 · 메뉴(2026-09-27 ⑥ — 공통 팔레트 · autonews 세션). editor-ui.css 끝 다크 블록과 같은 스위치 · 범위, 인쇄 제외.
   인쇄 · 글자 크기 · 책갈피 · 공유 단추와 글자 크기 · 공유 메뉴가 다크에서 흰 면으로 남던 것.
   (바로 위에 있던 9/12 머리 작성자 글자색 블록은 2026-09-29 머리 등록자 줄을 빼면서 함께 뺐다.) */
@media screen {
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-qt-btn { background: var(--nrs-bg-primary); border-color: var(--nrs-border-primary); color: var(--nrs-text-primary); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-qt-btn:hover { background: var(--nrs-bg-hover); color: var(--nrs-text-primary); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-qt-btn[aria-expanded="true"] { background: var(--nrs-accent-bg); border-color: var(--nrs-accent-primary); color: var(--nrs-accent-text); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-article-bookmark.is-on { background: #422006; border-color: #854d0e; color: #fbbf24; }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-article-bookmark.is-on .nrs-bm-mark { fill: #fbbf24; stroke: #fbbf24; }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-article-fontsize__menu,
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-article-share__menu { background: var(--nrs-bg-secondary); border-color: var(--nrs-border-secondary); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-fs-step:hover,
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-share-item:hover { background: var(--nrs-bg-hover); color: var(--nrs-text-primary); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-fs-step.nrs-article-scale-tools__btn--active { background: var(--nrs-accent-bg); color: var(--nrs-accent-text); }
    body.nrs-scheme-dark .nrs-wf-article-view__main .nrs-share-item { color: var(--nrs-text-primary); }
}
@media screen and (prefers-color-scheme: dark) {
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-qt-btn { background: var(--nrs-bg-primary); border-color: var(--nrs-border-primary); color: var(--nrs-text-primary); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-qt-btn:hover { background: var(--nrs-bg-hover); color: var(--nrs-text-primary); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-qt-btn[aria-expanded="true"] { background: var(--nrs-accent-bg); border-color: var(--nrs-accent-primary); color: var(--nrs-accent-text); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-article-bookmark.is-on { background: #422006; border-color: #854d0e; color: #fbbf24; }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-article-bookmark.is-on .nrs-bm-mark { fill: #fbbf24; stroke: #fbbf24; }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-article-fontsize__menu,
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-article-share__menu { background: var(--nrs-bg-secondary); border-color: var(--nrs-border-secondary); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-fs-step:hover,
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-share-item:hover { background: var(--nrs-bg-hover); color: var(--nrs-text-primary); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-fs-step.nrs-article-scale-tools__btn--active { background: var(--nrs-accent-bg); color: var(--nrs-accent-text); }
    body.nrs-scheme-auto .nrs-wf-article-view__main .nrs-share-item { color: var(--nrs-text-primary); }
}
