/* ============================================================
   MASTER VORTEX — Bar Replay (replay.js)
   Top-bar button, on-chart REPLAY badge, picker + playback bar,
   and the dashboard's paused treatment.
   ============================================================ */

.replay-btn{
  display:inline-flex; align-items:center; gap:7px;
  background:#101823; color:#dfe9f5; border:1px solid #1d2c42; border-radius:8px;
  font-size:13.5px; font-weight:400; letter-spacing:.6px; padding:9px 14px;
  cursor:pointer; font-family:inherit; white-space:nowrap;
}
.replay-btn:hover{border-color:rgba(30,227,8,.5); color:#fff;}
.replay-btn.active{background:#CDAA19; color:#1a1402; border-color:#CDAA19;
  box-shadow:0 0 14px rgba(205,170,25,.45);}
.replay-btn.active svg path{stroke:#1a1402;}

.replay-badge{
  position:absolute; top:10px; left:50%; transform:translateX(-50%);
  z-index:30; pointer-events:none;
  display:flex; align-items:center; gap:7px;
  font-size:11px; font-weight:400; letter-spacing:2.2px; color:#ffd84d;
  background:rgba(10,16,28,.82); border:1px solid rgba(255,216,77,.55);
  border-radius:20px; padding:5px 14px 5px 11px;
}
.replay-badge .dot{
  width:8px; height:8px; border-radius:50%; background:#ff3b47;
  box-shadow:0 0 8px rgba(255,59,71,.9);
  animation:replayPulse 1.2s ease-in-out infinite;
}
@keyframes replayPulse{0%,100%{opacity:1;}50%{opacity:.35;}}
.replay-badge[hidden]{display:none;}

.replay-bar{
  position:absolute; left:50%; bottom:12px; transform:translateX(-50%);
  z-index:30; max-width:calc(100% - 24px);
  background:rgba(8,13,24,.94); border:1px solid rgba(255,216,77,.4);
  border-radius:10px; box-shadow:0 14px 40px rgba(0,0,0,.7);
  padding:8px 12px; color:#dfe9f5;
}
.replay-bar[hidden]{display:none;}

.replay-picker, .replay-controls{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap; justify-content:center;
}
.replay-picker[hidden], .replay-controls[hidden]{display:none;}

.rp-label, .rc-readout{
  font-size:11px; font-weight:400; letter-spacing:1.2px; color:#ffd84d; white-space:nowrap;
}
.rc-readout{color:#dfe9f5; letter-spacing:.4px; font-weight:400;}
.replay-picker input[type="datetime-local"]{
  background:#0d1626; color:#dfe9f5; border:1px solid #1d2c42; border-radius:6px;
  font-family:inherit; font-size:12.5px; padding:6px 8px; color-scheme:dark;
}
.rp-hint{font-size:11.5px; color:#8fa8c4; white-space:nowrap;}
.rp-note{flex-basis:100%; text-align:center; font-size:11px; color:#8fa8c4;}
.rp-go, .rc-exit{
  background:#CDAA19; color:#1a1402; border:1px solid #CDAA19; border-radius:7px;
  font-family:inherit; font-size:12.5px; font-weight:400; padding:6px 12px; cursor:pointer; white-space:nowrap;
}
.rp-go:disabled{opacity:.4; cursor:default;}
.rp-cancel, .rc-btn, .rc-speed{
  background:#101823; color:#dfe9f5; border:1px solid #1d2c42; border-radius:7px;
  font-family:inherit; font-size:12.5px; font-weight:400; padding:6px 10px; cursor:pointer; white-space:nowrap;
}
.rp-cancel:hover, .rc-btn:hover, .rc-speed:hover{border-color:rgba(30,227,8,.5);}
.rc-btn:disabled{opacity:.35; cursor:default;}
.rc-btn{font-size:14px; line-height:1; padding:7px 11px;}
.rc-play{min-width:44px;}
.rc-speeds{display:inline-flex; gap:4px;}
.rc-speed.on{background:#1ee308; color:#03140a; border-color:#1ee308;}
.rc-note{font-size:10.5px; color:#8fa8c4; letter-spacing:.6px; white-space:nowrap;}
.rc-exit:hover{background:#ffd84d;}

/* Dashboard paused treatment: values stay visible but clearly
   frozen/dimmed behind the REPLAY banner + note — never updated,
   never presented as live. */
.dock.mv-replay .dash-scroll table{opacity:.32; filter:saturate(.35);}
.replay-dash-note{
  margin:8px 10px 0; padding:8px 10px;
  font-size:11px; font-weight:400; line-height:1.45; color:#ffd84d;
  background:rgba(205,170,25,.12); border:1px solid rgba(255,216,77,.5); border-radius:8px;
}
.replay-dash-note[hidden]{display:none;}
/* Engine replay (v2): the dashboard is LIVE historical state, not
   frozen — green accent instead of the paused amber, no dimming. */
.replay-dash-note.engine{
  color:#8dff6a; background:rgba(30,227,8,.08); border-color:rgba(30,227,8,.45);
}

@media (max-width: 900px){
  .replay-bar{bottom:8px; padding:7px 8px;}
  .rc-note{display:none;}
  .rp-hint{display:none;}
}