* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Pretendard', -apple-system, sans-serif; background: #F1F5F9; color: #1F2937; }
.reading-progress { position: fixed; top: 0; left: 0; height: 3px; background: linear-gradient(90deg, #1D4ED8, #3B82F6); z-index: 100; transition: width 0.15s; }

article { word-wrap: break-word; overflow-wrap: break-word; overflow: visible; }
article h2 { font-size: 1.375rem; font-weight: 700; color: #111827; margin-top: 2rem; margin-bottom: 1rem; padding-bottom: 0.625rem; border-bottom: 2px solid #E5E7EB; position: relative; word-wrap: break-word; }
article h2::before { content: ''; position: absolute; bottom: -2px; left: 0; width: 80px; height: 2px; background: #1D4ED8; }
article h3 { font-size: 1.125rem; font-weight: 600; color: #1E40AF; margin-top: 1.5rem; margin-bottom: 0.75rem; word-wrap: break-word; }
article p { color: #4B5563; font-size: 1rem; line-height: 1.85; margin: 0; margin-bottom: 1rem; padding: 0; word-wrap: break-word; overflow-wrap: break-word; }
article a:not(.toc-link):not(.no-arrow) {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.4rem 1rem 0.6rem 1rem;
	margin: 0.25rem 0;
	background: #FFFFFF;
	color: #1D4ED8;
	font-weight: 500;
	font-size: 0.9375rem;
	line-height: 1.4;
	text-decoration: none;
	border: 1px solid #E5E7EB;
	border-radius: 0.375rem;
	transition: all 0.15s ease;
	word-break: break-word;
	overflow-wrap: break-word;
}
article a:not(.toc-link):not(.no-arrow)::before {
	content: "›";
	font-size: 1.125rem;
	font-weight: 700;
	color: #3B82F6;
}
article a:not(.toc-link):not(.no-arrow):hover {
	background: #EFF6FF;
	color: #1E40AF;
	border-color: #BFDBFE;
}

/* 목차 */
.toc-container { background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 0.5rem; margin-bottom: 1.25rem; overflow: hidden; }
.toc-header { display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1rem; cursor: pointer; transition: background 0.15s; }
.toc-header:hover { background: #F1F5F9; }
.toc-header-icon { width: 1rem; height: 1rem; color: #1D4ED8; flex-shrink: 0; }
.toc-header-text { font-size: 0.875rem; font-weight: 700; color: #374151; flex: 1; }
.toc-header-arrow { width: 1.25rem; height: 1.25rem; color: #9CA3AF; transition: transform 0.2s; flex-shrink: 0; }
.toc-content { padding: 0 1rem 0.75rem; }
.toc-container ol { padding-left: 0; margin: 0; counter-reset: none; list-style: none; }
.toc-container ol li { padding-left: 0; counter-increment: none; position: static; margin-bottom: 0; }
.toc-container ol li::before { content: none; }
article img { max-width: 100%; height: auto; display: block; border-radius: 0.5rem; }
article ul { margin-left: 0; padding-left: 1.5rem; margin-bottom: 1.25rem; margin-top: 0.75rem; }
article ul li { position: relative; list-style: none; padding-left: 1.5rem; margin-bottom: 0.5rem; color: #4B5563; line-height: 1.75; }
article ul li::before { content: "▸"; position: absolute; left: 0; color: #1D4ED8; font-weight: 700; }
article ol { margin-left: 0; padding-left: 2rem; margin-bottom: 1.25rem; margin-top: 0.75rem; counter-reset: list-counter; }
article ol li { position: relative; list-style: none; padding-left: 1.75rem; margin-bottom: 0.5rem; color: #4B5563; line-height: 1.75; counter-increment: list-counter; }
article ol li::before { content: counter(list-counter) "."; position: absolute; left: 0; color: #1D4ED8; font-weight: 600; font-size: 0.9rem; }
article li li { font-size: 0.925rem; }
article table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: 0.9375rem; }
article table th { background: #1E40AF; color: white; padding: 0.75rem 1rem; text-align: left; font-weight: 600; font-size: 0.875rem; }
article table td { padding: 0.75rem 1rem; border-bottom: 1px solid #E5E7EB; color: #374151; }
article table tr:nth-child(even) td { background: #F8FAFC; }
article table tr:hover td { background: #EFF6FF; }
@media (min-width: 768px) {
	article h2 { font-size: 1.5rem; margin-top: 2.25rem; margin-bottom: 1.25rem; }
	article h3 { font-size: 1.25rem; margin-top: 1.75rem; margin-bottom: 1rem; }
	article p { font-size: 1rem; line-height: 1.85; }
	article ul, article ol { margin-bottom: 1.5rem; margin-top: 1rem; }
}
.toc-link { color: #6B7280; font-size: 0.875rem; text-decoration: none; display: block; padding: 0.375rem 0; transition: all 0.15s; border-bottom: 1px solid #F3F4F6; }
.toc-link:hover { color: #1D4ED8; padding-left: 0.5rem; text-decoration: none; }

/* 정보 카드 */
.info-card { background: #EFF6FF; border-left: 4px solid #3B82F6; padding: 1rem 1.25rem; border-radius: 0 0.5rem 0.5rem 0; margin: 1rem 0; }
.warning-card { background: #FEF3C7; border-left: 4px solid #F59E0B; padding: 1rem 1.25rem; border-radius: 0 0.5rem 0.5rem 0; margin: 1rem 0; }
.success-card { background: #ECFDF5; border-left: 4px solid #059669; padding: 1rem 1.25rem; border-radius: 0 0.5rem 0.5rem 0; margin: 1rem 0; }

/* 단계별 넘버 배지 */
.step-badge { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #1D4ED8; color: white; font-weight: 700; font-size: 0.875rem; flex-shrink: 0; }

/* 핵심 숫자 강조 */
.highlight-number { font-size: 2rem; font-weight: 800; color: #DC2626; line-height: 1.2; }
.highlight-blue { font-size: 2rem; font-weight: 800; color: #1D4ED8; line-height: 1.2; }

/* CTA 버튼 */
.cta-button { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.5rem; background: #1D4ED8; color: white; font-weight: 600; font-size: 0.9375rem; border-radius: 0.5rem; text-decoration: none; transition: background 0.15s; }
.cta-button:hover { background: #1E40AF; }

/* 관련 글 카드 */
.related-card { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem; border-radius: 0.5rem; transition: background 0.15s; cursor: pointer; }
.related-card:hover { background: #EFF6FF; }
.related-card .dot { width: 6px; height: 6px; border-radius: 50%; background: #3B82F6; flex-shrink: 0; }

/* 데이터 테이블 */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.data-table th { background: #1E40AF; color: white; padding: 0.75rem 1rem; text-align: left; font-weight: 600; font-size: 0.875rem; }
.data-table td { padding: 0.75rem 1rem; border-bottom: 1px solid #E5E7EB; color: #374151; }
.data-table tr:nth-child(even) td { background: #F8FAFC; }
.data-table tr:hover td { background: #EFF6FF; }

/* 광고 전후 여백 */
.adsbygoogle, ins.adsbygoogle { margin: 1.5rem 0; }

@media (max-width: 1023px) { .sidebar-desktop { display: none; } }