.markdown-content p { margin: 0 0 1em 0; } .markdown-content p:last-child { margin-bottom: 0; } .markdown-content h1, .markdown-content h2, .markdown-content h3, .markdown-content h4, .markdown-content h5, .markdown-content h6 { margin: 1.5em 0 0.5em 0; color: #333; font-weight: 600; } .markdown-content h1:first-child, .markdown-content h2:first-child, .markdown-content h3:first-child { margin-top: 0; } .markdown-content ul, .markdown-content ol { margin: 0.5em 0; padding-left: 2em; } .markdown-content li { margin: 0.25em 0; } .markdown-content code { background: #f4f4f4; padding: 2px 6px; border-radius: 4px; font-family: 'Consolas', 'Monaco', monospace; font-size: 0.9em; } .markdown-content pre { background: #f4f4f4; padding: 15px; border-radius: 8px; overflow-x: auto; margin: 1em 0; } .markdown-content pre code { background: none; padding: 0; } .markdown-content blockquote { border-left: 4px solid #667eea; margin: 1em 0; padding: 0.5em 1em; background: #f8f9fa; color: #666; } .markdown-content a { color: #667eea; text-decoration: none; } .markdown-content a:hover { text-decoration: underline; } .markdown-content table { border-collapse: collapse; width: 100%; margin: 1em 0; } .markdown-content th, .markdown-content td { border: 1px solid #e0e0e0; padding: 8px 12px; text-align: left; } .markdown-content th { background: #f8f9fa; font-weight: 600; } .markdown-content hr { border: none; border-top: 2px solid #e0e0e0; margin: 1.5em 0; } .lightbox { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); z-index: 9999; justify-content: center; align-items: center; cursor: zoom-out; } .lightbox.active { display: flex; } .lightbox img { max-width: 90%; max-height: 90%; object-fit: contain; border-radius: 8px; box-shadow: 0 0 30px rgba(0, 0, 0, 0.5); } .lightbox-close { position: absolute; top: 20px; right: 30px; color: white; font-size: 40px; cursor: pointer; z-index: 10000; transition: opacity 0.2s; } .lightbox-close:hover { opacity: 0.7; }