/* 뷰어 페이지 공통 (로드 시 적용) */
body { font-family: 'Outfit', sans-serif; }

/* 뷰어 콘텐츠 공통 */
#content { transition: background-color 0.2s, color 0.2s; }
#content h1, #content h2, #content h3, #content h4, #content p, #content ul, #content ol, #content pre, #content blockquote, #content table { margin-bottom: 0.75rem; }
#content h1:first-child, #content h2:first-child { margin-top: 0; }
#content pre { overflow-x: auto; }
#content pre code { padding: 0; background: none; }

/* 밝은 기본 */
#content.viewer-style-default { background: #fff; color: #1c1917; border-color: rgb(226 232 240); }
#content.viewer-style-default h1 { font-size: 1.5rem; font-weight: 700; margin-top: 1.5rem; color: #1c1917; }
#content.viewer-style-default h2 { font-size: 1.25rem; font-weight: 600; margin-top: 1.25rem; color: #1c1917; border-bottom: 1px solid #e7e5e4; padding-bottom: 0.25rem; }
#content.viewer-style-default h3 { font-size: 1.125rem; font-weight: 600; margin-top: 1rem; }
#content.viewer-style-default p { line-height: 1.625; }
#content.viewer-style-default ul { list-style: disc; padding-left: 1.5rem; }
#content.viewer-style-default ol { list-style: decimal; padding-left: 1.5rem; }
#content.viewer-style-default pre { background: #f1f0eb; padding: 1rem; border-radius: 0.5rem; border: 1px solid #e7e5e4; }
#content.viewer-style-default code { background: #f1f0eb; padding: 0.125rem 0.375rem; border-radius: 0.25rem; font-size: 0.875em; }
#content.viewer-style-default blockquote { border-left: 4px solid #d6d3d1; padding-left: 1rem; color: #57534e; }
#content.viewer-style-default a { color: #c2410c; text-decoration: underline; }
#content.viewer-style-default table { border-collapse: collapse; width: 100%; }
#content.viewer-style-default th, #content.viewer-style-default td { border: 1px solid #e7e5e4; padding: 0.5rem 0.75rem; text-align: left; }
#content.viewer-style-default th { background: #fafaf9; font-weight: 600; }

/* 다크 */
#content.viewer-style-dark { background: #1c1917; color: #e7e5e4; border-color: #44403c; }
#content.viewer-style-dark h1 { font-size: 1.5rem; font-weight: 700; margin-top: 1.5rem; color: #fafaf9; }
#content.viewer-style-dark h2 { font-size: 1.25rem; font-weight: 600; margin-top: 1.25rem; color: #fafaf9; border-bottom: 1px solid #57534e; padding-bottom: 0.25rem; }
#content.viewer-style-dark h3 { font-size: 1.125rem; font-weight: 600; margin-top: 1rem; color: #e7e5e4; }
#content.viewer-style-dark p { line-height: 1.625; color: #d6d3d1; }
#content.viewer-style-dark ul { list-style: disc; padding-left: 1.5rem; color: #d6d3d1; }
#content.viewer-style-dark ol { list-style: decimal; padding-left: 1.5rem; color: #d6d3d1; }
#content.viewer-style-dark pre { background: #292524; padding: 1rem; border-radius: 0.5rem; border: 1px solid #44403c; color: #e7e5e4; }
#content.viewer-style-dark code { background: #292524; color: #fcd34d; padding: 0.125rem 0.375rem; border-radius: 0.25rem; font-size: 0.875em; }
#content.viewer-style-dark blockquote { border-left: 4px solid #78716c; padding-left: 1rem; color: #a8a29e; }
#content.viewer-style-dark a { color: #fdba74; text-decoration: underline; }
#content.viewer-style-dark table { border-collapse: collapse; width: 100%; }
#content.viewer-style-dark th, #content.viewer-style-dark td { border: 1px solid #44403c; padding: 0.5rem 0.75rem; color: #d6d3d1; }
#content.viewer-style-dark th { background: #292524; color: #fafaf9; }

