/* 플럭스 매거진 카드 스킨 - 뉴스 플랫폼형(썸네일 없음) 목록 + 글 보기. 땅튜브 다크 톤.
   색은 아래 「토큰 재대입」 한 덩이에서만 정한다(--fx-* / --fs-*). 그림자 없음. 한글 keep-all, 숫자 tabular-nums.
   폭 전환은 뷰포트가 아니라 컨테이너 쿼리(본문 폭이 사이드바 때문에 좁아도 깨지지 않게). 주황은 활성 탭·분류 글자·번호·호버·페이지 활성에만. */

/* ── 토큰 재대입(한 덩이) ── */
.fxmgc-board.fx-ui,
.fxmgc-view.fx-ui {
	--fx-canvas: #0f0f0f; --fx-surface: #1c1c1c; --fx-sunken: #171717;
	--fx-ink: #f2f3f5; --fx-ink-2: #b5bac1; --fx-ink-3: #9ca3af;
	--fx-line: #262626; --fx-line-strong: #3a3a3a;
	--fx-accent: #ff6b00; --fx-accent-hover: #ff8533; --fx-on-accent: #0f0f0f;
	--fs-primary: #f2f3f5; --fs-primary-light: #b5bac1; --fs-primary-hover: #ffffff; --fs-primary-bg: #1c1c1c; --fs-primary-border: #3a3a3a;
	--fs-text: #f2f3f5; --fs-text-sub: #b5bac1; --fs-text-muted: #9ca3af;
	--fs-bg: #0f0f0f; --fs-bg-light: #1c1c1c; --fs-bg-hover: #1c1c1c;
	--fs-border: #262626; --fs-border-dark: #3a3a3a;
	--fs-accent: #ff6b00; --fs-shadow: none; --fs-shadow-sm: none;
	--fxmgc-orange: #ff6b00;
	--fxmgc-white: #fff; --fxmgc-ink-strong: #cfd2d8; --fxmgc-ink-body: #e5e5e5; --fxmgc-ink-sum: #e1e3e7; --fxmgc-no: #6b7280;
	--fxmgc-rule: #3f4147; --fxmgc-dash: #444; --fxmgc-ghost: #ffffff08; --fxmgc-danger: #f87171;
}

/* ── 바탕·폭·컨테이너 ── */
.fxmgc-board.fx-ui,
.fluxboard-board-view.fluxboard-board-view.fxmgc-view {
	width: 100%; max-width: var(--maxw, 1200px); margin: 0 auto; padding: 24px var(--pad-x, 16px) 56px; box-sizing: border-box;
	background: var(--fx-canvas); color: var(--fx-ink);
	font-family: "Pretendard Variable", "Pretendard", "Noto Sans KR", "Malgun Gothic", sans-serif;
	font-size: 15px; line-height: 1.6; word-break: keep-all; font-variant-numeric: tabular-nums;
	container-type: inline-size;
}
.fxmgc-board *, .fxmgc-board *::before, .fxmgc-board *::after,
.fxmgc-view *, .fxmgc-view *::before, .fxmgc-view *::after { box-sizing: border-box; }
.fxmgc-board a, .fxmgc-view a { color: inherit; text-decoration: none; }
.fxmgc-board a:focus-visible, .fxmgc-view a:focus-visible,
.fxmgc-view button:focus-visible, .fxmgc-view summary:focus-visible, .fxmgc-board button:focus-visible {
	outline: 2px solid var(--fx-accent); outline-offset: 2px; border-radius: 2px;
}
:where(.fxmgc-board h2, .fxmgc-board h3, .fxmgc-board h4, .fxmgc-board p, .fxmgc-board ol, .fxmgc-board ul,
.fxmgc-view h1, .fxmgc-view h2, .fxmgc-view h3, .fxmgc-view p, .fxmgc-view ol, .fxmgc-view ul) { margin: 0; padding: 0; }
:where(.fxmgc-board ol, .fxmgc-board ul, .fxmgc-view ol, .fxmgc-view ul) { list-style: none; }
.fxmgc-view .screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ── 공통 부품 ── */
/* ── 공통 부품 ── */
.fxmgc-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 0; margin: 14px 0 0 -21px; clip-path: inset(0 0 0 21px); font-size: 14px; line-height: 1.5; color: var(--fx-ink-3); }
.fxmgc-meta > * { white-space: nowrap; }
/* 구분선: 항목 앞에 두고, 줄 맨 앞 항목은 왼쪽으로 밀어 잘라내 둘째 줄 앞에 선이 남지 않게 */
.fxmgc-meta > *::before { content: ""; display: inline-block; width: 1px; height: 10px; margin: 0 10px; background: var(--fx-line-strong); vertical-align: -1px; }
.fxmgc-meta b { color: var(--fx-ink-2); font-weight: 600; }
.fxmgc-meta .fxmgc-meta__cm { color: var(--fx-ink); }
.fxmgc-info__line > * { white-space: nowrap; }
.fxmgc-sec { font-size: 15px; font-weight: 800; line-height: 1.4; padding-bottom: 10px; border-bottom: 1px solid var(--fx-line-strong); color: var(--fx-ink); }

/* ── 머리 + 분류 탭 ── */
.fxmgc-head { padding-top: 4px; }
.fxmgc-head__row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.fxmgc-head__title { font-size: 28px; font-weight: 800; letter-spacing: -.02em; line-height: 1.3; color: var(--fx-ink); }
.fxmgc-head__count { flex: none; font-size: 14px; color: var(--fx-ink-3); }
.fxmgc-head__sub { margin-top: 8px; font-size: 14px; line-height: 1.6; color: var(--fx-ink-2); }

