#slide,.print-slide{isolation:isolate}
#slide::before,.print-slide::before{
  content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background-image:var(--slide-bg,none);background-size:cover;background-position:center;
  opacity:var(--slide-bg-opacity,.3)
}
#slide::after,.print-slide::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(11,13,16,.45),rgba(11,13,16,.16) 48%,rgba(11,13,16,.42)),
    linear-gradient(180deg,rgba(11,13,16,.05),rgba(11,13,16,.18));
  opacity:var(--slide-shade-opacity,0)
}

/* 压暗层默认关闭（浅色主题下它会把整页压灰）；注册背景图的页面再用 --slide-shade-opacity 打开。
   逐页背景图待出图后按 README 素材 C.6 注册，例如：
#slide[data-slide-id="P13"],.print-slide[data-slide-id="P13"]{
  --slide-bg:url("assets/backgrounds/P13.webp");--slide-bg-opacity:.52;--slide-shade-opacity:1}
*/

@media (prefers-reduced-transparency:reduce){
  #slide::before,.print-slide::before{opacity:.12}
}

/* P1 封面：图是深色、左侧留白给标题，所以不压暗、不减淡 */
#slide[data-slide-id="P1"],.print-slide[data-slide-id="P1"]{
  --slide-bg:url("assets/cover.webp");--slide-bg-opacity:1;--slide-shade-opacity:0}
/* 浅色主题下深色封面会吃掉深色标题，浅色主题不挂这张图 */
html[data-theme="wave"] #slide[data-slide-id="P1"],html[data-theme="editorial"] #slide[data-slide-id="P1"],
html[data-theme="1984"] #slide[data-slide-id="P1"],html[data-theme="wave"] .print-slide[data-slide-id="P1"],
html[data-theme="editorial"] .print-slide[data-slide-id="P1"],html[data-theme="1984"] .print-slide[data-slide-id="P1"]{--slide-bg:none}
/* 屏幕比图窄时从左边裁（左边是空白），岛始终完整留在右侧 */
#slide[data-slide-id="P1"]::before,.print-slide[data-slide-id="P1"]::before{background-position:right center}