/* 깔끔한 문서 (GitHub 느낌) */
#content.viewer-style-github { background: #fff; color: #24292f; border-color: #d0d7de; }
#content.viewer-style-github h1 { font-size: 2rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; padding-bottom: 0.3rem; border-bottom: 1px solid #d0d7de; color: #1f2328; }
#content.viewer-style-github h2 { font-size: 1.5rem; font-weight: 600; margin-top: 1.25rem; margin-bottom: 0.5rem; padding-bottom: 0.3rem; border-bottom: 1px solid #d0d7de; color: #1f2328; }
#content.viewer-style-github h3 { font-size: 1.25rem; font-weight: 600; margin-top: 1rem; color: #1f2328; }
#content.viewer-style-github p { line-height: 1.6; color: #24292f; }
#content.viewer-style-github ul, #content.viewer-style-github ol { padding-left: 2rem; }
#content.viewer-style-github pre { background: #f6f8fa; padding: 1rem; border-radius: 0.375rem; border: 1px solid #d0d7de; font-size: 0.875rem; line-height: 1.45; }
#content.viewer-style-github code { background: #afb8c133; padding: 0.2em 0.4em; border-radius: 0.25rem; font-size: 0.85em; }
#content.viewer-style-github blockquote { border-left: 4px solid #d0d7de; padding-left: 1rem; margin-left: 0; color: #57606a; }
#content.viewer-style-github a { color: #0969da; text-decoration: none; }
#content.viewer-style-github a:hover { text-decoration: underline; }
#content.viewer-style-github table { border-collapse: collapse; width: 100%; }
#content.viewer-style-github th, #content.viewer-style-github td { border: 1px solid #d0d7de; padding: 0.5rem 0.75rem; }
#content.viewer-style-github th { background: #f6f8fa; font-weight: 600; }

/* 보고서 */
#content.viewer-style-report { background: #fefefe; color: #2c3e50; border-color: #bdc3c7; }
#content.viewer-style-report h1 { font-size: 1.75rem; font-weight: 700; margin-top: 1.75rem; color: #1a252f; border-bottom: 2px solid #34495e; padding-bottom: 0.35rem; }
#content.viewer-style-report h2 { font-size: 1.35rem; font-weight: 600; margin-top: 1.5rem; color: #2c3e50; border-bottom: 1px solid #7f8c8d; padding-bottom: 0.25rem; }
#content.viewer-style-report h3 { font-size: 1.15rem; font-weight: 600; margin-top: 1.25rem; color: #34495e; }
#content.viewer-style-report p { line-height: 1.7; }
#content.viewer-style-report ul { list-style: disc; padding-left: 1.75rem; }
#content.viewer-style-report ol { list-style: decimal; padding-left: 1.75rem; }
#content.viewer-style-report pre { background: #ecf0f1; padding: 1rem 1.25rem; border-radius: 0.25rem; border: 1px solid #bdc3c7; font-size: 0.9rem; }
#content.viewer-style-report code { background: #ecf0f1; padding: 0.15rem 0.4rem; border-radius: 0.2rem; font-size: 0.9em; border: 1px solid #d5dbdb; }
#content.viewer-style-report blockquote { border-left: 4px solid #3498db; padding: 0.5rem 0 0.5rem 1rem; background: #ebf5fb; color: #2c3e50; }
#content.viewer-style-report a { color: #2980b9; text-decoration: none; border-bottom: 1px solid #3498db; }
#content.viewer-style-report table { border-collapse: collapse; width: 100%; }
#content.viewer-style-report th, #content.viewer-style-report td { border: 1px solid #bdc3c7; padding: 0.5rem 0.75rem; }
#content.viewer-style-report th { background: #ecf0f1; font-weight: 600; }

/* 읽기 편한 */
#content.viewer-style-readable { background: #faf9f7; color: #333; border-color: #e0ddd9; max-width: 65ch; margin-left: auto; margin-right: auto; }
#content.viewer-style-readable h1 { font-size: 1.75rem; font-weight: 700; margin-top: 1.75rem; line-height: 1.2; color: #1a1a1a; }
#content.viewer-style-readable h2 { font-size: 1.35rem; font-weight: 600; margin-top: 1.5rem; line-height: 1.3; color: #262626; }
#content.viewer-style-readable h3 { font-size: 1.15rem; font-weight: 600; margin-top: 1.25rem; color: #333; }
#content.viewer-style-readable p { line-height: 1.75; margin-bottom: 1rem; }
#content.viewer-style-readable ul, #content.viewer-style-readable ol { padding-left: 1.5rem; line-height: 1.7; }
#content.viewer-style-readable pre { background: #f5f3f0; padding: 1.25rem; border-radius: 0.5rem; line-height: 1.6; border: 1px solid #e8e6e3; }
#content.viewer-style-readable code { background: #f5f3f0; padding: 0.15rem 0.35rem; border-radius: 0.25rem; font-size: 0.9em; }
#content.viewer-style-readable blockquote { border-left: 3px solid #a8a29e; padding-left: 1rem; color: #52525b; font-style: italic; }
#content.viewer-style-readable a { color: #2563eb; text-decoration: underline; }
#content.viewer-style-readable table { border-collapse: collapse; width: 100%; }
#content.viewer-style-readable th, #content.viewer-style-readable td { border: 1px solid #e5e7eb; padding: 0.5rem 0.75rem; }
#content.viewer-style-readable th { background: #f4f4f5; font-weight: 600; }