.fxmgc-tabs { margin-top: 20px; }
.fxmgc-tabs .fluxboard-category-filter {
	display: flex; flex-wrap: nowrap; align-items: stretch; gap: 4px; margin: 0; padding: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
	border-bottom: 1px solid var(--fx-line);
}
.fxmgc-tabs .fluxboard-category-filter::-webkit-scrollbar { display: none; }
.fxmgc-tabs .fluxboard-category-filter__item {
	flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 48px; padding: 0 12px; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; border-radius: 0;
	background: none; color: var(--fx-ink-2); font-size: 15px; font-weight: 500; transition: color .2s;
}
.fxmgc-tabs .fluxboard-category-filter__item:first-child { padding-left: 0; }
.fxmgc-tabs .fluxboard-category-filter__item:hover { color: var(--fx-ink); background: none; border-color: transparent; }
.fxmgc-tabs .fluxboard-category-filter__item--active, .fxmgc-tabs .fluxboard-category-filter__item--active:hover { color: var(--fx-ink); font-weight: 700; border-bottom-color: var(--fx-accent); background: none; }
.fxmgc-tabs .fluxboard-category-filter__arrow { display: none; }
.fxmgc-tabs .fluxboard-category-filter__sub { display: flex; flex-wrap: nowrap; gap: 2px; margin: 8px 0 0; padding: 0; border: 0; overflow-x: auto; scrollbar-width: none; }
.fxmgc-tabs .fluxboard-category-filter__sub-item { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: 0; font-size: 14px; color: var(--fx-ink-3); background: none; }
.fxmgc-tabs .fluxboard-category-filter__sub-item:hover, .fxmgc-tabs .fluxboard-category-filter__sub-item--active { color: var(--fx-accent); background: none; }

