body{background:#f5f7fa;color:#2d3748}
.page-wrap{max-width:900px;margin:32px auto;padding:0 16px}
.page-title{text-align:center !important;font-size:22px;margin:30px 0 10px;line-height:1.4;font-weight:600}
.page-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px;font-size:13px;color:#718096;margin-bottom:15px;text-align:center}
.page-meta span{display:inline-flex;align-items:center;gap:4px}
.page-meta i{opacity:.8}
.page-card{background:#fff;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.06);padding:22px}
.page-content{font-size:16px;line-height:1.9;word-break:break-word}
.page-content img{max-width:100%;height:auto}

/* 代码高亮 - 与文章页面一致 */
.page-content .code-block-wrapper{margin:12px 0;padding:16px;background:#fff;border-radius:6px;border:1px solid #ddd;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.page-content .code-block-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.page-content .code-block-lang-label{font-size:14px;font-weight:500;color:#333;border-bottom:2px solid #FF4D4F;padding-bottom:2px}
.page-content .code-block-toolbar{flex-shrink:0}
.page-content .code-copy-btn{padding:6px 14px;font-size:12px;color:#555;background:#f0f0f0;border:1px solid #e0e0e0;border-radius:4px;cursor:pointer;transition:all .2s;white-space:nowrap}
.page-content .code-copy-btn:hover{color:#333;background:#e8e8e8}
.page-content .code-copy-btn.copied{color:#4CAF50;border-color:#4CAF50;background:#e8f5e9}
.page-content .code-block-inner{background:#f8f8f8;border:1px solid #eee;border-radius:6px;overflow:hidden;position:relative;isolation:isolate}
.page-content .code-block-inner pre[class*="language-"]{margin:0;padding:16px 20px;border:none;background:transparent;font-size:13px;line-height:1.5;overflow-x:auto;max-height:400px;overflow-y:auto;white-space:pre}
.page-content .code-block-inner code{display:block;white-space:pre;word-break:normal;overflow-wrap:normal}
.page-content pre[class*="language-"]:not(.code-block-wrapper pre){margin:12px 0;padding:14px 20px;border-radius:6px;overflow-x:auto;font-size:13px;line-height:1.5;border:1px solid #ebeae8;background:#f8f7f5}
/* Prism token 颜色 - 与文章页一致 */
.page-content .token.comment,.page-content .token.prolog,.page-content .token.doctype,.page-content .token.cdata{color:#8d9baa}
.page-content .token.keyword,.page-content .token.selector,.page-content .token.atrule,.page-content .token.important{color:#a078e4}
.page-content .token.string,.page-content .token.attr-value,.page-content .token.regex{color:#e3666f}
.page-content .token.variable,.page-content .token.number,.page-content .token.boolean,.page-content .token.constant{color:#6eb6ff}
.page-content .token.function,.page-content .token.class-name,.page-content .token.builtin{color:#4dc370}
.page-content .token.punctuation,.page-content .token.operator{color:#4a5568}
.page-content .token.tag,.page-content .token.property{color:#6eb6ff}

/* 正文内表格样式（后台编辑器插入的表格） */
.page-content table{border-collapse:collapse;width:100%;margin:1em 0;min-width:200px}
.page-content table td,.page-content table th{border:1px solid #dcdcde;padding:8px 10px;text-align:left;vertical-align:top}
.page-content table th{background-color:#f6f7f7;font-weight:600}
.page-content .table-wrapper{overflow-x:auto;margin:1em 0}
.page-content .table-wrapper table{margin:0;min-width:200px}

.image-preview-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:10001;align-items:center;justify-content:center}
.image-preview-modal.is-open{display:flex}
.image-preview-modal-img{max-width:96vw;max-height:92vh;border-radius:8px}
