/* Markdown 编辑器 */
.editor-wrapper { border: 1px solid rgba(168, 85, 247, 0.3); border-radius: 0.8rem; overflow: hidden; background: rgba(0, 0, 0, 0.2); }
.editor-toolbar { display: flex; gap: 0.3rem; padding: 0.8rem 1rem; background: rgba(15, 23, 42, 0.8); border-bottom: 1px solid rgba(168, 85, 247, 0.2); flex-wrap: wrap; }
.editor-toolbar button { width: 3.6rem; height: 3.6rem; border: 1px solid rgba(168, 85, 247, 0.2); border-radius: 0.5rem; background: rgba(168, 85, 247, 0.08); color: #e2e8f0; font-size: 1.4rem; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; justify-content: center; }
.editor-toolbar button:hover { background: rgba(168, 85, 247, 0.25); border-color: #a855f7; color: #a855f7; }
.editor-toolbar .toolbar-sep { width: 1px; background: rgba(168, 85, 247, 0.2); margin: 0 0.3rem; }
.editor-body { display: flex; min-height: 30rem; }
.editor-input { flex: 1; padding: 1.5rem; font-size: 1.5rem; font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace; border: none; outline: none; resize: none; background: transparent; color: #e2e8f0; line-height: 1.8; }
.editor-preview { flex: 1; padding: 1.5rem; border-left: 1px solid rgba(168, 85, 247, 0.2); overflow-y: auto; background: rgba(0, 0, 0, 0.1); }

/* Markdown 渲染内容样式 */
.markdown-body { font-size: 1.7rem; color: #cbd5e1; line-height: 2; }
.markdown-body h1 { font-size: 2.8rem; color: #e2e8f0; margin: 2rem 0 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid rgba(168, 85, 247, 0.2); }
.markdown-body h2 { font-size: 2.4rem; color: #e2e8f0; margin: 1.8rem 0 1rem; padding-bottom: 0.4rem; border-bottom: 1px solid rgba(168, 85, 247, 0.15); }
.markdown-body h3 { font-size: 2rem; color: #e2e8f0; margin: 1.5rem 0 0.8rem; }
.markdown-body h4, .markdown-body h5, .markdown-body h6 { font-size: 1.8rem; color: #e2e8f0; margin: 1.2rem 0 0.6rem; }
.markdown-body p { margin-bottom: 1.2rem; }
.markdown-body a { color: #a855f7; text-decoration: none; border-bottom: 1px solid rgba(168, 85, 247, 0.3); transition: all 0.2s; }
.markdown-body a:hover { color: #ec4899; border-color: #ec4899; }
.markdown-body img { max-width: 100%; border-radius: 0.8rem; margin: 1rem 0; border: 1px solid rgba(168, 85, 247, 0.15); }
.markdown-body blockquote { border-left: 4px solid #a855f7; padding: 1rem 1.5rem; margin: 1rem 0; background: rgba(168, 85, 247, 0.06); border-radius: 0 0.8rem 0.8rem 0; color: #94a3b8; }
.markdown-body blockquote p { margin-bottom: 0.5rem; }
.markdown-body code { font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace; background: rgba(168, 85, 247, 0.12); padding: 0.2rem 0.5rem; border-radius: 0.3rem; font-size: 0.9em; color: #e879f9; }
.markdown-body pre { background: rgba(15, 23, 42, 0.9); border: 1px solid rgba(168, 85, 247, 0.2); border-radius: 0.8rem; padding: 1.5rem; overflow-x: auto; margin: 1rem 0; }
.markdown-body pre code { background: none; padding: 0; color: #e2e8f0; font-size: 1.4rem; }
.markdown-body ul, .markdown-body ol { padding-left: 2.5rem; margin-bottom: 1rem; }
.markdown-body li { margin-bottom: 0.5rem; line-height: 1.8; }
.markdown-body ul li::marker { color: #a855f7; }
.markdown-body ol li::marker { color: #a855f7; font-weight: 600; }
.markdown-body hr { border: none; height: 2px; background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.3), transparent); margin: 2rem 0; }
.markdown-body table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
.markdown-body th, .markdown-body td { padding: 0.8rem 1rem; border: 1px solid rgba(168, 85, 247, 0.2); text-align: left; }
.markdown-body th { background: rgba(168, 85, 247, 0.1); color: #e2e8f0; font-weight: 600; }

/* 上传进度 */
.upload-progress { display: none; padding: 0.8rem 1.5rem; font-size: 1.3rem; color: #a855f7; background: rgba(168, 85, 247, 0.06); border-top: 1px solid rgba(168, 85, 247, 0.15); text-align: center; }
.upload-progress.show { display: block; }

/* 标签选择 */
.tags-section { margin-top: 1.5rem; }
.field-label { font-size: 1.4rem; color: #94a3b8; margin-bottom: 0.8rem; display: block; }
.tags-list { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.tag-item { display: inline-block; padding: 0.5rem 1.2rem; font-size: 1.3rem; border: 1px solid rgba(168, 85, 247, 0.25); border-radius: 2rem; background: rgba(168, 85, 247, 0.06); color: #94a3b8; cursor: pointer; transition: all 0.2s; user-select: none; }
.tag-item:hover { border-color: #a855f7; color: #a855f7; }
.tag-item.selected { background: linear-gradient(135deg, #a855f7, #ec4899); border-color: transparent; color: #fff; box-shadow: 0 2px 10px rgba(168, 85, 247, 0.3); }
.tags-hint { font-size: 1.2rem; color: #475569; margin-top: 0.5rem; }

/* 文章标签展示 */
.article-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; justify-content: center; }
.article-tag { display: inline-block; padding: 0.3rem 1rem; font-size: 1.2rem; border: 1px solid rgba(168, 85, 247, 0.2); border-radius: 2rem; background: rgba(168, 85, 247, 0.06); color: #94a3b8; cursor: pointer; transition: all 0.2s; text-decoration: none; }
.article-tag:hover { border-color: #a855f7; color: #a855f7; background: rgba(168, 85, 247, 0.12); }

/* 点赞/收藏按钮 */
.action-bar { display: flex; align-items: center; gap: 1.5rem; margin-top: 2rem; justify-content: center; padding-top: 1.5rem; border-top: 1px solid rgba(168, 85, 247, 0.1); }
.action-btn { display: flex; align-items: center; gap: 0.5rem; padding: 0.6rem 1.5rem; font-size: 1.4rem; border: 1px solid rgba(168, 85, 247, 0.2); border-radius: 2rem; background: rgba(168, 85, 247, 0.04); color: #64748b; cursor: pointer; transition: all 0.2s; }
.action-btn:hover { border-color: #a855f7; color: #a855f7; }
.action-btn.liked { border-color: #ef4444; color: #ef4444; background: rgba(239, 68, 68, 0.08); }
.action-btn.favorited { border-color: #f59e0b; color: #f59e0b; background: rgba(245, 158, 11, 0.08); }
.action-btn .icon { font-size: 1.6rem; }
.action-btn .count { font-size: 1.3rem; }

/* 移动端适配 */
@media (max-width: 768px) {
    .editor-toolbar { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; }
    .editor-toolbar button { min-width: 4.4rem; min-height: 4.4rem; flex-shrink: 0; }
    .editor-body { flex-direction: column; min-height: 40rem; }
    .editor-preview { border-left: none; border-top: 1px solid rgba(168, 85, 247, 0.2); }
    .markdown-body { font-size: 1.5rem; }
    .markdown-body pre { padding: 1rem; font-size: 1.2rem; }
    .markdown-body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .action-bar { flex-wrap: wrap; gap: 1rem; }
    .action-btn { padding: 0.8rem 1.2rem; font-size: 1.3rem; }
    .tags-list { gap: 0.5rem; }
}