/* ── 헤드라인: 큰 글 1 + 다음 3(상자·배경 없이 선과 바탕만) ── */
.fxmgc-top { display: block; padding: 28px 0 32px; border-bottom: 1px solid var(--fx-line); }
.fxmgc-big { position: relative; min-width: 0; }
.fxmgc-kick { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-bottom: 12px; font-size: 13px; font-weight: 600; color: var(--fx-accent); }
.fxmgc-kick span { color: var(--fx-ink-3); font-weight: 400; }
.fxmgc-big__title { font-size: 24px; line-height: 1.4; font-weight: 700; letter-spacing: -.02em; overflow-wrap: anywhere; }
.fxmgc-big__title a::after, .fxmgc-hl__title a::after, .fxmgc-it__title a::after { content: ""; position: absolute; inset: 0; }
.fxmgc-big__title a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; text-decoration-color: transparent; transition: text-decoration-color .3s var(--fxmgc-ease, ease); }
.fxmgc-big:hover .fxmgc-big__title a { text-decoration-color: var(--fx-accent); }
.fxmgc-sum { margin-top: 20px; border-top: 1px solid var(--fx-line); }
.fxmgc-sum li { display: grid; grid-template-columns: 28px minmax(0, 1fr); padding: 10px 0; border-bottom: 1px solid var(--fx-line); font-size: 15px; line-height: 1.65; color: var(--fx-ink-2); }
.fxmgc-sum li i { font-style: normal; font-size: 13px; font-weight: 700; color: var(--fx-accent); padding-top: 2px; }
.fxmgc-big__excerpt { margin-top: 16px; font-size: 15px; line-height: 1.65; color: var(--fx-ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fxmgc-big .fxmgc-meta { position: relative; }

.fxmgc-hl { margin-top: 28px; border-top: 1px solid var(--fx-line-strong); }
.fxmgc-hl__item { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 0 4px; padding: 16px 0; border-bottom: 1px solid var(--fx-line); }
.fxmgc-hl__no { font-size: 15px; font-weight: 700; line-height: 1.5; color: var(--fx-ink-3); }
.fxmgc-hl__title { font-size: 16px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; transition: color .2s; }
.fxmgc-hl__item:hover .fxmgc-hl__title { color: var(--fx-accent); }
.fxmgc-hl__sm { margin-top: 6px; font-size: 13px; color: var(--fx-ink-3); }

/* ── 본문 칸 + 오른쪽 칸 ── */
.fxmgc-wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 8px; }
.fxmgc-view .fxmgc-wrap { margin-top: 0; }
.fxmgc-main { min-width: 0; }
.fxmgc-rail { min-width: 0; margin-top: 48px; }
.fxmgc-rail:not(:has(.fxmgc-pop)) { display: none; }
.fxmgc-rail__h { margin: 0 0 12px; font-size: 13px; font-weight: 600; letter-spacing: .06em; color: var(--fx-ink-3); }
.fxmgc-pop__list { margin-bottom: 28px; }
.fxmgc-pop__item { display: flex; gap: 10px; padding: 12px 0; border-top: 1px solid var(--fx-line); font-size: 14px; line-height: 1.55; color: var(--fx-ink-2); transition: color .2s; }
.fxmgc-pop__item:last-child { border-bottom: 1px solid var(--fx-line); }
.fxmgc-pop__item:hover { color: var(--fx-ink); }
.fxmgc-pop__no { flex: none; width: 12px; font-style: normal; color: var(--fx-ink-3); }
.fxmgc-pop__item.is-top .fxmgc-pop__no { color: var(--fx-ink); font-weight: 700; }
.fxmgc-pop__t { min-width: 0; }
.fxmgc-pop__t a { overflow-wrap: anywhere; }
.fxmgc-pop__t small { display: block; margin-top: 2px; font-size: 12px; color: var(--fx-ink-3); }

/* ── 날짜별 묶음 ── */
.fxmgc-day { display: flex; align-items: baseline; gap: 8px; padding: 28px 0 10px; border-bottom: 1px solid var(--fx-line-strong); }
.fxmgc-day__h { font-size: 15px; font-weight: 700; }
.fxmgc-day__w { font-size: 13px; color: var(--fx-ink-3); }
.fxmgc-it { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 20px; padding: 20px 0; border-bottom: 1px solid var(--fx-line); }
.fxmgc-it.has-th { grid-template-columns: minmax(0, 1fr) 96px; }
.fxmgc-it__body { min-width: 0; }
.fxmgc-cap { margin-bottom: 6px; font-size: 13px; line-height: 1.5; color: var(--fx-ink-3); }
.fxmgc-cap b { margin-right: 8px; font-weight: 600; color: var(--fx-accent); }
.fxmgc-it__title { font-size: 17px; line-height: 1.5; font-weight: 600; letter-spacing: -.01em; overflow-wrap: anywhere; transition: color .2s; }
.fxmgc-it:hover .fxmgc-it__title { color: var(--fx-accent); }
.fxmgc-it__excerpt { margin-top: 6px; font-size: 15px; line-height: 1.65; color: var(--fx-ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.fxmgc-it .fxmgc-meta { position: relative; margin-top: 10px; font-size: 13px; }
.fxmgc-th { align-self: start; width: 100%; aspect-ratio: 3 / 2; margin-top: 2px; object-fit: cover; border-radius: 4px; border: 1px solid var(--fx-line); background: var(--fx-surface); }
.fxmgc-empty { padding: 64px 0; text-align: center; color: var(--fx-ink-3); }
.fxmgc-foot { margin-top: 32px; text-align: center; }
.fxmgc-write, .fxmgc-btn {
	display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid var(--fxmgc-rule); border-radius: 8px;
	background: none; color: var(--fx-ink); font: inherit; font-size: 14px; cursor: pointer; transition: border-color .15s ease, color .15s ease;
}
.fxmgc-write:hover, .fxmgc-btn:hover { border-color: var(--fx-accent); color: var(--fx-accent); }
.fxmgc-btn--danger:hover { border-color: var(--fxmgc-danger); color: var(--fxmgc-danger); }

/* ── 페이지 번호: 이전 1 2 3 다음(44px), 현재 쪽은 밑줄 ── */
.fxmgc-board .fluxboard-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px; margin-top: 40px; text-align: center; }
.fxmgc-board .fluxboard-pagination__item {
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; height: 44px; padding: 0; margin: 0;
	border: 0; border-radius: 6px; background: none; font-size: 15px; color: var(--fx-ink-2);
}
.fxmgc-board .fluxboard-pagination__item:hover { color: var(--fx-ink); background: var(--fx-surface); }
.fxmgc-board .fluxboard-pagination__item--current, .fxmgc-board .fluxboard-pagination__item--current:hover { background: none; color: var(--fx-ink); font-weight: 700; border-radius: 0; border-bottom: 2px solid var(--fx-accent); }
.fxmgc-board .fluxboard-pagination__item--first, .fxmgc-board .fluxboard-pagination__item--last { display: none; }
.fxmgc-board .fluxboard-pagination__item--prev, .fxmgc-board .fluxboard-pagination__item--next { font-size: 0; padding: 0 10px; color: var(--fx-ink-3); }
.fxmgc-board .fluxboard-pagination__item--prev::after { content: "이전"; font-size: 15px; }
.fxmgc-board .fluxboard-pagination__item--next::after { content: "다음"; font-size: 15px; }


/* ── 글 보기 ── */
.fxmgc-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding-bottom: 18px; font-size: 13px; color: var(--fx-ink-3); }
.fxmgc-crumb a:hover { color: var(--fx-ink); }
.fxmgc-crumb .fxmgc-crumb__cat { color: var(--fx-accent); font-weight: 700; }
.fxmgc-art-head__title { font-size: clamp(26px, 6.2cqi, 36px); font-weight: 800; line-height: 1.38; letter-spacing: -.025em; overflow-wrap: anywhere; color: var(--fx-ink); }
.fxmgc-art-head__deck { margin-top: 14px; font-size: 18px; line-height: 1.7; color: var(--fx-ink-2); }
.fxmgc-info { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: 22px; padding: 8px 0; border-top: 1px solid var(--fx-line-strong); border-bottom: 1px solid var(--fx-line); font-size: 13px; color: var(--fx-ink-3); }
.fxmgc-info__line b { color: var(--fxmgc-ink-body); font-weight: 700; }
.fxmgc-info__line > * + *::before { content: "·"; margin: 0 8px; }
.fxmgc-info__tools .fluxboard-board-view__toolbar { display: flex; gap: 6px; margin: 0; padding: 0; border: 0; }
.fxmgc-info__tools .fluxboard-board-view__toolbar-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border: 1px solid var(--fxmgc-rule); border-radius: 6px; background: none; color: var(--fx-ink-2); font-size: 12px; cursor: pointer; }
.fxmgc-info__tools .fluxboard-board-view__toolbar-btn:hover { border-color: var(--fx-accent); color: var(--fx-accent); }

.fxmgc-sum { margin: 26px 0 8px; }
.fxmgc-sum__h { font-size: 13px; font-weight: 800; letter-spacing: .04em; color: var(--fx-accent); }
.fxmgc-sum__list { margin-top: 10px; }
.fxmgc-sum__list li { display: grid; grid-template-columns: 26px minmax(0, 1fr); padding: 7px 0; border-bottom: 1px solid var(--fx-line); font-size: 16px; line-height: 1.7; color: var(--fxmgc-ink-sum); }
.fxmgc-sum__no { font-weight: 800; color: var(--fx-accent); }
.fxmgc-links { margin-top: 16px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; overflow-wrap: anywhere; }
.fxmgc-links a { color: var(--fx-ink-2); text-decoration: underline; text-underline-offset: 3px; }

