/* Tap a verse to highlight it and listen (lib/listen.js). */
.lv{cursor:pointer;border-radius:8px;-webkit-tap-highlight-color:transparent;transition:background-color .2s,box-shadow .2s}
@media (hover:hover) and (pointer:fine){.lv:hover{background:rgba(212,175,96,.06);box-shadow:0 0 0 6px rgba(212,175,96,.06)}}
.lv:focus{outline:none}
.lv:focus-visible{outline:1px solid var(--gold);outline-offset:6px}
.lv.lv-on,.lv.lv-on:hover{background:rgba(212,175,96,.14);box-shadow:0 0 0 6px rgba(212,175,96,.14)}
.lv.lv-playing,.lv.lv-playing:hover{background:rgba(212,175,96,.2);box-shadow:0 0 0 6px rgba(212,175,96,.2)}
.lv .tw{border-radius:3px;transition:background-color .12s,color .12s}
.lv .tw.on{background:rgba(240,213,140,.42);color:#fffaf0;box-shadow:0 0 0 2px rgba(240,213,140,.42)}
.vl-bar{display:flex;align-items:center;gap:10px;margin:12px 0 6px}
.vl-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 12px;border-radius:999px;cursor:pointer;
  border:1px solid var(--gold);background:rgba(212,175,96,.1);color:var(--gold2);
  font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;-webkit-tap-highlight-color:transparent;
  transition:background-color .2s,color .2s}
.vl-btn svg{width:16px;height:16px;fill:currentColor;flex:none}
.vl-btn:hover{background:rgba(212,175,96,.2)}
.vl-btn:focus-visible{outline:2px solid var(--gold2);outline-offset:3px}
.vl-btn[aria-pressed="true"]{background:var(--gold);color:var(--ink)}
.vl-btn:disabled{opacity:.55;cursor:default;border-style:dashed}
.vl-eq{display:inline-flex;align-items:flex-end;gap:2px;height:12px;margin-left:2px}
.vl-eq b{width:2px;height:100%;background:currentColor;border-radius:1px;transform-origin:bottom;animation:vl-eq 1s ease-in-out infinite}
.vl-eq b:nth-child(2){animation-delay:-.4s}.vl-eq b:nth-child(3){animation-delay:-.7s}
@keyframes vl-eq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.vl-eq b{animation:none;transform:scaleY(.7)}}
/* reader rows are flex; let the button sit on its own line under the verse text */
.chap li.lv-host{flex-wrap:wrap}
.chap li.lv-host>span{flex:1 1 0;min-width:0}
.chap li.lv-host .vl-bar{flex-basis:100%;margin:6px 0 2px 42px}
.chap li>span{flex:1 1 auto;min-width:0}
.quote .vl-bar{margin-left:20px}
.vl-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Listen to chapter (read.html) */
.ch-bar{position:sticky;top:64px;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 18px;padding:10px 0;
  background:#070b14;box-shadow:0 0 0 100vmax #070b14,0 10px 18px -6px rgba(0,0,0,.6);clip-path:inset(0 -100vmax -24px)}
html.has-tkr .ch-bar{top:98px}
.ch-ctl{display:inline-flex;gap:6px}
.ch-ctl[hidden]{display:none}
.ch-ic{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line);background:rgba(212,175,96,.06);color:var(--gold2);-webkit-tap-highlight-color:transparent;transition:background-color .2s}
.ch-ic svg{width:16px;height:16px;fill:currentColor}
.ch-ic:hover{background:rgba(212,175,96,.18)}
.ch-ic:disabled{opacity:.35;cursor:default}
.ch-ic:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.ch-pos{font:600 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.chap li.ch-cur{background:rgba(212,175,96,.08);box-shadow:inset 2px 0 0 var(--gold)}
.chap li.ch-cur>span.lv{background:transparent;box-shadow:none}
/* speed picker + Apple voice tip */
.vl-speed{min-height:40px;min-width:64px;padding:0 26px 0 12px;border-radius:999px;cursor:pointer;-webkit-appearance:none;appearance:none;
  border:1px solid var(--line);color:var(--gold2);font:600 12px/1 var(--sans);letter-spacing:.08em;
  background:rgba(212,175,96,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23d4af60'/%3E%3C/svg%3E") no-repeat right 11px center/9px 6px}
.vl-speed option{color:#111;background:#fff}
.vl-speed:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
.ch-sub2{display:inline-flex;align-items:center;gap:10px}
.vl-tip{display:flex;align-items:flex-start;gap:8px;margin:26px 0 18px;padding:8px 6px 8px 12px;border:1px solid var(--line);border-radius:10px;
  font:13px/1.45 var(--sans);color:var(--muted);background:rgba(212,175,96,.05)}
.vl-tip span{flex:1;min-width:0}
.vl-tip-x{flex:none;width:44px;height:44px;margin:-8px -2px -8px 0;border:0;background:none;color:var(--gold2);font-size:22px;line-height:1;cursor:pointer;border-radius:50%}
.vl-tip-x:focus-visible{outline:2px solid var(--gold2)}
.vl-bar+.vl-tip{margin:4px 0 6px}
@media (pointer:coarse),(max-width:600px){.vl-btn,.vl-speed{min-height:44px}.ch-ic{width:44px;height:44px}}
@media (max-width:600px){.ch-bar{top:56px}html.has-tkr .ch-bar{top:88px}.ch-sub2{flex-basis:100%}}
