/* Existing home carousel places dark copy over a pale left gradient. Its ::before
   layer flips the source art to the right; include the newly-first slide. */
body.nr-home #library .campaign-slide[data-campaign-id="waterfall"],
body.nr-home #library .campaign-slide[data-campaign-id="scores"]{
  background-color:#061b27;
}
body.nr-home #library .campaign-slide[data-campaign-id="waterfall"]::before,
body.nr-home #library .campaign-slide[data-campaign-id="scores"]::before{
  transform:scaleX(-1);
}
body.nr-home #library .campaign-slide[data-campaign-id="waterfall"] .campaign-chip{
  color:#174e69;
}
body.nr-home #library .campaign-slide[data-campaign-id="scores"] .campaign-chip{
  color:#6b5132;
}

/* The third card action shares the player's falling-note visual language. */
body.nr-home #library .card-actions .card-waterfall{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:linear-gradient(115deg,#06121f,#123046 54%,#06121f);
  border:1px solid #28748b;
  color:#effbff;
  box-shadow:inset 0 1px #7cecff55,0 3px 9px #06121f2c;
}
body.nr-home #library .card-waterfall .wf-button-flow{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:repeating-linear-gradient(90deg,transparent 0 12px,#5bb7ce18 12px 13px);
}
body.nr-home #library .card-waterfall .wf-button-flow::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:4px;
  background:repeating-linear-gradient(90deg,#d9f7fb 0 8px,#102332 8px 11px,#c9e7eb 11px 19px,#102332 19px 22px);
  opacity:.6;
}
body.nr-home #library .card-waterfall .wf-button-flow i{
  position:absolute;
  top:-14px;
  width:4px;
  height:11px;
  border-radius:2px;
  background:#11d7e6;
  box-shadow:0 0 5px #11d7e680;
  opacity:0;
  animation:libraryWfFall 2.6s linear infinite;
}
body.nr-home #library .card-waterfall .wf-button-flow i:nth-child(1){left:12%;animation-delay:-.2s}
body.nr-home #library .card-waterfall .wf-button-flow i:nth-child(2){left:29%;animation-delay:-1.4s;background:#f7b544}
body.nr-home #library .card-waterfall .wf-button-flow i:nth-child(3){left:45%;animation-delay:-.9s;height:14px}
body.nr-home #library .card-waterfall .wf-button-flow i:nth-child(4){left:63%;animation-delay:-2s;background:#f7b544}
body.nr-home #library .card-waterfall .wf-button-flow i:nth-child(5){left:82%;animation-delay:-.5s;height:14px}
body.nr-home #library .card-waterfall .wf-button-label{
  position:relative;
  z-index:1;
  display:inline-block;
  color:#effbff;
  font-size:11px;
  text-shadow:0 1px 4px #000,0 0 8px #06121f;
  white-space:nowrap;
}
body.nr-home #library .card-actions .card-waterfall:hover{filter:brightness(1.16)}
body.nr-home #library .card-actions .card-waterfall:focus-visible{outline:3px solid #ffca6b;outline-offset:2px}
body.nr-home.dark #library .card-actions .card-waterfall{color:#effbff}
@keyframes libraryWfFall{
  0%{transform:translateY(0);opacity:0}
  16%,78%{opacity:.7}
  100%{transform:translateY(56px);opacity:0}
}
@media(max-width:600px){
  body.nr-home #library .card-actions{gap:5px}
  body.nr-home #library .card-actions button{font-size:12px}
  body.nr-home #library .card-actions .card-waterfall .wf-button-label{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  body.nr-home #library .card-waterfall .wf-button-flow i{animation:none;opacity:.48;transform:translateY(18px)}
}


/* Waterfall is also available in the card's rotating preview dialog. */
.score-preview-dialog .preview-main-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.score-preview-dialog .preview-main-actions button{min-width:0;font-size:12px;line-height:1.35}
.score-preview-dialog .preview-main-actions #previewWaterfall{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(115deg,#06121f,#123046 54%,#06121f);border:1px solid #28748b;color:#effbff;box-shadow:inset 0 1px #7cecff55,0 3px 9px #06121f2c}
.score-preview-dialog #previewWaterfall .wf-button-flow{position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 12px,#5bb7ce18 12px 13px)}
.score-preview-dialog #previewWaterfall .wf-button-flow::after{content:"";position:absolute;inset:auto 0 0;height:4px;background:repeating-linear-gradient(90deg,#d9f7fb 0 8px,#102332 8px 11px,#c9e7eb 11px 19px,#102332 19px 22px);opacity:.6}
.score-preview-dialog #previewWaterfall .wf-button-flow i{position:absolute;top:-14px;width:4px;height:11px;border-radius:2px;background:#11d7e6;box-shadow:0 0 5px #11d7e680;opacity:0;animation:libraryWfFall 2.6s linear infinite}
.score-preview-dialog #previewWaterfall .wf-button-flow i:nth-child(1){left:12%;animation-delay:-.2s}
.score-preview-dialog #previewWaterfall .wf-button-flow i:nth-child(2){left:29%;animation-delay:-1.4s;background:#f7b544}
.score-preview-dialog #previewWaterfall .wf-button-flow i:nth-child(3){left:45%;animation-delay:-.9s;height:14px}
.score-preview-dialog #previewWaterfall .wf-button-flow i:nth-child(4){left:63%;animation-delay:-2s;background:#f7b544}
.score-preview-dialog #previewWaterfall .wf-button-flow i:nth-child(5){left:82%;animation-delay:-.5s;height:14px}
.score-preview-dialog #previewWaterfall .wf-button-label{position:relative;z-index:1;color:#effbff;font-weight:800;text-shadow:0 1px 4px #000,0 0 8px #06121f;white-space:nowrap}
.score-preview-dialog #previewWaterfall:focus-visible{outline:3px solid #ffca6b;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.card-waterfall .wf-button-flow i,.score-preview-dialog #previewWaterfall .wf-button-flow i{animation:none}}