/* Cards */
.dmg-grid{display:flex;flex-wrap:wrap;gap:25px;justify-content:center}
.dmg-card{background:linear-gradient(135deg,#2b2722,#3a3028);border-radius:12px;overflow:hidden;width:270px;cursor:pointer;transition:all .3s ease;border:1px solid rgba(245,220,185,.15)}
.dmg-card:hover{transform:translateY(-6px);box-shadow:0 0 25px rgba(245,220,185,.18);border-color:rgba(245,220,185,.35)}
.dmg-thumb{height:160px;display:flex;align-items:center;justify-content:center;color:#e6cfab;position:relative;background-size:cover;background-position:center}
.dmg-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.25) 100%)}
.dmg-play{width:64px;height:64px;position:relative;z-index:2;filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}
.dmg-info{background:#0d0c0b;padding:16px;color:#f2e4ce;text-align:left}
.dmg-info h3{margin:0 0 8px;font-size:18px;line-height:1.2;color:#f3e7d1;font-weight:700}
.dmg-tag{display:inline-block;font-size:12px;color:#c5b59a;background:rgba(255,255,255,.08);padding:4px 10px;border-radius:10px}

/* Tabs */
.dm-tabs{max-width:1200px;margin:0 auto}
.dm-tabs-nav{display:flex;gap:10px;justify-content:center;margin-bottom:16px}
.dm-tab-btn{background:#1d1815;border:1px solid rgba(245,220,185,.25);color:#f3e7d1;border-radius:999px;padding:8px 14px;cursor:pointer;transition:.25s}
.dm-tab-btn.active,.dm-tab-btn:hover{background:#2a231f}
.dm-tabs-panels{position:relative;overflow:hidden}
.dm-tab-panel{display:none;animation: dmSlideIn .35s ease both}
.dm-tab-panel.active{display:block}
@keyframes dmSlideIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}

/* Player dock left */
.dm-player{
  position:fixed; left:25px; bottom:25px; transform:translateY(200%);
  width:760px; background:rgba(18,15,13,.95);
  border:1px solid rgba(245,220,185,.25); border-radius:16px;
  box-shadow:0 6px 30px rgba(0,0,0,.45);
  color:#f3e7d1; z-index:9999; transition:transform .35s ease, opacity .35s ease; overflow:hidden;
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.dm-player.active{ transform:translateY(0); opacity:1; animation: dmFadeUp .45s ease both }
@keyframes dmFadeUp{0%{transform:translateY(20px);opacity:0}100%{transform:translateY(0);opacity:1}}

.dm-inner{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px; gap:16px }
.dm-left{ display:flex; gap:14px; align-items:center; flex:1; min-width:0 }
.dm-controls-inline{ display:flex; gap:10px; align-items:center }
.dm-icon{ width:38px; height:38px; border-radius:50%; background:#1e1815; border:1px solid rgba(245,220,185,.25); color:#f3e7d1; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:box-shadow .2s, background .2s }
.dm-icon:hover{ box-shadow:0 0 0 3px rgba(245,220,185,.15) }
.dm-play{ width:46px; height:46px; border:none; background:transparent }
.dm-play .dm-ico-pause{ display:none }
.dm-play.is-playing .dm-ico-play{ display:none }
.dm-play.is-playing .dm-ico-pause{ display:block }

.dm-info{ min-width:0 }
.dm-playing{ margin:0 0 4px; font-size:12px; color:#d3c4a8 }
.dm-info h4{ margin:0; font-size:16px; font-weight:700; color:#f6e9cc; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }

.dm-mini{ flex-shrink:0 }
.dm-mini-wrap{ width:260px; height:146px; border-radius:12px; overflow:hidden; background:#1e1815; box-shadow:0 4px 18px rgba(0,0,0,.35) }
.dm-mini-wrap iframe{ width:100%; height:100%; border:0; display:block }

@media(max-width:980px){
  .dm-player{ width:calc(100% - 50px); left:25px; }
  .dm-mini-wrap{ width:200px; height:112px }
}

/* Consent */
.dm-consent{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:10001;
  background:rgba(0,0,0,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px) }
.dm-consent.active{ display:flex; animation: dmFadeUp .8s ease both }
.dm-consent-inner{ background:rgba(18,15,13,.96); border:1px solid rgba(245,220,185,.35); border-radius:14px; padding:24px 26px; color:#f3e7d1; text-align:center; width: min(92%, 520px); box-shadow:0 10px 40px rgba(0,0,0,.45) }
.dm-consent-inner h3{ margin:0 0 8px; font-size:20px; color:#f6e9cc }
.dm-consent-inner p{ margin:0 0 18px; color:#d3c4a8 }
.dm-consent-actions{ display:flex; gap:10px; justify-content:center }
.dm-btn{ background:#1d1815; border:1px solid rgba(245,220,185,.35); color:#f3e7d1; border-radius:10px; padding:8px 12px; cursor:pointer }
.dm-yes{ border-color: rgba(245,220,185,.6) }
.dm-no{ opacity:.85 }
