.artplayer-app{position:relative;overflow:hidden}

/* Ad label */
.tpcc-ad-label{
  position:absolute;
  z-index:2147483000;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:14px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-family:tahoma, sans-serif;
  font-size:14px;
  letter-spacing:0.2px;
  opacity:0;
  transform:translateY(-50%) scale(.98);
  pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.tpcc-ad-label.is-visible{
  opacity:1;
  transform:translateY(-50%) scale(1);
}
.tpcc-ad-dot{
  width:10px;height:10px;border-radius:50%;
  background:rgba(34,197,94,.9);
  box-shadow:0 0 0 6px rgba(34,197,94,.18);
  animation:tpccPulse 1.2s infinite ease-in-out;
}
@keyframes tpccPulse { 0%{transform:scale(.9)} 50%{transform:scale(1.2)} 100%{transform:scale(.9)} }

/* Brand logo + overlays */
.tpcc-brand-logo,
.tpcc-overlay{
  position:absolute;
  z-index:2147482500;
  display:none;
  text-decoration:none;
}
.tpcc-brand-logo.is-on,
.tpcc-overlay.is-on{display:block}

.tpcc-brand-logo img,
.tpcc-overlay img{
  display:block;
  width:100%;
  height:auto;
  border-radius:12px;
}

/* Watermark */
.tpcc-watermark{
  position:absolute;
  z-index:2147482000;
  color:#fff;
  font-family:tahoma, sans-serif;
  pointer-events:none;
  text-shadow:0 2px 10px rgba(0,0,0,.55);
  white-space:nowrap;
  user-select:none;
  mix-blend-mode:screen;
}

/* Subtitle styling via player classes */
.tpcc-sub-sm .art-subtitle{font-size:14px !important}
.tpcc-sub-md .art-subtitle{font-size:18px !important}
.tpcc-sub-lg .art-subtitle{font-size:22px !important}
.tpcc-sub-bg .art-subtitle{background:rgba(0,0,0,.45) !important; padding:6px 10px !important; border-radius:12px !important}
.tpcc-sub-off .art-subtitle{display:none !important}

/* Resume modal */
.tpcc-resume-modal{
  position:absolute;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:2147483500;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(6px);
}
.tpcc-resume-modal.is-visible{display:flex}
.tpcc-resume-card{
  max-width:420px;
  width:calc(100% - 36px);
  background:rgba(20,20,20,.85);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:16px 16px 14px;
  color:#fff;
  font-family:tahoma, sans-serif;
}
.tpcc-resume-title{font-size:15px;font-weight:700;margin:0 0 6px}
.tpcc-resume-sub{font-size:13px;opacity:.9;line-height:1.75;margin:0 0 12px}
.tpcc-resume-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.tpcc-btn{
  border:none;
  cursor:pointer;
  padding:10px 12px;
  border-radius:14px;
  font-size:13px;
  font-family:tahoma, sans-serif;
}
.tpcc-btn-primary{background:rgba(34,197,94,.9);color:#06130a}
.tpcc-btn-ghost{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.14)}

/* Video ad skip button (non-VAST) */
.tpcc-ad-skip{
  position:absolute;
  z-index:2147483100;
  right:14px;
  bottom:74px;
  display:none;
  padding:10px 14px;
  border-radius:14px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  font-family:tahoma, sans-serif;
  font-size:14px;
  cursor:pointer;
  user-select:none;
  pointer-events:auto;
  transition:transform .2s ease, opacity .2s ease;
  opacity:.92;
}
.tpcc-ad-skip.is-on{display:block}
.tpcc-ad-skip:hover{transform:scale(1.02); opacity:1;}


/* Universal Skip Button */
.tpcc-skip-wrap{
  position:absolute;
  z-index:2147483647;
  display:none;
  align-items:center;
  justify-content:center;
  user-select:none;
  -webkit-user-select:none;
}
.tpcc-skip-wrap.is-on{display:flex}
.tpcc-skip-btn{
  background:rgba(0,0,0,.55);
  color:#fff;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  min-height:38px;
  cursor:pointer;
  font-family:tahoma, sans-serif;
  letter-spacing:.2px;
  transition:transform .12s ease, opacity .12s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.tpcc-skip-btn:active{transform:scale(.98)}
.tpcc-skip-text{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tpcc-skip-count{font-variant-numeric:tabular-nums;opacity:.9;white-space:nowrap}



/* --- TPCC Skip Button (v0.9.1) --- */
.tpcc-skip-wrap{
  position:absolute;
  pointer-events:auto;
  z-index:2147483647;
}
.tpcc-skip-btn{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:220px;
  padding:12px 14px;
  backdrop-filter: blur(10px);
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.16);
  border-radius:16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
  color:#fff;
  cursor: default;
  user-select:none;
  transform: translateZ(0);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, opacity .2s ease;
  opacity:.92;
}
.tpcc-skip-btn.tpcc-ready{
  cursor:pointer;
  background: rgba(0,0,0,.62);
  border-color: rgba(255,255,255,.22);
  opacity:1;
}
.tpcc-skip-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  line-height:1.2;
}
.tpcc-skip-icon{
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background: rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.14);
  font-weight:700;
}
.tpcc-skip-text{
  font-weight:700;
}
.tpcc-skip-count{
  margin-inline-start:auto;
  font-size:12px;
  opacity:.9;
  white-space:nowrap;
}
.tpcc-skip-progress{
  width:100%;
  height:6px;
  border-radius:999px;
  overflow:hidden;
  background: rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.12);
}
.tpcc-skip-progress-bar{
  height:100%;
  width:0%;
  border-radius:999px;
  background: rgba(255,255,255,.86);
  transition: width 1s linear;
}
.tpcc-skip-btn.tpcc-ready .tpcc-skip-progress-bar{
  background: rgba(255,255,255,.95);
}
.tpcc-skip-btn.tpcc-ready:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(0,0,0,.42);
}
.tpcc-skip-btn.tpcc-pulse{
  animation: tpccPulse .9s ease;
}
@keyframes tpccPulse{
  0%{ transform: scale(1); }
  40%{ transform: scale(1.03); }
  100%{ transform: scale(1); }
}