.fxmgc-body { margin-top: 30px; font-size: 17.5px; line-height: 2; color: var(--fxmgc-ink-body); counter-reset: fxmgc-h; overflow-wrap: anywhere; }
.fxmgc-body p { margin: 0 0 22px; }
.fxmgc-body h2 { margin: 40px 0 14px; font-size: 22px; font-weight: 800; line-height: 1.45; letter-spacing: -.01em; color: var(--fx-ink); counter-increment: fxmgc-h; }
.fxmgc-body h2::before { content: counter(fxmgc-h, decimal-leading-zero); display: inline-block; margin-right: 12px; font-size: 14px; font-weight: 800; color: var(--fx-accent); vertical-align: 1px; }
.fxmgc-body h3 { margin: 28px 0 10px; font-size: 19px; font-weight: 800; line-height: 1.5; color: var(--fx-ink); }
.fxmgc-body a { color: var(--fx-ink); text-decoration: underline; text-decoration-color: var(--fx-accent); text-underline-offset: 4px; }
.fxmgc-body a:hover { color: var(--fx-accent); }
.fxmgc-body ul, .fxmgc-body ol { margin: 0 0 22px; padding-left: 1.4em; }
.fxmgc-body ul { list-style: disc; }
.fxmgc-body ol { list-style: decimal; }
.fxmgc-body li { margin-bottom: 6px; }
.fxmgc-body blockquote { position: relative; margin: 32px 0; padding: 6px 0 6px 44px; font-size: 24px; font-weight: 700; line-height: 1.55; letter-spacing: -.01em; color: var(--fxmgc-white); border: 0; background: none; }
.fxmgc-body blockquote::before { content: "\201C"; position: absolute; left: 0; top: -14px; font-size: 64px; font-weight: 900; line-height: 1; color: var(--fx-accent); }
.fxmgc-body blockquote p { margin: 0; }
.fxmgc-body img, .fxmgc-body video, .fxmgc-body iframe { max-width: 100%; height: auto; }
.fxmgc-body iframe { aspect-ratio: 16 / 9; width: 100%; }
.fxmgc-body table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: 15px; line-height: 1.6; }
.fxmgc-body th, .fxmgc-body td { padding: 8px 10px; border: 1px solid var(--fx-line-strong); }
.fxmgc-body pre { max-width: 100%; overflow-x: auto; padding: 12px; background: var(--fx-surface); font-size: 14px; line-height: 1.6; }

.fxmgc-cf, .fxmgc-files { margin-top: 28px; font-size: 14px; }
.fxmgc-cf table { width: 100%; border-collapse: collapse; }
.fxmgc-cf th, .fxmgc-cf td { padding: 8px 0; border-bottom: 1px solid var(--fx-line); text-align: left; font-weight: 400; color: var(--fx-ink-2); }
.fxmgc-files ul { margin-top: 4px; }
.fxmgc-files li { padding: 10px 0; border-bottom: 1px solid var(--fx-line); overflow-wrap: anywhere; }
.fxmgc-files .fluxboard-board-view__file-meta { color: var(--fx-ink-3); font-size: 12px; }

.fxmgc-src { margin-top: 40px; }
.fxmgc-src__list li { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--fx-line); font-size: 14px; line-height: 1.6; color: var(--fx-ink-2); }
.fxmgc-src__list li:last-child { border-bottom: 0; } /* 바로 아래 정정 영역 위 선과 겹쳐 이중선이 되지 않게 */
.fxmgc-src__outlet { color: var(--fxmgc-ink-body); overflow-wrap: anywhere; }
.fxmgc-src__title { overflow-wrap: anywhere; }
.fxmgc-src__go { display: inline-flex; align-items: center; min-height: 28px; font-size: 12px; text-align: right; color: var(--fx-accent); }
.fxmgc-src__go:hover { text-decoration: underline; text-underline-offset: 3px; }

/* 글 하단(AI 도움 문구·정정 요청): 매거진 플러그인이 낸다 → 이 스킨 안에서 같은 톤으로 */
.fxmgc-view .fxmg-pf { margin: 20px 0 0; padding: 0; border-top: 0; color: var(--fx-ink-3); font-size: 12px; line-height: 1.7; }
.fxmgc-view .fxmg-pf__by { margin: 0 0 12px; font-size: 12px; font-weight: 400; color: var(--fx-ink-3); }
.fxmgc-view .fxmg-pf__fix { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding: 16px 0; border-top: 1px solid var(--fx-line); border-bottom: 1px solid var(--fx-line); }
.fxmgc-view .fxmg-pf__lead { flex: 1 1 220px; margin: 0; font-size: 13px; color: var(--fx-ink-3); }
.fxmgc-view .fxmg-pf__small, .fxmgc-view .fxmg-pf__flash { flex: 1 1 100%; margin: 0; font-size: 12px; color: var(--fx-ink-3); }
.fxmgc-view .fxmg-pf__flash { color: var(--fx-ink); }
.fxmgc-view .fxmg-corr { flex: 0 1 auto; }
.fxmgc-view .fxmg-corr[open] { flex: 1 1 100%; }
.fxmgc-view .fxmg-corr__open { min-height: 44px; padding: 0 16px; border: 1px solid var(--fxmgc-rule); border-radius: 8px; color: var(--fx-ink); font-size: 13px; }
.fxmgc-view .fxmg-corr__open:hover { background: none; border-color: var(--fx-accent); color: var(--fx-accent); }
.fxmgc-view .fxmg-corr__field span { font-size: 14px; }
.fxmgc-view .fxmg-corr__field textarea, .fxmgc-view .fxmg-corr__field input { border-radius: 8px; border-color: var(--fx-line-strong); background: var(--fx-canvas); }
.fxmgc-view .fxmg-corr__send { border-radius: 8px; background: var(--fx-accent); border-color: var(--fx-accent); color: var(--fx-on-accent); font-weight: 700; }
.fxmgc-view .fxmg-corr__send:hover { background: var(--fx-accent-hover); border-color: var(--fx-accent-hover); }

