.article-page-header{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:24px;
}
.article-header-actions{display:flex;align-items:flex-start;gap:14px}
.article-hero-image,.article-hero-placeholder{
    width:180px;height:140px;border:1px solid var(--border);border-radius:12px;
    background:#fff;overflow:hidden;box-shadow:var(--shadow);flex:0 0 auto
}
.article-hero-image{display:block;text-decoration:none}
.article-hero-image img{width:100%;height:100%;object-fit:contain;display:block}
.article-hero-placeholder{
    display:grid;place-items:center;color:var(--text-soft);background:var(--hw-light-blue);
    font-size:13px;font-weight:700
}
.article-table .image-column{width:58px;min-width:58px;padding-right:4px}
.article-list-thumb,.article-list-placeholder{
    width:48px;height:48px;border-radius:8px;border:1px solid var(--border);background:#fff
}
.article-list-thumb{display:block;object-fit:cover}
.article-list-placeholder{
    display:grid;place-items:center;background:var(--hw-light-blue);color:var(--hw-navy);
    font-size:10px;font-weight:800;letter-spacing:.05em
}
.article-file-preview{
    display:block;width:88px;height:88px;flex:0 0 88px;border:1px solid var(--border);
    border-radius:8px;overflow:hidden;background:#fff
}
.article-file-preview img{width:100%;height:100%;object-fit:cover;display:block}
.detail-card:has(.article-file-preview)>div:first-child{display:flex;align-items:flex-start;gap:14px}
@media(max-width:760px){
    .article-page-header{grid-template-columns:1fr}
    .article-header-actions{width:100%;justify-content:space-between}
    .article-hero-image,.article-hero-placeholder{width:140px;height:110px}
}
