/* ============================================================
   MYSTERY EXPERIENCE — the reveal scrubber

   Every page explains in words what you're told and when. This
   lets you drag through it: move along the evening and watch the
   redactions lift, one stage at a time.

   Injected by reveal.js. Without JS the placeholder copy stands
   on its own, so nothing is hidden that can't be shown again.
   ============================================================ */

.rv-wrap{
  border:1px solid var(--line-soft);border-radius:var(--r);
  background:linear-gradient(170deg,rgba(26,35,64,.6),rgba(14,20,40,.45));
  overflow:hidden;
}

/* ---------- the scrubber ---------- */
.rv-bar{padding:30px 34px 26px;border-bottom:1px solid var(--line-soft)}
.rv-range{
  width:100%;margin:0 0 4px;accent-color:var(--gold);height:26px;cursor:grab;
  background:transparent;
}
.rv-range:active{cursor:grabbing}
.rv-range:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:8px}

.rv-stages{display:flex;justify-content:space-between;gap:8px}
.rv-stage{
  flex:1 1 0;text-align:left;padding:2px 0;color:var(--slate-text);
  font-size:var(--fs-2xs);letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  transition:color .3s;line-height:1.35;
}
.rv-stage:last-child{text-align:right}
.rv-stage:hover{color:var(--mist)}
.rv-stage[aria-current="true"]{color:var(--gold)}

.rv-now{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding:22px 34px 0;
}
.rv-now h3{font-size:clamp(1.2rem,2.2vw,1.6rem)}
.rv-now .rv-count{
  font-size:var(--fs-2xs);letter-spacing:.16em;text-transform:uppercase;color:var(--slate-text);
  margin-left:auto;
}
.rv-now .rv-count b{color:var(--gold);font-weight:600}
.rv-say{padding:8px 34px 0;color:var(--mist);margin:0;max-width:68ch;font-size:var(--fs-md)}

/* ---------- the facts ---------- */
.rv-facts{list-style:none;margin:0;padding:22px 34px 34px;display:grid;gap:2px}
.rv-fact{
  display:grid;grid-template-columns:26px 1fr;gap:15px;align-items:center;
  padding:11px 0;border-bottom:1px solid rgba(155,163,188,.09);
}
.rv-fact:last-child{border-bottom:0}
.rv-fact .kh{
  width:22px;height:22px;color:var(--slate-text);
  transition:color .45s var(--ease),transform .55s var(--ease);
}
.rv-fact.open .kh{color:var(--gold);transform:rotate(90deg)}

.rv-fact .ft{
  color:var(--mist);font-size:var(--fs-sm);
  filter:blur(5px);opacity:.42;
  transition:filter .55s var(--ease),opacity .55s var(--ease),color .55s var(--ease);
  user-select:none;
}
.rv-fact.open .ft{filter:none;opacity:1;color:var(--cream);user-select:auto}

.rv-fact .fs{
  font-size:var(--fs-2xs);letter-spacing:.14em;text-transform:uppercase;color:var(--slate-text);
  grid-column:2;margin-top:2px;
}
.rv-fact.open .fs{display:none}

/* the moment a fact opens, gold passes through it */
.rv-fact.just .ft{animation:rvpass .9s var(--ease) both}
@keyframes rvpass{
  0%{color:var(--gold);text-shadow:0 0 16px rgba(232,163,61,.7)}
  100%{color:var(--cream);text-shadow:none}
}

/* ---------- responsive ---------- */
@media (max-width:760px){
  .rv-bar{padding:24px 20px 20px}
  .rv-now{padding:18px 20px 0}
  .rv-say{padding:8px 20px 0;font-size:.95rem}
  .rv-facts{padding:18px 20px 26px}
  .rv-stage{font-size:.6rem;letter-spacing:.08em}
  .rv-now .rv-count{margin-left:0;width:100%}
}

/* ---------- reduced motion: no sweep, no blur transition ---------- */
@media (prefers-reduced-motion:reduce){
  .rv-fact .kh,.rv-fact .ft{transition:none}
  .rv-fact.just .ft{animation:none}
}
