/* MK Visual 4: detailed transparent art behind AND above the existing case. */
.post-single article .mk-artwork-scene {
  box-sizing:border-box; position:relative; isolation:isolate; display:block;
  float:left; width:var(--mk-media-box-width,298px); max-width:46%;
  margin:40px 40px 48px 0; padding:0; overflow:visible;
  --mk-visual-hover-transform:translate(var(--mk-visual-x,0px),calc(-5px + var(--mk-visual-y,0px))) rotate(0deg) scale(1.075);
}
.post-single article .mk-artwork-scene::before {
  content:''; position:absolute; inset:-32px -9px -27px -30px;
  z-index:-2; pointer-events:none;
  background:radial-gradient(ellipse at 36% 70%,#11131866,transparent 66%),radial-gradient(ellipse at 58% 30%,#3e3d3a44,transparent 72%);
  filter:blur(12px);
}
.post-single article .mk-artwork-scene > .mk-artwork-background {
  position:absolute; inset:-48px -10px -27px -36px; overflow:visible;
  z-index:-1; pointer-events:none;
  -webkit-mask-image:linear-gradient(transparent,#000 7%,#000 92%,transparent),linear-gradient(90deg,transparent,#000 5%,#000 94%,transparent);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(transparent,#000 7%,#000 92%,transparent),linear-gradient(90deg,transparent,#000 5%,#000 94%,transparent);
  mask-composite:intersect;
}
.post-single article .mk-artwork-scene .mk-artwork-decor {
  position:absolute; display:block; pointer-events:none; user-select:none;
  background-repeat:no-repeat; background-position:center; background-size:100% 100%;
}
.post-single article .mk-artwork-scene .mk-artwork-arch {
  width:100%; height:112%; left:0; top:-2%; opacity:.94;
  transform-origin:center;
}
.post-single article .mk-artwork-scene .mk-artwork-echo {
  width:87%; height:93%; right:-12%; bottom:-8%; opacity:.43; transform:rotate(180deg);
}
.post-single article .mk-artwork-scene[data-arch-position="1"] .mk-artwork-arch { transform:scaleX(-1); }
.post-single article .mk-artwork-scene[data-arch-position="2"] .mk-artwork-arch { transform:rotate(-9deg); top:-16%; }
.post-single article .mk-artwork-scene[data-arch-position="3"] .mk-artwork-arch { transform:scaleX(-1) rotate(-9deg); top:-16%; }
.post-single article .mk-artwork-scene[data-arch-position="4"] .mk-artwork-arch { transform:rotate(180deg); top:4%; }
.post-single article .mk-artwork-scene[data-arch-position="5"] .mk-artwork-arch { transform:scaleY(-1); top:4%; }
.post-single article .mk-artwork-scene[data-scene-mirror="1"] .mk-artwork-echo { transform:rotate(173deg) scaleX(-1); }
.post-single article .mk-artwork-scene[data-scene-wash="1"] .mk-artwork-background { opacity:.86; }
.post-single article .mk-artwork-scene[data-scene-wash="2"] .mk-artwork-background { filter:contrast(1.12); }
/* Let complete leaves and shadows extend beyond the layer. The float reserves
   their overhang; square boxes keep rotated sprays bounded on tall photos. */
.post-single article .mk-artwork-scene > .mk-artwork-foreground {
  position:absolute; inset:-24px -10px -22px -29px; z-index:3;
  overflow:visible; pointer-events:none; user-select:none;
}
.post-single article .mk-artwork-scene .mk-artwork-leaves {
  width:42%; height:65.5%; left:-3%; bottom:-1%;
  filter:drop-shadow(1px 3px 2px #11131844);
}
.post-single article .mk-artwork-scene .mk-artwork-leaf-echo {
  width:24%; height:40%; right:-3%; top:-1%; opacity:.58;
  transform:rotate(180deg); filter:drop-shadow(1px 2px 1px #11131833);
}
.post-single article .mk-artwork-scene[data-leaf-position="0"] .mk-artwork-leaves { top:0; bottom:auto; transform:scaleY(-1); }
.post-single article .mk-artwork-scene[data-leaf-position="1"] .mk-artwork-leaves { left:auto; right:-2%; top:0; bottom:auto; transform:rotate(180deg); }
.post-single article .mk-artwork-scene[data-leaf-position="3"] .mk-artwork-leaves { left:auto; right:-2%; transform:scaleX(-1); }
.post-single article .mk-artwork-scene[data-leaf-position="4"] .mk-artwork-leaves { width:56.5%; height:auto; aspect-ratio:1; left:7%; bottom:5%; transform:rotate(-62deg); }
.post-single article .mk-artwork-scene[data-leaf-position="5"] .mk-artwork-leaves { width:56.5%; height:auto; aspect-ratio:1; left:13%; top:7%; bottom:auto; transform:rotate(113deg); }
.post-single article .mk-artwork-scene[data-leaf-position="1"] .mk-artwork-leaf-echo,
.post-single article .mk-artwork-scene[data-leaf-position="3"] .mk-artwork-leaf-echo { left:0; right:auto; top:auto; bottom:0; transform:none; }
.post-single article .mk-artwork-scene > .post-image.mk-artwork-monitor {
  position:relative; z-index:1; float:none; width:100%; max-width:100%; margin:0;
  transform:rotate(var(--mk-artwork-angle,-1.5deg)) !important;
  transform-origin:50% 50%;
  transition:transform .42s cubic-bezier(.2,.7,.2,1),box-shadow .42s ease;
}
/* Direct parent hover works without :has() and includes the frame edge. The
   pointer class also covers hybrid devices reporting no primary hover. */
.post-single article .mk-artwork-scene.mk-artwork-hover > .mk-artwork-monitor,
.post-single article .mk-artwork-scene:focus-within > .mk-artwork-monitor {
  transform:var(--mk-visual-hover-transform) !important;
  box-shadow:inset 0 0 0 1px #24291d,inset 0 0 0 2px #71765b,0 17px 30px #171b174d;
}
@media (any-hover:hover) {
  .post-single article .mk-artwork-scene:hover > .mk-artwork-monitor {
    transform:var(--mk-visual-hover-transform) !important;
    box-shadow:inset 0 0 0 1px #24291d,inset 0 0 0 2px #71765b,0 17px 30px #171b174d;
  }
}
body.lg-on .post-single article .mk-artwork-scene > .mk-artwork-monitor { transform:rotate(var(--mk-artwork-angle,-1.5deg)) !important; }
@media (prefers-reduced-motion:reduce) {
  .post-single article .mk-artwork-scene { --mk-visual-hover-transform:rotate(var(--mk-artwork-angle,-1.5deg)); }
  .post-single article .mk-artwork-scene > .mk-artwork-monitor { transition:none; }
}
@media (max-width:640px) {
  .post-single article .mk-artwork-scene { float:none; max-width:calc(100% - 40px); margin:44px auto 52px; }
}