/* === record.srvo.io — shared custom audio player styles === */
/* Extracted verbatim from index.html so the recorder result view AND the
   shared cloud play page (play.html) render the SAME player. Depends on the
   CSS tokens (:root --accent / --night / --line / --glow / --muted / --ink)
   defined by the host page. @see /vendor/player.js */
.player { display:flex; align-items:center; gap:10px; }
.player .pp { flex-shrink:0; width:38px; height:38px; border-radius:50%; border:none;
  background:var(--accent); color:var(--night); font-size:0.95rem; cursor:pointer; display:grid; place-items:center; }
.player .ptrack { position:relative; flex:1; height:8px; border-radius:999px; background:var(--line); cursor:pointer; }
.player .pfill { position:absolute; left:0; top:0; height:100%; width:0%; border-radius:999px;
  background:linear-gradient(90deg,var(--accent),var(--glow)); pointer-events:none; }
.player .ptime { flex-shrink:0; font-size:.72rem; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.player .pvol { position:relative; flex-shrink:0; }
.player .pvbtn { border:none; background:transparent; color:var(--ink); font-size:1rem; cursor:pointer; padding:4px; line-height:1; }
.player .pvpop { position:absolute; bottom:130%; right:-2px; background:var(--night);
  border:1px solid var(--line); border-radius:10px; padding:12px 10px; box-shadow:0 8px 24px -8px rgba(0,0,0,.6); z-index:5; }
.player .pvsl { writing-mode:vertical-lr; direction:rtl; width:22px; height:88px; accent-color:var(--accent); }
.player audio { display:none; }
