/* ===== Dhamma Talks player — gold/maroon theme ===== */
#dhamma-talks-app { --dt-maroon: var(--maroon, #6e1f15); --dt-gold: var(--emerald, #c8932a); --dt-gold-d: #8a4e12;
  --dt-ink: var(--ink, #2a2018); --dt-line: rgba(110,31,21,.14); --dt-card:#fff;
  max-width: 960px; margin: 0 auto; font-family: var(--sans,"Inter Tight",system-ui,sans-serif); }
#dhamma-talks-app * { box-sizing: border-box; }

.dt-tools { display:flex; flex-wrap:wrap; gap:.7rem; align-items:center; margin:0 0 1rem; }
.dt-search { position:relative; flex:1 1 260px; display:flex; align-items:center; color:var(--dt-gold-d); }
.dt-search svg { position:absolute; left:14px; opacity:.7; }
.dt-search input { width:100%; padding:.7rem .9rem .7rem 2.6rem; border:1px solid var(--dt-line); border-radius:999px;
  background:#fff; font-size:1rem; color:var(--dt-ink); box-shadow:0 1px 0 rgba(0,0,0,.02) inset; }
.dt-search input:focus { outline:2px solid var(--dt-gold); border-color:transparent; }
.dt-cats { display:flex; flex-wrap:wrap; gap:.4rem; flex:1 1 100%; order:3; }
.dt-chip { border:1px solid var(--dt-line); background:#fbf6ea; color:var(--dt-maroon); border-radius:999px;
  padding:.35rem .8rem; font-size:.86rem; font-weight:600; cursor:pointer; transition:.15s; }
.dt-chip span { opacity:.6; font-weight:500; margin-left:.25rem; }
.dt-chip:hover { border-color:var(--dt-gold); }
.dt-chip[aria-selected="true"] { background:linear-gradient(180deg,#c8932a,#a85f1c); color:#fff; border-color:transparent; }
.dt-count { font-size:.85rem; color:#7a6b58; white-space:nowrap; }

.dt-list { list-style:none; margin:0; padding:0; border:1px solid var(--dt-line); border-radius:16px; overflow:hidden; background:#fff; box-shadow:0 14px 40px -26px rgba(60,24,8,.5); }
.dt-row { display:flex; align-items:center; gap:.85rem; padding:.7rem .9rem; border-bottom:1px solid rgba(110,31,21,.07); cursor:pointer; transition:background .12s; counter-increment:dt; }
.dt-row:last-child { border-bottom:0; }
.dt-row:hover { background:#fbf6ea; }
.dt-row.dt-on { background:linear-gradient(90deg, rgba(200,147,42,.14), rgba(200,147,42,.03)); }
.dt-rowplay { position:relative; flex:0 0 auto; width:38px; height:38px; border:0; border-radius:50%;
  background:#f3e8cf; color:var(--dt-maroon); display:grid; place-items:center; cursor:pointer; transition:.15s; }
.dt-row:hover .dt-rowplay { background:var(--dt-gold); color:#fff; }
.dt-row.dt-on .dt-rowplay svg { display:none; }
.dt-eq { display:none; gap:2px; height:16px; align-items:flex-end; }
.dt-row.dt-on .dt-rowplay { background:var(--dt-maroon); color:#fff; }
.dt-row.dt-on .dt-eq { display:inline-flex; }
.dt-eq i { width:3px; background:#ffd372; height:6px; animation:dt-eq .9s ease-in-out infinite; }
.dt-eq i:nth-child(2){ animation-delay:.3s } .dt-eq i:nth-child(3){ animation-delay:.6s }
html:not(.dt-playing) .dt-eq i { animation-play-state:paused; }
@keyframes dt-eq { 0%,100%{height:5px} 50%{height:15px} }
.dt-rt { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.dt-rtitle { font-weight:600; color:var(--dt-ink); font-size:1.02rem; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dt-rby { font-size:.83rem; color:#7a6b58; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dt-badge { flex:0 0 auto; font-size:.72rem; font-weight:600; color:var(--dt-gold-d); background:rgba(200,147,42,.12);
  border:1px solid rgba(200,147,42,.25); border-radius:999px; padding:.18rem .55rem; }
@media (max-width:560px){ .dt-badge{ display:none } }
.dt-err { color:var(--dt-maroon); text-align:center; padding:2rem; }

/* sticky now-playing bar */
.dt-bar { position:fixed; left:0; right:0; bottom:0; z-index:60; display:grid;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1.4fr); align-items:center; gap:1rem;
  padding:.6rem clamp(.7rem,3vw,1.6rem); background:linear-gradient(180deg,#7d2418,#5e1810);
  color:#ffe9c8; box-shadow:0 -8px 30px -10px rgba(0,0,0,.5); }
body.dt-has-bar { padding-bottom:96px; }
.dt-np { display:flex; align-items:center; gap:.7rem; min-width:0; }
.dt-disc { flex:0 0 auto; width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-size:26px;
  background:radial-gradient(circle at 50% 40%, #ffe19a, #c8932a); color:#5e1810; box-shadow:0 4px 14px rgba(0,0,0,.4); }
.dt-disc.dt-spin { animation:dt-rot 6s linear infinite; }
@keyframes dt-rot { to { transform:rotate(360deg) } }
.dt-meta { min-width:0; }
.dt-title { font-weight:600; font-size:.98rem; color:#fff5df; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dt-by { font-size:.8rem; color:#f0cd8d; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dt-ctrls { display:flex; align-items:center; gap:.3rem; }
.dt-b { border:0; background:transparent; color:#ffe6ad; cursor:pointer; width:40px; height:40px; border-radius:50%;
  display:grid; place-items:center; transition:.15s; text-decoration:none; }
.dt-b:hover { background:rgba(255,220,150,.18); color:#fff; }
.dt-b.dt-act { color:#ffd372; }
.dt-play { background:linear-gradient(180deg,#ffe19a,#e8b24e); color:#5e1810; width:48px; height:48px; }
.dt-play:hover { background:linear-gradient(180deg,#ffe7ad,#efc066); color:#5e1810; }
.dt-seek { display:flex; align-items:center; gap:.55rem; font-size:.78rem; color:#f0cd8d; min-width:0; }
.dt-seek input[type=range] { flex:1 1 auto; min-width:60px; accent-color:#ffd372; height:4px; cursor:pointer; }
.dt-rate { width:auto; padding:0 .5rem; font-weight:700; font-size:.82rem; min-width:42px; }
@media (max-width:760px){
  .dt-bar { grid-template-columns: auto 1fr; grid-template-areas:"np ctrls" "seek seek"; gap:.4rem .8rem; }
  .dt-np{ grid-area:np } .dt-ctrls{ grid-area:ctrls; justify-content:flex-end } .dt-seek{ grid-area:seek }
  .dt-disc{ width:40px;height:40px;font-size:22px }
}
@media (prefers-reduced-motion: reduce){ .dt-disc.dt-spin,.dt-eq i { animation:none } }