.fxmgc-view .fluxboard-board-view__reactions { margin: 28px 0 0; }
.fxmgc-rel { margin-top: 34px; }
.fxmgc-rel .fxmgc-sec { font-size: 17px; }
.fxmgc-rel__list a { display: flex; align-items: baseline; justify-content: space-between; gap: 8px 20px; min-height: 44px; padding: 15px 0; border-bottom: 1px solid var(--fx-line); font-size: 16px; font-weight: 600; }
.fxmgc-rel__list a:hover .fxmgc-rel__title { color: var(--fx-accent); }
.fxmgc-rel__title { overflow-wrap: anywhere; }
.fxmgc-rel__meta { flex: 0 0 auto; font-size: 12px; font-weight: 400; color: var(--fx-ink-3); white-space: nowrap; }
.fxmgc-nx { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 20px; margin-top: 10px; font-size: 13px; color: var(--fx-ink-3); }
.fxmgc-nx a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; overflow-wrap: anywhere; }
.fxmgc-nx a b { color: var(--fx-ink-2); font-weight: 500; }
.fxmgc-nx a:hover, .fxmgc-nx a:hover b { color: var(--fx-accent); }
.fxmgc-nx__list { margin-left: auto; }
.fxmgc-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.fxmgc-comments { margin-top: 40px; }
.fxmgc-view .fluxboard-comment.fluxboard-comment { max-width: none; padding: 0; }
.fxmgc-view .fluxboard-comment.fluxboard-comment .fluxboard-comment__header { border-bottom: 1px solid var(--fx-line-strong); }

/* ── 컨테이너 폭 전환(뷰포트가 아니라 본문 영역 폭 기준) ── */
/* 모바일: 테마 main 좌우 8px 가 이미 있어 헤더 여백(1.2rem)과 맞추려면 스킨 쪽은 0.7rem. 분류 탭은 화면 끝까지 밀어 보게 */
@media (max-width: 520px) {
	.fxmgc-board.fx-ui,
	.fluxboard-board-view.fluxboard-board-view.fxmgc-view { padding-left: .7rem; padding-right: .7rem; }
	.fxmgc-tabs .fluxboard-category-filter { margin-left: calc(-.7rem - 8px); margin-right: calc(-.7rem - 8px); padding-left: calc(.7rem + 8px); padding-right: calc(.7rem + 8px); }
}
@container (max-width: 520px) {
	.fxmgc-art-head__deck { font-size: 16px; }
	.fxmgc-body { font-size: 16px; line-height: 1.9; }
	.fxmgc-body h2 { font-size: 20px; }
	.fxmgc-body blockquote { font-size: 20px; padding-left: 36px; }
	.fxmgc-src__list li { grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; }
	.fxmgc-src__title { grid-column: 1 / -1; grid-row: 2; }
	.fxmgc-src__go { grid-column: 2; grid-row: 1; }
}
/* 목록 PC: 헤드라인 2단(큰 글 + 280px), 목록 + 오른쪽 240px */
@container (min-width: 720px) {
	.fxmgc-head { padding-top: 24px; }
	.fxmgc-head__title { font-size: 36px; }
	.fxmgc-top { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; padding: 40px 0; }
	.fxmgc-big__title { font-size: 30px; line-height: 1.36; }
	.fxmgc-hl { margin-top: 0; border-top: 0; border-left: 1px solid var(--fx-line); padding-left: 28px; }
	.fxmgc-hl__item:first-child { padding-top: 4px; }
	.fxmgc-hl__item:last-child { border-bottom: 0; }
	.fxmgc-top:not(:has(.fxmgc-hl)) { grid-template-columns: minmax(0, 1fr); }
	.fxmgc-it.has-th { grid-template-columns: minmax(0, 1fr) 152px; }
	.fxmgc-it__title { font-size: 19px; }
	.fxmgc-wrap { grid-template-columns: minmax(0, 1fr) 240px; gap: 48px; }
	.fxmgc-wrap:not(:has(> .fxmgc-rail .fxmgc-pop)) { grid-template-columns: minmax(0, 1fr); }
	/* 글이 헤드라인에 다 올라가 본문 칸이 비면 빈 칸을 접고 「많이 본 글」이 광고 바로 아래 전체 폭으로 시작한다 */
	.fxmgc-wrap:not(.fxmgc-wrap--v):not(:has(> .fxmgc-main > *)) { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.fxmgc-wrap:not(.fxmgc-wrap--v):not(:has(> .fxmgc-main > *)) > .fxmgc-main { display: none; }
	.fxmgc-wrap:not(.fxmgc-wrap--v):not(:has(> .fxmgc-main > *)) > .fxmgc-rail { padding-top: 8px; }
	.fxmgc-view .fxmgc-wrap { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.fxmgc-rail { margin-top: 0; padding-top: 28px; }
	.fxmgc-rail__in { position: sticky; top: 80px; }
}
@container (min-width: 920px) {
	.fxmgc-view .fxmgc-wrap { gap: 56px; }
}

@media (prefers-reduced-motion: reduce) {
	.fxmgc-board *, .fxmgc-view * { transition: none !important; }
}

/* 터치 타겟 44px: 경로·출처 원문·많이 본 글 링크 */
.fxmgc-crumb { padding-bottom: 6px; }
.fxmgc-crumb a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; }
.fxmgc-src__list li { align-items: center; }
.fxmgc-src__go { min-height: 44px; min-width: 44px; justify-content: flex-end; }
.fxmgc-pop__item { position: relative; }
.fxmgc-pop__item a::after { content: ""; position: absolute; inset: 0; }

/* ── FluxBoard 반응·댓글 부품을 다크 토큰에 맞춤(밝은 바탕·흰 글자가 튀지 않게) + 44px 타겟 ── */
.fxmgc-view .fluxboard-board-view__react-btn.fluxboard-board-view__react-btn { min-height: 44px; min-width: 44px; justify-content: center; background: var(--fx-surface); color: var(--fx-ink-2); border-color: var(--fx-line-strong); }
.fxmgc-view .fluxboard-board-view__react-btn.fluxboard-board-view__react-btn:hover { border-color: var(--fx-accent); color: var(--fx-accent); }
.fxmgc-view .fluxboard-comment__guest-input,
.fxmgc-view .fluxboard-comment__textarea { min-width: 0; max-width: 100%; background: var(--fx-canvas); color: var(--fx-ink); }
.fxmgc-view .fluxboard-comment__guest-input { min-height: 44px; }
.fxmgc-view .fluxboard-comment__guest-input:focus,
.fxmgc-view .fluxboard-comment__textarea:focus { background: var(--fx-sunken); outline: 2px solid var(--fx-accent); outline-offset: -2px; }
.fxmgc-view .fluxboard-comment__guest-row { flex-wrap: wrap; }
.fxmgc-view .fluxboard-comment__guest-input { flex: 1 1 160px; }
.fxmgc-view .fluxboard-comment__form-side { background: var(--fx-surface); }
.fxmgc-view .fluxboard-comment__secret-label { min-height: 44px; min-width: 44px; justify-content: center; }
.fxmgc-view .fluxboard-comment__text-btn, .fxmgc-view .fluxboard-comment__reply-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; }
.fxmgc-view .fluxboard-comment__secret-label input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--fx-accent); }
.fxmgc-view .fluxboard-comment__submit-btn.fluxboard-comment__submit-btn { min-height: 44px; background: var(--fx-accent); color: var(--fx-on-accent); font-weight: 700; }
.fxmgc-view .fluxboard-comment__submit-btn.fluxboard-comment__submit-btn:hover { background: var(--fx-accent-hover); color: var(--fx-on-accent); }

