.blog-public{max-width:1200px;margin:auto;padding:48px 24px;color:var(--ink);overflow-wrap:anywhere}
.blog-public h1{font-size:40px;line-height:1.15;margin:20px 0}
.blog-public h2{font-size:25px;line-height:1.25}
.blog-public a{color:inherit;text-underline-offset:4px}
.blog-filters{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.blog-filters input,.blog-filters select,.blog-filters button{font:inherit;padding:10px;border:1px solid var(--line);max-width:100%}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.blog-grid article{min-width:0;border-bottom:1px solid var(--line);padding-bottom:24px}
.blog-grid img{width:100%;aspect-ratio:3/2;object-fit:cover}
.blog-article{max-width:900px}
.blog-cover{display:block;width:100%;height:auto;margin:28px 0}
.blog-body{font-size:18px;line-height:1.7}
.blog-body p{color:inherit}
.blog-body blockquote{border-left:3px solid var(--line);margin:24px 0;padding:0 24px}
@media(max-width:700px){.blog-grid{grid-template-columns:1fr}.blog-public h1{font-size:30px}}
.blog-dialog{width:min(1160px,96vw);max-width:96vw;height:90dvh;max-height:90dvh;padding:0;border:1px solid #dfe3e9;border-radius:8px;background:#fff;color:#222;overflow:auto;font:14px Arial,sans-serif}
.blog-dialog::backdrop{background:#0006}
.blog-dialog header{display:flex;align-items:center;gap:16px;padding:16px 24px;border-bottom:1px solid #ddd;position:sticky;top:0;background:white;z-index:2}
.blog-dialog header h2{margin:0;font:700 22px Arial,sans-serif;color:#222}
.blog-dialog header button:last-child{margin-left:auto}
.blog-dialog button,.blog-dialog input,.blog-dialog select,.blog-dialog textarea{font:inherit;color:#222;background:#fff;border:1px solid #ccc;border-radius:4px;padding:9px;max-width:100%;min-width:0}
.blog-dialog button{cursor:pointer}
.blog-dialog button:disabled{opacity:.5;cursor:default}
.blog-dialog button:focus-visible,.blog-dialog input:focus-visible,.blog-dialog [contenteditable]:focus-visible{outline:2px solid #146ef5}
.blog-workspace{display:grid;grid-template-columns:260px minmax(0,1fr)}
.blog-sidebar{padding:20px;border-right:1px solid #ddd}
.blog-sidebar>input{width:100%;margin-bottom:12px}
.blog-post-list{display:flex;flex-direction:column;gap:8px}
.blog-post-list button{text-align:left;overflow-wrap:anywhere}
.blog-post-list small{display:block;color:#666;margin-top:6px}
.blog-edit{padding:24px}
.blog-edit[hidden]{display:none}
.blog-edit label{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;font-weight:600}
.blog-edit .blog-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.blog-edit .blog-fields label{min-width:0}
.blog-toolbar,.blog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.blog-editor{min-height:280px;border:1px solid #ccc;padding:16px;overflow-wrap:anywhere;font:16px/1.6 Arial,sans-serif;color:#222;background:white}
.blog-editor p{color:inherit}
.blog-editor h2{font-size:26px}
.blog-preview-cover{display:block;max-width:240px;max-height:150px;object-fit:contain;margin-bottom:12px}
.blog-preview-cover[hidden]{display:none}
.blog-status{padding:12px 24px;color:#333}
@media(max-width:700px){.blog-workspace{grid-template-columns:1fr}.blog-sidebar{border-right:0;border-bottom:1px solid #ddd}.blog-edit .blog-fields{grid-template-columns:1fr}.blog-edit{padding:16px}}
