/* A small paper corner, separate from the photograph's own image transition. */
.camper-peek {
  position:absolute; right:0; bottom:0; z-index:4;
  width:clamp(104px,9vw,156px); aspect-ratio:1; min-width:44px; min-height:44px;
  display:block; padding:0; border:0; border-radius:0; background:none;
  color:var(--navy); isolation:isolate; cursor:var(--sd-control-cursor,pointer);
  -webkit-tap-highlight-color:transparent;
}
.camper-peek > * { pointer-events:none; }
.cp-window,.cp-fold,.cp-fold-shadow { position:absolute; inset:0; }
.cp-window {
  overflow:hidden; background:var(--cream); opacity:0;
  clip-path:polygon(100% 60%,100% 100%,60% 100%);
}
.cp-window::after { content:''; position:absolute; inset:0; border:3px solid var(--cream); }
.camper-photo .camper-peek .cp-window > img.cp-preview-image {
  position:absolute; inset:0; display:block; width:100%; height:100%;
  object-fit:cover; object-position:50% 50%; transform:none; transition:none;
}
.cp-fold-shadow {
  background:#162d273b; filter:blur(3px); transform:translate(3px,5px);
  clip-path:polygon(100% 60%,60% 100%,60% 60%);
}
.cp-fold {
  background:linear-gradient(135deg,#fffbed 20%,#f8f1df 65%,#d8cba7);
  clip-path:polygon(100% 60%,60% 100%,60% 60%);
}
.cp-crease {
  position:absolute; left:60%; bottom:0; width:56.5685%; height:1px;
  background:#95896c85; box-shadow:0 -1px 1px #fffbeebb;
  transform:rotate(-45deg); transform-origin:left center;
}
.cp-cue {
  position:absolute; left:calc(73.3333% - 10px); top:calc(73.3333% - 10px);
  width:20px; height:20px; overflow:visible; fill:none; stroke:currentColor;
  stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round;
}
.cp-cue-tail { opacity:.45; }
.camper-peek[data-ready=true] .cp-window { opacity:1; }
.camper-peek[data-open=true] .cp-window { clip-path:polygon(100% 16%,100% 100%,16% 100%); }
.camper-peek[data-open=true] .cp-fold,.camper-peek[data-open=true] .cp-fold-shadow { clip-path:polygon(100% 16%,16% 100%,16% 16%); }
.camper-peek[data-open=true] .cp-crease { left:16%; width:118.7939%; }
.camper-peek[data-open=true] .cp-cue { left:calc(44% - 10px); top:calc(44% - 10px); }
.camper-peek[data-motion=on] .cp-window,
.camper-peek[data-motion=on] .cp-fold,
.camper-peek[data-motion=on] .cp-fold-shadow { transition:clip-path .64s cubic-bezier(.22,1,.36,1); }
.camper-peek[data-motion=on] .cp-crease { transition:left .64s cubic-bezier(.22,1,.36,1),width .64s cubic-bezier(.22,1,.36,1); }
.camper-peek[data-motion=on] .cp-cue { transition:left .64s cubic-bezier(.22,1,.36,1),top .64s cubic-bezier(.22,1,.36,1); }
.camper-peek[data-motion=on][data-open=true] :is(.cp-window,.cp-fold,.cp-fold-shadow,.cp-crease,.cp-cue) { transition-duration:.36s; }
.camper-peek[data-ready=false] .cp-window { display:none; }
.camper-peek:focus-visible { outline:2px solid var(--cream); outline-offset:-5px; }
@media(max-width:680px) {
  .camper-peek { width:96px; }
  .cp-cue { width:18px; height:18px; }
}
@media(prefers-reduced-motion:reduce) {
  .camper-peek :is(.cp-window,.cp-fold,.cp-fold-shadow,.cp-crease,.cp-cue) { transition:none!important; }
}
@media(forced-colors:active) {
  .camper-peek { width:52px; height:52px; border:1px solid ButtonText; background:ButtonFace; color:ButtonText; }
  .camper-peek :is(.cp-window,.cp-fold,.cp-fold-shadow,.cp-crease) { display:none; }
  .camper-peek[data-open] .cp-cue { inset:0; margin:auto; width:24px; height:24px; transition:none; }
  .camper-peek:focus-visible { outline:2px solid Highlight; outline-offset:-5px; }
}