/* ==========================================================
   创作页 · 文章样式（工具栏等通用样式复用 style.css）
   ========================================================== */

/* 页头 */
.articles-hero{
  background:var(--navy);
  color:#fff;
  padding:64px 0 52px;
  position:relative;
  overflow:hidden;
}
.articles-hero::after{
  content:"";position:absolute;right:-80px;top:-80px;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(200,149,44,.28),transparent 70%);
}
.articles-h{font-size:34px;letter-spacing:.04em;position:relative;}
.articles-sub{margin:12px 0 0;color:rgba(255,255,255,.78);font-size:15px;position:relative;}

/* 列表容器 */
.posts-wrap{max-width:820px;}
#articleList{display:flex;flex-direction:column;gap:30px;}

/* 单篇文章卡片 */
.post{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  position:relative;
  transition:.18s;
}
.post:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);}

.post-cover{width:100%;aspect-ratio:16/7;background:#eef2f8;overflow:hidden;}
.post-cover img{width:100%;height:100%;object-fit:cover;}
.post-cover-empty{
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-3);font-size:14px;cursor:pointer;border-bottom:1px dashed var(--line);
}

.post-head{padding:24px 28px 6px;}
.post-title{font-size:23px;color:var(--navy);line-height:1.35;}
.post-date{margin-top:6px;font-size:13px;color:var(--ink-3);letter-spacing:.04em;}

.post-body{padding:6px 28px 26px;}
.post-text{margin:16px 0;font-size:15.5px;color:var(--ink-2);}
.post-text span{display:block;}

.post-fig{margin:20px 0;}
.post-img{width:100%;border-radius:10px;overflow:hidden;background:#eef2f8;min-height:120px;}
.post-img img{width:100%;display:block;}
.post-fig .post-fb{
  display:flex;align-items:center;justify-content:center;min-height:120px;
  color:var(--ink-3);font-size:14px;cursor:pointer;border:1px dashed var(--line);border-radius:10px;
}
.post-cap{margin-top:8px;font-size:13px;color:var(--ink-3);text-align:center;}

/* 编辑态：图文块新增按钮 */
.block-add{display:flex;gap:10px;margin-top:18px;}
.block-add .row-add{flex:1;justify-content:center;}

/* 新建文章按钮 */
.posts-add{margin-top:30px;}
.posts-new{display:block;width:100%;padding:16px;font-size:15px;}

/* 图片占位 / 缺图 */
.post-fb{color:var(--ink-3);}

/* 编辑态下可编辑元素高亮 */
.editing [data-editable]{outline:1px dashed rgba(200,149,44,.55);outline-offset:2px;border-radius:4px;}
.editing [data-editable]:focus{outline-color:var(--gold);background:rgba(200,149,44,.06);}
.editing .post-cover-empty,.editing .post-fb{cursor:pointer;}

/* 响应式 */
@media (max-width:620px){
  .articles-hero{padding:48px 0 40px;}
  .articles-h{font-size:27px;}
  .post-head{padding:20px 18px 4px;}
  .post-body{padding:4px 18px 22px;}
}