:root{}

.ytisp-wrapper{ width:100%; }
.ytisp-frame{
  position:relative;
  background:#000;
  border-radius:20px;
  overflow:hidden;
}
.ytisp-frame::before{ content:""; display:block; padding-top:56.25%; }
@supports (aspect-ratio: 16 / 9){
  .ytisp-frame{ aspect-ratio:16/9; }
  .ytisp-frame::before{ display:none; }
}

.ytisp-player{ position:absolute; inset:0; width:100%; height:100%; z-index:2; }
.ytisp-player iframe{ width:100% !important; height:100% !important; pointer-events:none !important; }

.ytisp-inpreview{
  position:absolute; inset:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ytisp-inpreview.is-hidden{ display:none; }
.ytisp-inpreview__img{ position:absolute; inset:0; background-size:cover; background-position:center; }
.ytisp-inpreview__scrim{ position:absolute; inset:0; background:radial-gradient(60% 90% at 50% 30%, rgba(0,0,0,.1), rgba(0,0,0,.8)); }

/* Only play icon */
.ytisp-play-icon{
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:120px; height:84px;
  background:#e50914;
  border-radius:26px;
  box-shadow:0 25px 70px rgba(0,0,0,.6);
}
.ytisp-play-icon::before{
  content:"";
  position:absolute;
  left:46%; top:50%;
  transform:translate(-50%,-50%);
  width:0; height:0;
  border-left:30px solid #fff;
  border-top:20px solid transparent;
  border-bottom:20px solid transparent;
}

.ytisp-clickshield{ position:absolute; inset:0; z-index:4; }
.ytisp-loading{ position:absolute; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.35); z-index:30; }
.ytisp-spinner{ width:18px; height:18px; border-radius:50%; border:2px solid rgba(255,255,255,.25); border-top-color:#fff; animation:spin 1s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

.ytisp-controls{
  display:flex; gap:10px; align-items:center;
  padding:12px 14px;
  background:rgba(0,0,0,.95);
}
.ytisp-btn{ background:rgba(255,255,255,.14); border:0; color:#fff; border-radius:12px; width:40px; height:40px; cursor:pointer; }
.ytisp-time{ color:rgba(255,255,255,.8); font:12px system-ui; white-space:nowrap; }
.ytisp-seek{ flex:1; height:6px; }
.ytisp-vol{ width:140px; height:6px; }