.fxmgc-view .fluxboard-comment__form-side, .fxmgc-view .fluxboard-comment__guest-row { color-scheme: dark; }

/* ══ 글 보기·목록 시안 확정(2026-10-28): 읽기 편한 본문 폭 680, 제목·본문 크기, 구획 번호, 레일, 움직임 5+2 ══ */
:root { --fxmgc-ease: cubic-bezier(.22, .61, .36, 1); }

/* 본문 폭 680(글 보기) */
.fxmgc-view .fxmgc-main { max-width: 680px; margin-inline: auto; }
.fxmgc-view .fxmgc-wrap.fxmgc-wrap--v { gap: 40px; }

/* 경로·제목·메타 */
.fxmgc-view .fxmgc-crumb { font-size: 14px; color: var(--fx-ink-2); }
.fxmgc-view .fxmgc-art-head__title { font-size: 26px; line-height: 1.38; font-weight: 700; letter-spacing: -.02em; }
.fxmgc-view .fxmgc-art-head__deck { font-size: 18px; color: var(--fx-ink-2); }
.fxmgc-view .fxmgc-info { margin-top: 20px; padding: 0 0 20px; border-top: 0; border-bottom: 1px solid var(--fx-line); font-size: 14px; color: var(--fx-ink-2); gap: 8px 12px; flex-wrap: wrap; align-items: center; }
.fxmgc-view .fxmgc-info__line { display: flex; flex-wrap: wrap; gap: 4px 0; min-width: 0; overflow: hidden; color: var(--fx-ink-2); }
.fxmgc-view .fxmgc-info__line b { color: var(--fx-ink-2); font-weight: 600; }
/* 구분점: 줄 맨 앞(꺾인 둘째 줄 포함)에 남지 않게 — 항목 왼쪽에 두고 줄 시작 항목은 왼쪽으로 밀어 잘라낸다 */
.fxmgc-view .fxmgc-info__line > * { position: relative; margin-left: -11px; padding: 0 20px 0 11px; white-space: nowrap; }
.fxmgc-view .fxmgc-info__line > *::before,
.fxmgc-view .fxmgc-info__line > * + *::before { content: ""; display: block; position: absolute; left: 0; top: 50%; width: 1px; height: 10px; margin: -5px 0 0; background: var(--fx-line-strong); }
.fxmgc-view .fxmgc-info__tools { display: contents; }
.fxmgc-view .fxmgc-info__line { flex: 1 1 0; }
.fxmgc-view .fxmgc-share { margin-left: auto; }
.fxmgc-view .fxmgc-info__tools .fluxboard-board-view__toolbar { flex: none; align-items: center; }
.fxmgc-view .fxmgc-share { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid var(--fx-line-strong); border-radius: 8px; background: none; color: var(--fx-ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; flex: none; transition: transform .16s var(--fxmgc-ease), border-color .2s; }
.fxmgc-view .fxmgc-share:hover { border-color: var(--fx-accent); }
.fxmgc-view .fxmgc-share svg { stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fxmgc-view .fxmgc-share.press { transform: scale(.96); }
/* 공유는 위 주소 복사 버튼으로 대신한다(플러그인 부품의 공유 팝업만 숨김, 알림·신고는 그대로) */
.fxmgc-view .fxmgc-info__tools .fluxboard-board-view__toolbar > div:has(.js-fluxboard-share-toggle) { display: none; }

/* 본문 */
.fxmgc-view .fxmgc-body { margin-top: 28px; font-size: 18px; line-height: 1.85; color: var(--fx-ink); }
.fxmgc-view .fxmgc-body p { margin: 0 0 22px; }
.fxmgc-view .fxmgc-body p.fxmgc-lead { font-size: 20px; font-weight: 500; line-height: 1.8; margin-bottom: 8px; }
.fxmgc-view .fxmgc-body strong { font-weight: 700; }
.fxmgc-view .fxmgc-blk { margin-top: 56px; scroll-margin-top: 80px; }
.fxmgc-view .fxmgc-body h2.fxmgc-blk__h { margin: 0 0 20px; font-size: 23px; line-height: 1.4; font-weight: 700; letter-spacing: -.015em; }
.fxmgc-view .fxmgc-body h2.fxmgc-blk__h::before { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 700; letter-spacing: .04em; vertical-align: baseline; font-variant-numeric: tabular-nums; }
.fxmgc-view .fxmgc-body a:not(.fxmgc-alink) { text-decoration-color: var(--fx-line-strong); transition: text-decoration-color .2s, color .2s; overflow-wrap: anywhere; }
.fxmgc-view .fxmgc-body a:not(.fxmgc-alink):hover { color: var(--fx-ink); text-decoration-color: var(--fx-accent); }
/* 선으로 나눈 목록(번호·점 없음) */
.fxmgc-view .fxmgc-blk ul, .fxmgc-view .fxmgc-blk ol { margin: 0 0 22px; padding: 0; list-style: none; border-top: 1px solid var(--fx-line); }
.fxmgc-view .fxmgc-blk li { margin: 0; padding: 20px 0; border-bottom: 1px solid var(--fx-line); font-size: 18px; line-height: 1.85; color: var(--fx-ink-2); }
/* 투표 */
.fxmgc-view .fxmgc-poll { margin: 56px 0 0; padding-top: 24px; border-top: 1px solid var(--fx-line-strong); }
.fxmgc-view .fxmgc-poll .fxmgc-poll__lab { margin: 0 0 4px; font-size: 14px; line-height: 1.6; color: var(--fx-ink-3); }
.fxmgc-view .fxmgc-poll .fxmgc-poll__q { margin: 0 0 12px; font-size: 18px; line-height: 1.6; font-weight: 700; }
.fxmgc-view .fxmgc-poll ul { margin: 0; counter-reset: fxmgc-poll; }
.fxmgc-view .fxmgc-poll li { counter-increment: fxmgc-poll; display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 8px 0; font-size: 17px; line-height: 1.6; }
.fxmgc-view .fxmgc-poll li::before { content: counter(fxmgc-poll); flex: none; width: 18px; font-size: 14px; color: var(--fx-ink-3); font-variant-numeric: tabular-nums; }
/* 안내 링크(화살표) */
.fxmgc-view .fxmgc-cta { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--fx-line); }
.fxmgc-view .fxmgc-cta p { margin: 0 0 4px; font-size: 16px; line-height: 1.7; color: var(--fx-ink-2); }
.fxmgc-view .fxmgc-body a.fxmgc-alink { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; text-decoration: none; color: var(--fx-ink); transition: color .2s; }
.fxmgc-view .fxmgc-body a.fxmgc-alink:hover { color: var(--fx-accent); }
.fxmgc-alink__ar, .fxmgc-vpop__ar, .fxmgc-rel__title::after, .fxmgc-nx a span { display: inline-block; transition: transform .2s var(--fxmgc-ease); }
.fxmgc-view .fxmgc-alink:hover .fxmgc-alink__ar { transform: translateX(3px); }
/* 출처: 위 2px 선 + 14px 번호 목록 */
.fxmgc-view .fxmgc-blk--src { margin-top: 56px; padding-top: 20px; border-top: 2px solid var(--fx-line-strong); }
.fxmgc-view .fxmgc-body h2.fxmgc-blk__h--src { margin: 0 0 12px; font-size: 16px; line-height: 1.5; counter-increment: none; }
.fxmgc-view .fxmgc-body h2.fxmgc-blk__h--src::before { content: none; }
.fxmgc-view .fxmgc-blk--src ol { padding-left: 22px; list-style: decimal; border-top: 0; margin: 0; }
.fxmgc-view .fxmgc-blk--src li { padding: 0 0 0 4px; margin-bottom: 8px; border-bottom: 0; font-size: 14px; line-height: 1.7; color: var(--fx-ink-2); overflow-wrap: anywhere; }
.fxmgc-view .fxmgc-blk--src li::marker { color: var(--fx-ink-3); font-variant-numeric: tabular-nums; }
/* 아래 링크 화살표 */
.fxmgc-view .fxmgc-rel__list a:hover .fxmgc-rel__title::after { transform: translateX(3px); }
.fxmgc-rel__title::after { content: "\2192"; margin-left: 8px; color: var(--fx-accent); opacity: 0; }
.fxmgc-view .fxmgc-rel__list a:hover .fxmgc-rel__title::after { opacity: 1; }
.fxmgc-view .fxmgc-nx__next:hover span { transform: translateX(3px); }
.fxmgc-view .fxmgc-nx__prev:hover span { transform: translateX(-3px); }

/* 오른쪽 레일: 목차 + 많이 본 글(본문 영역이 넓을 때만) */
.fxmgc-vrail { display: none; min-width: 0; }
.fxmgc-vrail__h { margin: 0 0 12px; font-size: 13px; font-weight: 600; letter-spacing: .06em; color: var(--fx-ink-3); }
.fxmgc-toc { position: relative; margin: 0 0 40px; padding: 0 0 0 14px; }
.fxmgc-toc::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--fx-line-strong); }
.fxmgc-toc__bar { position: absolute; left: -1px; top: 0; width: 3px; height: 44px; background: var(--fx-accent); border-radius: 2px; opacity: 0; transition: transform .3s var(--fxmgc-ease); }
.fxmgc-toc a { display: flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.45; color: var(--fx-ink-2); transition: color .2s; }
.fxmgc-toc a:hover, .fxmgc-toc a.on { color: var(--fx-ink); }
.fxmgc-toc a.on { font-weight: 600; }
.fxmgc-vpop a { display: flex; gap: 10px; padding: 12px 0; min-height: 44px; border-top: 1px solid var(--fx-line); font-size: 14px; line-height: 1.55; color: var(--fx-ink-2); transition: color .2s; }
.fxmgc-vpop a:hover { color: var(--fx-ink); }
.fxmgc-vpop em { flex: none; width: 12px; font-style: normal; color: var(--fx-ink-3); font-variant-numeric: tabular-nums; }
.fxmgc-vpop__t { min-width: 0; overflow-wrap: anywhere; }
.fxmgc-vpop__ar { margin-left: auto; flex: none; color: var(--fx-accent); }
.fxmgc-vpop a:hover .fxmgc-vpop__ar { transform: translateX(3px); }
@container (min-width: 860px) {
	.fxmgc-view .fxmgc-wrap.fxmgc-wrap--v { grid-template-columns: minmax(0, 680px) minmax(0, 1fr); gap: 32px; justify-content: center; }
	.fxmgc-view .fxmgc-wrap.fxmgc-wrap--v.fxmgc-wrap--solo { grid-template-columns: minmax(0, 680px); }
	.fxmgc-vrail { display: block; padding-top: 0; }
	.fxmgc-vrail__in { position: sticky; top: 88px; }
	.fxmgc-view .fxmgc-art-head__title { font-size: 36px; line-height: 1.33; }
}
/* 테마가 body 에 overflow 를 줘서 sticky 가 멈춘다 — 이 화면에서만 풀어 준다(가로 넘침은 html 이 이미 막고 있음) */
@media (min-width: 900px) {
	body:has(.fxmgc-wrap--v) { overflow: visible; }
}
@container (min-width: 968px) {
	.fxmgc-view .fxmgc-wrap.fxmgc-wrap--v { grid-template-columns: minmax(0, 680px) minmax(0, 240px); gap: 48px; }
	.fxmgc-view .fxmgc-wrap.fxmgc-wrap--v.fxmgc-wrap--solo { grid-template-columns: minmax(0, 680px); }
}

