.peek{--dir:1;z-index:0;pointer-events:none;position:absolute}.peek.is-flip{--dir:-1}.peek-v{background:var(--shade,none) var(--shade-at,0 0) / var(--shade-size,auto) no-repeat, var(--paint,var(--paper));position:absolute;inset:0;overflow:hidden}.peek-v video,.peek-v img{object-fit:cover;mix-blend-mode:multiply;width:100%;height:100%;translate:calc((var(--hide) - 1) * 100% * var(--dir)) 0;transition:translate .6s cubic-bezier(.25,1.25,.45,1);display:block}.peek.is-flip .peek-v video,.peek.is-flip .peek-v img{scale:-1 1}.peek:not(.is-out) .peek-v video{transition-duration:.4s;transition-timing-function:cubic-bezier(.5,0,.9,.5)}.peek.is-out .peek-v video,.peek-v img{translate:0}.peek-note{left:calc(var(--hide) * 100% + 10px);top:var(--aim);max-width:calc((1 - var(--hide)) * 100% + 8px);text-wrap:balance;transform-origin:0;font-size:clamp(19px, calc(var(--w) * .1px), 26px);line-height:1;transition:scale .28s cubic-bezier(.3,1.7,.5,1);position:absolute;translate:0 -50%;rotate:-4deg;scale:0}.peek-note:before{content:"← "}.peek.is-flip .peek-note{left:auto;right:calc(var(--hide) * 100% + 10px);transform-origin:100%;text-align:right;rotate:4deg}.peek.is-flip .peek-note:before{content:none}.peek.is-flip .peek-note:after{content:" →"}.peek.is-note .peek-note,.peek.is-still .peek-note{scale:1}.peek.is-note .peek-note{transition-delay:.3s}html.peek-in .dock{transition:transform .45s var(--ease);transform:translateY(140%)}