/* 모던 미니멀 */
#content.viewer-style-minimal { background: #fff; color: #171717; border-color: #e5e5e5; }
#content.viewer-style-minimal h1 { font-size: 1.5rem; font-weight: 600; margin-top: 1.5rem; letter-spacing: -0.02em; color: #171717; }
#content.viewer-style-minimal h2 { font-size: 1.25rem; font-weight: 600; margin-top: 1.25rem; letter-spacing: -0.01em; color: #262626; }
#content.viewer-style-minimal h3 { font-size: 1.1rem; font-weight: 600; margin-top: 1rem; color: #404040; }
#content.viewer-style-minimal p { line-height: 1.65; margin-bottom: 0.875rem; color: #525252; }
#content.viewer-style-minimal ul { list-style: none; padding-left: 0; }
#content.viewer-style-minimal ul li { padding-left: 1.25rem; position: relative; margin-bottom: 0.25rem; }
#content.viewer-style-minimal ul li::before { content: '–'; position: absolute; left: 0; color: #a3a3a3; }
#content.viewer-style-minimal ol { padding-left: 1.5rem; color: #525252; }
#content.viewer-style-minimal pre { background: #fafafa; padding: 1rem; border-radius: 0.375rem; font-size: 0.8125rem; color: #404040; border: 1px solid #f0f0f0; }
#content.viewer-style-minimal code { background: #fafafa; color: #404040; padding: 0.1rem 0.3rem; border-radius: 0.25rem; font-size: 0.875em; }
#content.viewer-style-minimal blockquote { border-left: 3px solid #e5e5e5; padding-left: 1rem; color: #737373; margin-left: 0; }
#content.viewer-style-minimal a { color: #171717; text-decoration: underline; text-underline-offset: 2px; }
#content.viewer-style-minimal table { border-collapse: collapse; width: 100%; }
#content.viewer-style-minimal th, #content.viewer-style-minimal td { border-bottom: 1px solid #e5e5e5; padding: 0.5rem 0.75rem; color: #525252; }
#content.viewer-style-minimal th { font-weight: 600; color: #262626; }

/* 팜플렛 (드라마틱 타입) */
#content.viewer-style-pamphlet { background: #fffbf5; color: #1c1917; border-color: #e7d5b9; }
#content.viewer-style-pamphlet h1 { font-size: 2.25rem; font-weight: 800; margin-top: 1.5rem; letter-spacing: -0.03em; color: #78350f; line-height: 1.2; }
#content.viewer-style-pamphlet h2 { font-size: 1.5rem; font-weight: 700; margin-top: 1.5rem; color: #92400e; }
#content.viewer-style-pamphlet h3 { font-size: 1.25rem; font-weight: 600; margin-top: 1.25rem; color: #a16207; }
#content.viewer-style-pamphlet p { line-height: 1.7; margin-bottom: 1rem; color: #44403c; }
#content.viewer-style-pamphlet ul, #content.viewer-style-pamphlet ol { padding-left: 1.5rem; }
#content.viewer-style-pamphlet pre { background: #fef3c7; padding: 1rem; border-radius: 0.5rem; border: 1px solid #fcd34d; color: #78350f; }
#content.viewer-style-pamphlet code { background: #fef3c7; color: #92400e; padding: 0.15rem 0.4rem; border-radius: 0.25rem; font-weight: 500; }
#content.viewer-style-pamphlet blockquote { border-left: 4px solid #d97706; padding-left: 1rem; background: #fffbeb; color: #57534e; font-style: italic; }
#content.viewer-style-pamphlet a { color: #b45309; font-weight: 600; text-decoration: underline; }
#content.viewer-style-pamphlet table { border-collapse: collapse; width: 100%; }
#content.viewer-style-pamphlet th, #content.viewer-style-pamphlet td { border: 1px solid #e7d5b9; padding: 0.5rem 0.75rem; }
#content.viewer-style-pamphlet th { background: #fef3c7; color: #78350f; font-weight: 700; }

