

html{ overflow-y:scroll; }

html.lenis.lenis-stopped:not(.lenis-autoToggle){
  overflow-x:clip; overflow-y:scroll;
}
html.pl-on body{ overflow:hidden; }

.pl{
  position:fixed; z-index:9999;
  left:var(--pl-px,-6vw); top:calc(var(--pl-py,106vh) - var(--pl-side,260vmax));
  width:var(--pl-side,260vmax); height:var(--pl-side,260vmax);
  
  background:var(--pl-bg,var(--paper,#F9F8F5));
  color:var(--pl-fg,var(--ink,#042839));
  overflow:hidden;                    
  transform-origin:0 100%;            
  transform:rotate(0deg);
  will-change:transform;
}
html.pl-out .pl{
  transition:transform calc(var(--pl-wipe,1450ms) * var(--pl-k,1)) var(--ease-draw,cubic-bezier(.25,.1,0,1));
  transform:rotate(var(--pl-swing,96deg));
}

.pl-in{
  position:absolute; inset:0;
  transform-origin:0 100%;
  transform:rotate(0deg);
}
html.pl-out .pl-in{
  transition:transform calc(var(--pl-wipe,1450ms) * var(--pl-k,1)) var(--ease-draw,cubic-bezier(.25,.1,0,1));
  transform:rotate(calc(var(--pl-swing,96deg) * -1));
}

.pl-cluster{
  position:absolute;
  left:calc(50vw - var(--pl-px,-6vw));
  top:calc(50vh - var(--pl-py,106vh) + var(--pl-side,260vmax));
  transform:translate(-50%,-50%);
  text-align:center;
  font-family:var(--sans,"Helvetica Neue",Arial,sans-serif);
}

.pl-count{ display:flex; gap:var(--pl-gap,3px); justify-content:center;
  margin-bottom:10px; overflow-x:clip; overflow-y:visible; }
.pl-count i{
  display:block; width:var(--pl-sq,15px); height:var(--pl-sq,15px);
  background:currentColor;
  opacity:0; transform:rotate(-90deg);
  transform-origin:0 100%;
  transition:transform calc(var(--pl-roll,500ms) * var(--pl-k,1)) var(--ease-enter,cubic-bezier(.22,1,.36,1)),
             opacity 0s;
}
.pl-count i.on{ opacity:1; transform:rotate(0deg); }

.pl-count.spent i{ opacity:0;
  transition:opacity calc(var(--pl-fade,560ms) * var(--pl-k,1)) var(--ease-enter,cubic-bezier(.22,1,.36,1));
  transition-delay:calc(var(--pl-fade-step,70ms) * var(--pl-i,0) * var(--pl-k,1)); }

.pl-cap{
  margin:0; font-size:13px; line-height:1; letter-spacing:.01em;
}

@media (prefers-reduced-motion:reduce){
  .pl{ display:none; }
  .pl-count i{ transform:none; transition:none; }
}

@media print{ .pl{ display:none; } }
