/* ============================================================
   作品详情页
   2026-09-04：顶部横幅 .work-hero（作者 cover 背景 + 甲方 Logo + 项目名 +
   作者头像/昵称）整块移除——详情页只展示作品本身。原 hero 用负 margin-top
   上移到导航栏底下，删掉后正文自然从 .site-nav-top（relative，占文档流
   48px）下方开始，无需再补顶部偏移。
   ============================================================ */

/* 旧版布局的正文容器（未用 studio 编辑器的老作品）：这里【不】做通顶。
   通顶是给"第一个元素是 cover/图片大图"的展示页准备的（见 studio/css/page.css），
   而旧版布局第一个元素通常是文字描述，若也上移到视口 0，首行会被 48px 高的
   置顶导航压住看不见。所以保持从导航下沿开始，视觉起点不变。
   左右留白沿用 --gutter-home。
   注意：这里不再跟 hero 联动（原 .work-hero ~ .work-legacy 的 56px 上间距），
   因为头部已删除、也不再有任何元素插在它与页面顶部之间 */
.work-legacy {
    padding: 56px var(--gutter-home) 80px;
    max-width: 800px;
}
.work-legacy .work-desc {
    color: var(--color-text);
    font-size: 16px;
}

/* ---- 草稿 / 封禁预览横幅（2026-08-30 加，2026-10-20 挪位置）----
   作品未公开（draft）或被封禁（offline）时，只有作者、协作者与管理员
   能看到这个页面（其他人 404）。这条横幅提醒作者「你看的不是线上版」。

   位置（2026-10-20 用户指定）：渲染在页面最顶端——HTML 结构上是
   base.html 的 top_banner 插槽，**在置顶导航栏之前**，所以打开页面
   先看到它、导航条位于它下面。它是普通文档流（不 fixed），随页面滚动
   一起滚出视口；滚动后出现的胶囊导航照常贴顶，不受这条影响。
   因此这里的样式只管"一条通栏、左右贴边、内容两端对齐"，
   不要再加 position:fixed / sticky —— 那是分享预览条 .sp-bar 的做法。 */
.draft-preview-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px var(--gutter-home);
    background: #fff4e0;
    border-bottom: 1px solid #f0d5a8;
    color: #7a4f09;
    font-size: 13px;
    line-height: 1.5;
}
.draft-preview-tag {
    flex: none;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f0a020;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
}
/* 已封禁标签变体（后台 P0 · L1）：与"草稿预览"区分——管理员封禁用深灰，
   对齐后台状态色规范（§6：已封禁=深灰） */
.draft-preview-tag.offline-tag {
    background: #6e6e73;
}
/* 已封禁横幅底色：灰调，与草稿的橙色调区分 */
.draft-preview-bar:has(.offline-tag) {
    background: #f2f2f4;
    border-bottom-color: #dcdce0;
    color: #48484d;
}
.draft-preview-bar:has(.offline-tag) .draft-preview-link {
    color: #48484d;
}
.draft-preview-bar:has(.offline-tag) .draft-preview-link:hover {
    color: #1d1d1f;
}
.draft-preview-text { flex: 1 1 auto; }
.draft-preview-link {
    flex: none;
    color: #7a4f09;
    text-decoration: underline;
}
.draft-preview-link:hover { color: #b06a00; }

/* ---------- 多页作品里的「空页面」占位（2026-10-20） ----------
   作者建了页但还没往里放区块时，服务端没有 page_html 可渲染。
   以前这种页会落到旧版图片布局（把整个作品的封面图 / 描述重放一遍），
   看起来像"点了没切换"，所以模板里改成独立占位分支，这里给它排版。
   颜色用继承 + opacity：不写死深浅，深底模组页面（cover 之类）上也读得清。 */
.work-page-empty {
    margin: 0 auto;
    max-width: 640px;
    padding: 30vh 24px;        /* 垂直给足呼吸，占位居中不贴顶 */
    text-align: center;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0.01em;
    color: inherit;
    opacity: 0.45;
}