/* 모바일 메타: 꺾여도 구분점이 줄 앞에 남지 않음(위 방식) / 모바일 본문도 18px 유지 */
@container (max-width: 520px) {
	.fxmgc-view .fxmgc-info__line { flex-wrap: wrap; column-gap: 0; }
	.fxmgc-view .fxmgc-info__line > * + *::before { display: block; }
	.fxmgc-view .fxmgc-info__line > * { margin-left: -8px; padding: 0 14px 0 8px; }
	.fxmgc-view .fxmgc-info__tools .fluxboard-board-view__toolbar { flex: 1 0 100%; }
	.fxmgc-view .fxmgc-share { padding: 0 12px; }
	.fxmgc-view .fxmgc-body { font-size: 18px; line-height: 1.85; }
	.fxmgc-view .fxmgc-body h2.fxmgc-blk__h { font-size: 23px; }
	.fxmgc-view .fxmgc-body h2.fxmgc-blk__h--src { font-size: 16px; }
}

/* ── 움직임: transform·opacity 만. 스크립트(.fxmgc-js)가 있을 때만 숨겼다가 나타낸다 ── */
.fxmgc-js .fxmgc-rv:not(.in) { opacity: 0; transform: translateY(12px); }
.fxmgc-js .fxmgc-rv { transition: opacity .36s var(--fxmgc-ease), transform .36s var(--fxmgc-ease); }
.fxmgc-prog { position: fixed; left: 0; right: 0; top: 0; z-index: 1001; height: 2px; transform: scaleX(0); transform-origin: left; will-change: transform; pointer-events: none; }
.fxmgc-toast { position: fixed; left: 50%; bottom: 28px; z-index: 1002; width: 220px; margin-left: -110px; padding: 12px 16px; border-radius: 8px; font: 600 14px/1.4 "Pretendard Variable", "Pretendard", "Noto Sans KR", sans-serif; text-align: center; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .25s var(--fxmgc-ease), transform .25s var(--fxmgc-ease); }
.fxmgc-toast.show { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.fxmgc-js .fxmgc-rv:not(.in) { opacity: 1; transform: none; }
	.fxmgc-js .fxmgc-rv, .fxmgc-toast, .fxmgc-toc__bar, .fxmgc-view .fxmgc-share { transition: none; }
	.fxmgc-view .fxmgc-alink:hover .fxmgc-alink__ar, .fxmgc-vpop a:hover .fxmgc-vpop__ar { transform: none; }
}