/* ============================================================
   FLOATING BOOK BUTTON
   Bottom-left, sitewide. Collapsed to the cover; expands to the
   title on hover. Kept clear of the numbered rail on the right.
   ============================================================ */
.nz-float{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:65;
  display:flex;
  align-items:center;
  opacity:0;
  transform:translateX(120%);
  transition:opacity .5s ease, transform .6s cubic-bezier(.2,.7,.3,1);
}
.nz-float.is-in{opacity:1;transform:translateX(0)}

.nz-float__link{
  position:relative;
  display:flex;
  flex-direction:row-reverse;   /* cover on the right, label opens left */
  align-items:center;
  gap:0;
  padding:8px;
  border-radius:999px;
  border:1px solid rgba(231,197,124,.42);
  background:rgba(20,17,16,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 12px 30px rgba(0,0,0,.55);
  text-decoration:none;
  transition:border-color .4s, box-shadow .4s;
}
.nz-float:hover .nz-float__link,
.nz-float.is-open .nz-float__link{
  border-color:rgba(231,197,124,.8);
  box-shadow:0 14px 36px rgba(0,0,0,.6), 0 0 0 1px rgba(231,197,124,.18);
}

/* the pulse ring, drawing the eye without moving the button */
.nz-float__pulse{
  position:absolute;right:8px;top:8px;
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(231,197,124,.6);
  animation:nzFloatPulse 2.6s ease-out infinite;
  pointer-events:none;
}
@keyframes nzFloatPulse{
  0%{transform:scale(1);opacity:.7}
  70%{transform:scale(1.55);opacity:0}
  100%{transform:scale(1.55);opacity:0}
}
.nz-float.is-open .nz-float__pulse{animation:none;opacity:0}

/* cover thumbnail */
.nz-float__cover{
  position:relative;
  flex:0 0 auto;
  width:44px;height:44px;
  border-radius:50%;
  overflow:hidden;
  border:1px solid rgba(231,197,124,.3);
}
.nz-float__cover img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:50% 22%;
  display:block;
}

/* the label, revealed by animating max-width */
.nz-float__text{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-end;
  text-align:right;
  overflow:hidden;
  max-width:0;
  white-space:nowrap;
  transition:max-width .55s cubic-bezier(.2,.7,.3,1), padding .4s;
  padding:0;
}
.nz-float:hover .nz-float__text,
.nz-float.is-open .nz-float__text{
  max-width:190px;
  padding:0 .75rem 0 .95rem;
}
.nz-float__text b{
  font-family:var(--display,"Anton",sans-serif);
  font-weight:400;
  text-transform:uppercase;
  font-size:.92rem;
  line-height:1.05;
  color:var(--cream,#F3EDE4);
  letter-spacing:.01em;
}
.nz-float__text i{
  font-style:normal;
  font-size:.52rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--champ,#E7C57C);
  margin-top:3px;
}

/* dismiss */
.nz-float__x{
  position:absolute;
  top:-6px;right:-6px;
  width:20px;height:20px;
  display:grid;place-items:center;
  border:1px solid rgba(243,237,228,.18);
  border-radius:50%;
  background:#141110;
  color:var(--mute,#9C9187);
  font-size:.8rem;
  line-height:1;
  cursor:pointer;
  opacity:0;
  transition:opacity .3s, color .3s, border-color .3s;
  padding:0;
}
.nz-float:hover .nz-float__x,
.nz-float.is-open .nz-float__x{opacity:1}
.nz-float__x:hover{color:var(--cream,#F3EDE4);border-color:rgba(231,197,124,.5)}

/* clear of the disclaimer band and thumb reach on small screens */
@media (max-width:767px){
  .nz-float{right:12px;bottom:12px}
  .nz-float__cover{width:40px;height:40px}
  .nz-float__pulse{width:40px;height:40px}
  .nz-float.is-open .nz-float__text{max-width:150px}
  .nz-float__text b{font-size:.82rem}
}

@media (prefers-reduced-motion:reduce){
  .nz-float{transition:opacity .3s}
  .nz-float.is-in{transform:none}
  .nz-float__pulse{animation:none;opacity:0}
  .nz-float__text{transition:none}
}

@media print{ .nz-float{display:none} }

/* On wide screens the numbered step rail also occupies the right
   edge, so the float sits a little lower and tighter in to keep
   clear of the step rail. */
@media (min-width:1024px){
  .nz-float{right:14px;bottom:14px}
}