[data-video-id]{
cursor:pointer;
position:relative;
display:inline-block;
}
.yt-trigger {
  background-color: #C42727;
  color: #FFFFFF !important;	
  cursor: pointer;
  text-decoration: none;    /* 移除底線 */
  display:inline-block;
  border-radius: 25px;
  padding: 0 8px;
  font-size: 0.9em;
  font-weight:600;
}

/* 圖片 */

[data-video-id] img{
display:block;
max-width:100%;
height:auto;
}

/* 播放按鈕 */

.yt-play-btn{

position:absolute;

top:50%;
left:50%;

transform:translate(-50%,-50%);

width:20%;
max-width:80px;
min-width:40px;
	aspect-ratio:1;

background:rgba(0,0,0,.6);

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;
	pointer-events:none;

}

.yt-play-btn:before{

content:"";

border-style:solid;
border-width:12px 0 12px 20px;

border-color:transparent transparent transparent #fff;

margin-left:4px;

}

/* popup */

.yt-modal{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,.85);

display:flex;

align-items:center;
justify-content:center;

z-index:9999;

opacity:0;

visibility:hidden;

transition:.3s;

}

.yt-modal.active{

opacity:1;

visibility:visible;

}

.yt-modal-content{

width:90%;

max-width:960px;

position:relative;

}

/* 16:9 */

.yt-video-wrapper{

position:relative;

padding-bottom:56.25%;

height:0;

}

.yt-video-wrapper iframe{

position:absolute;

width:100%;
height:100%;
transition: opacity 0.3s ease;/* 新增：讓透明度變化變平滑 */
}

.yt-close{

position:absolute;

top:-40px;

right:0;

color:#fff;

font-size:36px;

cursor:pointer;

}

.yt-thumb-wrapper{
position:relative;
display:inline-block;
cursor:pointer;
}

.yt-thumb-wrapper img{
display:block;
max-width:100%;
}