.article-page{min-height:700px;padding:34px 18px 70px;background:#f5f7fa}
.article-card{width:min(980px,100%);margin:auto;border-radius:18px;background:#fff;box-shadow:0 14px 42px rgba(39,55,72,.08);overflow:hidden}
.article-loading{padding:120px 30px;text-align:center;color:#94777b}
.article-content-shell[hidden]{display:none}
.article-header{padding:34px 46px 30px;border-bottom:1px solid #eceff2}
.article-back{display:inline-block;margin-bottom:22px;color:#8c5b62;font-size:13px;text-decoration:none}
.article-back:hover{color:#b0182e}
.article-title-row{display:flex;gap:12px;align-items:flex-start}
.article-title-row>span{flex:0 0 auto;margin-top:5px;padding:5px 9px;border-radius:5px;background:#ef3f52;color:#fff;font-size:13px;font-weight:700}
.article-title-row h1{margin:0;color:#60111d;font-size:30px;line-height:1.45}
.article-meta{display:flex;align-items:center;gap:10px;margin-top:20px;color:#7f7d82;font-size:13px}
.article-meta i{width:1px;height:12px;background:#ccd0d5}
.article-summary{display:grid;grid-template-columns:48px 1fr;align-items:center;margin-top:26px;border:1px solid #e5e7eb;border-radius:10px;background:#f8fafc;overflow:hidden}
.article-summary b{align-self:stretch;display:grid;place-items:center;border-right:1px solid #e5e7eb;background:#fff;color:#5b111c;font-size:13px}
.article-summary p{margin:0;padding:13px 16px;color:#525862;font-size:14px;line-height:1.8}
.markdown-body{padding:36px 46px 55px;color:#30343b;font-size:16px;line-height:1.95}
.markdown-body p{margin:0 0 20px}
.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5{position:relative;margin:38px 0 18px;color:#4f111a;line-height:1.45}
.markdown-body h2{padding-left:15px;font-size:24px}.markdown-body h2::before{position:absolute;left:0;top:.22em;width:5px;height:1.1em;border-radius:4px;background:#b51f34;content:""}
.markdown-body h3{font-size:20px}.markdown-body h4,.markdown-body h5{font-size:17px}
.markdown-body strong{color:#6f1724}
.markdown-body a{color:#168343;text-decoration:underline;text-underline-offset:3px}
.markdown-body code{padding:2px 6px;border-radius:4px;background:#f2f4f6;color:#a22538;font-size:.9em}
.markdown-body ul,.markdown-body ol{margin:0 0 22px;padding-left:28px}.markdown-body li{margin:5px 0}
.markdown-body blockquote{margin:24px 0;padding:15px 20px;border-left:5px solid #41a765;border-radius:0 8px 8px 0;background:#f1faf4;color:#396146}
.markdown-body figure{margin:28px 0;text-align:center}
.markdown-body figure img,.markdown-body>p img{max-width:100%;height:auto;border-radius:10px}
.markdown-body figcaption{margin-top:8px;color:#95999f;font-size:12px}
.article-image-placeholder{display:grid;min-height:150px;place-items:center;margin:24px 0;border:1px dashed #d7b6bc;border-radius:10px;background:#fff7f8;color:#9b6f76;font-size:13px}
.article-table-wrap{max-width:100%;margin:24px 0;overflow-x:auto;border:1px solid #dfe2e6;border-radius:9px}
.markdown-body table{width:100%;border-collapse:collapse;background:#fff;font-size:14px;line-height:1.55}
.markdown-body th{padding:12px 14px;border-right:1px solid #e0e2e5;background:#f1f2f4;color:#4b151d;text-align:center;font-weight:700}
.markdown-body td{padding:11px 14px;border-top:1px solid #e1e3e6;border-right:1px solid #e8eaec;text-align:center}
.markdown-body th:last-child,.markdown-body td:last-child{border-right:0}.markdown-body tbody tr:nth-child(even){background:#fafafa}
@media(max-width:650px){.article-page{padding:14px 10px 45px}.article-header{padding:24px 20px}.article-title-row h1{font-size:23px}.article-title-row>span{margin-top:3px}.article-summary{grid-template-columns:42px 1fr}.markdown-body{padding:26px 20px 40px;font-size:15px}.markdown-body h2{font-size:21px}.article-meta{flex-wrap:wrap}}
