/* Helix audio reader — read-along word highlight + seekable player bar */
.rw{ transition:color .18s ease; }
.rw.said{ color:var(--ink); }
.rw.now{ color:#fff; position:relative; }
.rw.now::after{ content:""; position:absolute; left:-.04em; right:-.04em; bottom:-.12em; height:2px; border-radius:2px;
  background:linear-gradient(90deg,#7e94a6,#eef4f8 50%,#7e94a6); box-shadow:0 0 9px rgba(190,210,228,.55); }
.lead .rw.now{ -webkit-text-fill-color:#fff; }

.hxreader{ position:fixed; left:50%; bottom:16px; transform:translateX(-50%) translateY(170%); z-index:130;
  width:min(720px,calc(100vw - 24px)); display:flex; align-items:center; gap:11px; padding:10px 13px; border-radius:18px;
  color:var(--ink); background:rgba(11,11,13,.74); -webkit-backdrop-filter:blur(24px) saturate(1.35); backdrop-filter:blur(24px) saturate(1.35);
  border:1px solid rgba(138,160,178,.32); box-shadow:0 18px 54px rgba(0,0,0,.6),inset 0 1px rgba(236,242,248,.06);
  transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .4s; opacity:0; font-family:Normal,Arial,sans-serif; }
.hxreader.on{ transform:translateX(-50%) translateY(0); opacity:1; }
/* focus mode: the player bar owns the bottom — tuck the Contents pill away */
body.hxreading #toc{ opacity:0 !important; pointer-events:none !important; transform:translateY(22px) !important; }
.hxr-pp{ flex:none; width:42px; height:42px; border-radius:50%; border:0; cursor:pointer; padding:0; display:grid; place-items:center;
  background:radial-gradient(130% 130% at 33% 24%,#3b4651,#0b0d10 78%); box-shadow:0 0 0 1px rgba(138,160,178,.5),inset 0 1px 1px rgba(236,242,248,.2),inset 0 -2px 4px rgba(0,0,0,.55); }
.hxr-pp svg{ width:16px; height:16px; fill:url(#chrome); }
.hxr-pp .pz{ display:none; } .hxreader.playing .hxr-pp .pl{ display:none; } .hxreader.playing .hxr-pp .pz{ display:block; }
.hxr-skip{ flex:none; width:34px; height:34px; border:0; background:none; cursor:pointer; color:var(--ink-dim); display:grid; place-items:center; position:relative; border-radius:50%; transition:color .25s,background .25s; }
.hxr-skip:hover{ color:var(--ink); background:rgba(138,160,178,.12); }
.hxr-skip svg{ width:21px; height:21px; fill:currentColor; }
.hxr-skip b{ position:absolute; bottom:8px; left:0; right:0; text-align:center; font-size:7px; font-weight:600; letter-spacing:0; pointer-events:none; }
.hxr-mid{ flex:1; display:flex; flex-direction:column; gap:6px; min-width:0; }
.hxr-meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-faint); }
.hxr-meta b{ color:var(--slate-lift); font-weight:400; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hxr-meta .t{ white-space:nowrap; font-variant-numeric:tabular-nums; }
.hxr-track{ position:relative; height:6px; border-radius:6px; background:rgba(138,160,178,.22); cursor:pointer; touch-action:none; }
.hxr-track::before{ content:""; position:absolute; inset:-7px 0; }      /* fat touch/click target */
.hxr-fill{ position:absolute; left:0; top:0; bottom:0; width:0; border-radius:6px; background:linear-gradient(90deg,#6f7f8e,#dfe9f2,#8aa0b2); pointer-events:none; }
.hxr-thumb{ position:absolute; top:50%; left:0; width:14px; height:14px; border-radius:50%; transform:translate(-50%,-50%); background:#eef4f8;
  box-shadow:0 0 0 1px rgba(13,12,13,.75),0 2px 7px rgba(0,0,0,.6); pointer-events:none; transition:transform .12s; }
.hxr-track:hover .hxr-thumb,.hxreader.seeking .hxr-thumb{ transform:translate(-50%,-50%) scale(1.18); }
.hxr-x{ flex:none; width:30px; height:30px; border:0; background:none; cursor:pointer; color:var(--ink-faint); font-size:18px; line-height:1; border-radius:50%; transition:color .25s,background .25s; }
.hxr-x:hover{ color:var(--ink); background:rgba(138,160,178,.12); }
@media (max-width:560px){
  .hxreader{ left:8px; right:8px; bottom:8px; width:auto; transform:translateY(170%); gap:8px; padding:9px 9px 11px; border-radius:16px; }
  .hxreader.on{ transform:translateY(0); }
  .hxr-pp{ width:40px; height:40px; }
  .hxr-skip{ width:30px; height:30px; } .hxr-skip svg{ width:19px; height:19px; }
  .hxr-track{ height:7px; }                 /* easier to grab/scrub on touch */
  .hxr-thumb{ width:16px; height:16px; }
}
@media (prefers-reduced-motion:reduce){ .hxreader{ transition:opacity .3s; } .rw{ transition:none; } }