/* 은은한 */
#content.viewer-style-modest { background: #fff; color: #4a4a4a; border-color: #e8e8e8; }
#content.viewer-style-modest h1 { font-size: 1.5rem; font-weight: 600; margin-top: 1.5rem; color: #363636; border-bottom: 1px solid #e8e8e8; padding-bottom: 0.4rem; }
#content.viewer-style-modest h2 { font-size: 1.25rem; font-weight: 600; margin-top: 1.25rem; color: #4a4a4a; border-bottom: 1px solid #eee; padding-bottom: 0.3rem; }
#content.viewer-style-modest h3 { font-size: 1.1rem; font-weight: 600; margin-top: 1rem; color: #4a4a4a; }
#content.viewer-style-modest p { line-height: 1.65; color: #4a4a4a; }
#content.viewer-style-modest ul { list-style: disc; padding-left: 1.5rem; color: #4a4a4a; }
#content.viewer-style-modest ol { list-style: decimal; padding-left: 1.5rem; color: #4a4a4a; }
#content.viewer-style-modest pre { background: #f9f9f9; padding: 1rem; border-radius: 0.25rem; border: 1px solid #eee; color: #555; font-size: 0.9rem; }
#content.viewer-style-modest code { background: #f5f5f5; color: #555; padding: 0.1rem 0.3rem; border-radius: 0.2rem; font-size: 0.875em; }
#content.viewer-style-modest blockquote { border-left: 3px solid #ddd; padding-left: 1rem; color: #6b6b6b; }
#content.viewer-style-modest a { color: #6b6b6b; text-decoration: underline; }
#content.viewer-style-modest table { border-collapse: collapse; width: 100%; }
#content.viewer-style-modest th, #content.viewer-style-modest td { border: 1px solid #eee; padding: 0.5rem 0.75rem; }
#content.viewer-style-modest th { background: #fafafa; font-weight: 600; color: #363636; }

/* 레트로 */
#content.viewer-style-retro { background: #f4f1ea; color: #3d3d3d; border: 2px solid #8b7355; }
#content.viewer-style-retro h1 { font-size: 1.75rem; font-weight: 700; margin-top: 1.5rem; font-family: Georgia, serif; color: #2d2d2d; border-bottom: 2px double #8b7355; padding-bottom: 0.35rem; }
#content.viewer-style-retro h2 { font-size: 1.35rem; font-weight: 600; margin-top: 1.25rem; font-family: Georgia, serif; color: #3d3d3d; }
#content.viewer-style-retro h3 { font-size: 1.15rem; font-weight: 600; margin-top: 1rem; font-family: Georgia, serif; color: #4a4a4a; }
#content.viewer-style-retro p { line-height: 1.7; font-family: Georgia, serif; color: #3d3d3d; }
#content.viewer-style-retro ul { list-style: square; padding-left: 1.5rem; color: #3d3d3d; }
#content.viewer-style-retro ol { list-style: decimal; padding-left: 1.5rem; font-family: Georgia, serif; }
#content.viewer-style-retro pre { background: #e8e4dc; padding: 1rem; border: 1px solid #8b7355; color: #2d2d2d; font-family: 'Courier New', monospace; }
#content.viewer-style-retro code { background: #e8e4dc; color: #5c4033; padding: 0.1rem 0.3rem; font-family: 'Courier New', monospace; font-size: 0.9em; border: 1px solid #c4b8a8; }
#content.viewer-style-retro blockquote { border-left: 4px solid #8b7355; padding-left: 1rem; font-style: italic; color: #5c5c5c; font-family: Georgia, serif; }
#content.viewer-style-retro a { color: #6b5344; text-decoration: underline; }
#content.viewer-style-retro table { border-collapse: collapse; width: 100%; }
#content.viewer-style-retro th, #content.viewer-style-retro td { border: 1px solid #8b7355; padding: 0.5rem 0.75rem; font-family: Georgia, serif; }
#content.viewer-style-retro th { background: #e8e4dc; font-weight: 700; color: #2d2d2d; }