/* Shared UECF media player + track list (sourced from zion.htm) */
:root{
  --dock-h:0px;
  --muted:#9a9280;
  --card:#FFFFFF;
  --shadow:0 2px 10px rgba(0,0,0,.04);
}
body{padding-bottom:var(--dock-h);}
ol.tracks,ul.tracks{margin:0;padding:0;list-style:none;}

.btn-playall{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--cream,#FAF6EC);border:0;border-radius:6px;padding:9px 18px;font-size:.85rem;font-weight:700;margin-bottom:12px;}
.btn-playall:hover{background:var(--maroon);color:#fff;}
.btn-playall svg{width:13px;height:13px;fill:var(--gold-soft);}

/* Tracks */
li.track{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:6px;border-bottom:1px solid var(--cream-dim,#F0E7D5);}
li.track:last-child{border-bottom:0;}
li.track:hover{background:var(--cream,#FAF6EC);}
.t-num{flex:none;width:30px;height:18px;display:flex;align-items:flex-end;justify-content:center;gap:2px;font-variant-numeric:tabular-nums;font-size:.82rem;color:var(--muted);font-weight:600;}
.t-num::before{content:attr(data-n);}
.t-num i{display:none;width:3px;background:var(--maroon);border-radius:1px;}
.t-link{flex:1;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;color:var(--ink);font-weight:500;font-size:.97rem;padding:2px 0;min-width:0;}
.t-link:hover{color:var(--maroon);text-decoration:none;}
.t-native{font-family:var(--font-te);font-size:.9rem;color:var(--ink-soft);opacity:.9;}
.t-meta{flex-basis:100%;font-size:.76rem;color:var(--muted);font-weight:600;letter-spacing:.02em;}
.t-save{flex:none;opacity:0;color:var(--ink-soft);padding:6px;border-radius:4px;transition:opacity .18s ease,color .18s ease;}
.t-save svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block;}
li.track:hover .t-save,.t-save:focus-visible{opacity:1;}
.t-save:hover{color:var(--maroon);}
@media (hover:none){.t-save{opacity:1;}}

li.track.is-playing{background:var(--cream-dim,#F0E7D5);}
li.track.is-playing .t-link{color:var(--maroon);font-weight:700;}
li.track.is-playing .t-num::before{content:none;}
li.track.is-playing .t-num i{display:block;height:5px;}
li.track.is-playing .t-num i:nth-child(1){animation:eq .9s ease-in-out infinite;}
li.track.is-playing .t-num i:nth-child(2){animation:eq .9s ease-in-out infinite .25s;}
li.track.is-playing .t-num i:nth-child(3){animation:eq .9s ease-in-out infinite .5s;}
li.track.is-playing.is-paused .t-num i{animation-play-state:paused;}
@keyframes eq{0%,100%{height:4px;}50%{height:15px;}}

li.track.hide,details.album.hide{display:none;}
mark{background:rgba(199,154,61,.38);color:inherit;border-radius:2px;padding:0 1px;}

/* Player dock */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:120;background:#101B31;color:#FAF6EC;border-top:3px solid var(--gold);box-shadow:0 -6px 28px rgba(0,0,0,.3);transform:translateY(110%);transition:transform .32s cubic-bezier(.4,0,.2,1);visibility:hidden;}
.dock.up{transform:translateY(0);visibility:visible;}
.dock-seek{position:relative;height:6px;background:rgba(228,198,133,.18);cursor:pointer;}
.dock-seek-buf{position:absolute;inset:0 auto 0 0;width:0;background:rgba(228,198,133,.22);}
.dock-seek-fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--gold);}
.dock-seek input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;}
.dock-inner{max-width:var(--max,1200px);margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:16px;}
.dock-now{flex:1;min-width:0;}
.dock-title{font-weight:700;font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dock-title .t-native{font-family:var(--font-te);color:var(--gold-soft);margin-left:8px;font-size:.88rem;}
.dock-album{font-size:.76rem;color:#9FAAC0;text-transform:uppercase;letter-spacing:.07em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dock-controls{display:flex;align-items:center;gap:4px;flex:none;}
.dock button{background:none;border:0;color:#FAF6EC;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.dock button:hover{background:rgba(228,198,133,.15);color:var(--gold-soft);}
.dock button svg{width:19px;height:19px;fill:currentColor;}
.dock .main{background:var(--gold);color:#101B31;width:50px;height:50px;}
.dock .main:hover{background:var(--gold-soft);color:#101B31;}
.dock .main svg{width:22px;height:22px;}
.dock .toggle[aria-pressed="true"]{color:var(--gold);}
.repeat-one{position:relative;}
.dock-time{font-size:.8rem;color:#9FAAC0;font-variant-numeric:tabular-nums;flex:none;}
.dock-vol{display:flex;align-items:center;gap:6px;flex:none;}
.dock-vol input{-webkit-appearance:none;appearance:none;width:72px;height:4px;border-radius:2px;background:rgba(228,198,133,.25);outline:none;}
.dock-vol input::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:var(--gold);cursor:pointer;}
.dock-vol input::-moz-range-thumb{width:13px;height:13px;border:0;border-radius:50%;background:var(--gold);cursor:pointer;}
.dock-error{display:none;padding:0 24px 10px;font-size:.83rem;color:#F0B9A0;}
.dock.has-error .dock-error{display:block;}
@media (max-width:860px){
  .dock-vol,.dock-time,.dock-extra{display:none;}
  .dock-inner{padding:8px 12px;gap:8px;}
  .dock button{width:36px;height:36px;}
  .dock .main{width:44px;height:44px;}
}
.back-to-top{bottom:calc(var(--dock-h) + 20px);}
@media print{
  .dock,.t-save,.btn-playall{display:none !important;}
}
