.dtm-yth-grid-wrap,
.dtm-yth-slider-wrap{
  --dtm-yth-accent:#35a7ff;
  --dtm-yth-text:#111827;
  --dtm-yth-muted:#6b7280;
  --dtm-yth-border:#e5e7eb;
  --dtm-yth-card-bg:#ffffff;
  --dtm-yth-shadow:0 18px 45px rgba(15,23,42,.08);
  color:var(--dtm-yth-text);
}
.dtm-yth-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  margin-bottom:22px;
}
.dtm-yth-section-head h2{
  margin:0;
  font-size:26px;
  line-height:1.08;
  letter-spacing:-.02em;
  color:#0f172a;
}
.dtm-yth-section-head p{
  margin:8px 0 0;
  color:var(--dtm-yth-muted);
  font-size:15px;
  line-height:1.65;
}
.dtm-yth-grid{
  display:grid;
  grid-template-columns:repeat(var(--dtm-yth-columns,4),minmax(0,1fr));
  gap:24px;
}
.dtm-yth-card,
.dtm-yth-slide{min-width:0}
.dtm-yth-card>a,
.dtm-yth-slide>a{
  display:block;
  height:100%;
  text-decoration:none;
  color:var(--dtm-yth-text);
  background:var(--dtm-yth-card-bg);
  border:1px solid var(--dtm-yth-border);
  border-radius:28px;
  overflow:hidden;
  box-shadow:var(--dtm-yth-shadow);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.dtm-yth-card>a:hover,
.dtm-yth-slide>a:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 60px rgba(15,23,42,.14);
  border-color:rgba(53,167,255,.22);
}
.dtm-yth-thumb-wrap{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#e2e8f0,#f8fafc);
}
.dtm-yth-thumb-wrap.is-video{aspect-ratio:16/9}
.dtm-yth-thumb-wrap.is-shorts{aspect-ratio:9/16}
.dtm-yth-thumb-wrap::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:44%;
  background:linear-gradient(to top,rgba(15,23,42,.34),rgba(15,23,42,0));
  pointer-events:none;
}
.dtm-yth-smart-thumb,
.dtm-yth-thumb-wrap img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .5s ease;
}
.dtm-yth-card>a:hover .dtm-yth-smart-thumb,
.dtm-yth-slide>a:hover .dtm-yth-smart-thumb{
  transform:scale(1.04);
}
.dtm-yth-play{
  position:absolute;
  left:18px;
  bottom:18px;
  width:58px;
  height:58px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  color:#fff;
  background:rgba(10,14,25,.72);
  backdrop-filter:blur(8px);
  box-shadow:0 12px 30px rgba(15,23,42,.28);
  z-index:2;
}
.dtm-yth-tag{
  position:absolute;
  right:16px;
  top:16px;
  z-index:2;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(15,23,42,.78);
  color:#fff;
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}
.dtm-yth-card-content{
  padding:20px 20px 22px;
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
}
.dtm-yth-card-content h3{
  margin:0 0 10px;
  color:#0f172a;
  font-size:20px;
  line-height:1.35;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.dtm-yth-card-content p{
  margin:0 0 14px;
  color:var(--dtm-yth-muted);
  font-size:14px;
  line-height:1.7;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.dtm-yth-button-text{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:var(--dtm-yth-accent);
}
.dtm-yth-button-text::after{
  content:"→";
  font-size:16px;
  transform:translateY(-1px);
}
.dtm-yth-slider-wrap{position:relative}
.dtm-yth-slider-head{margin-bottom:18px}
.dtm-yth-slider-controls{display:flex;gap:12px}
.dtm-yth-nav{
  width:52px;
  height:52px;
  border-radius:999px;
  border:1px solid #dbe2ea;
  background:#fff;
  color:#0f172a;
  box-shadow:0 12px 28px rgba(15,23,42,.08);
  font-size:24px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.dtm-yth-nav:hover{
  transform:translateY(-2px);
  border-color:rgba(53,167,255,.28);
  box-shadow:0 18px 32px rgba(15,23,42,.12);
}
.dtm-yth-slider{overflow:hidden}
.dtm-yth-slider-track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(260px, 24%);
  gap:24px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:6px 4px 14px;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.dtm-yth-slider-track::-webkit-scrollbar{display:none}
.dtm-yth-slide{scroll-snap-align:start}
.dtm-yth-empty{
  padding:18px 20px;
  border:1px solid #e5e7eb;
  border-radius:18px;
  background:#fff;
  color:#0f172a;
}
.dtm-yth-modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:999999;
}
.dtm-yth-modal.is-open{display:block}
.dtm-yth-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.88);
}
.dtm-yth-modal-dialog{
  position:fixed;
  inset:0;
  z-index:2;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
.dtm-yth-modal-dialog.is-video{
  --dtm-yth-video-width:min(96vw, calc(90vh * 1.7778));
  --dtm-yth-video-height:min(90vh, calc(96vw * .5625));
}
.dtm-yth-modal-dialog.is-shorts{
  --dtm-yth-video-width:min(90vw, calc(90vh * .5625));
  --dtm-yth-video-height:min(90vh, calc(90vw * 1.7778));
}
.dtm-yth-modal-close{
  position:absolute;
  left:calc(50% + (var(--dtm-yth-video-width) / 2) - 18px);
  top:calc(50% - (var(--dtm-yth-video-height) / 2) - 22px);
  width:56px;
  height:56px;
  border-radius:999px;
  border:0;
  background:rgba(17,24,39,.9);
  color:#fff;
  font-size:34px;
  line-height:1;
  cursor:pointer;
  z-index:1000001;
}
.dtm-yth-modal-frame-wrap{
  width:var(--dtm-yth-video-width);
  height:var(--dtm-yth-video-height);
  background:#000;
  overflow:hidden;
  box-shadow:none;
}
#dtm-yth-modal-frame{width:100%;height:100%}
.dtm-yth-modal-title{display:none}
@media (max-width:782px){
  .dtm-yth-modal-dialog.is-video{
    --dtm-yth-video-width:min(100vw, calc(88vh * 1.7778));
    --dtm-yth-video-height:min(88vh, calc(100vw * .5625));
  }
  .dtm-yth-modal-dialog.is-shorts{
    --dtm-yth-video-width:min(94vw, calc(88vh * .5625));
    --dtm-yth-video-height:min(88vh, calc(94vw * 1.7778));
  }
  .dtm-yth-modal-close{
    left:calc(50% + (var(--dtm-yth-video-width) / 2) - 16px);
    top:calc(50% - (var(--dtm-yth-video-height) / 2) - 18px);
    width:52px;
    height:52px;
  }
}
@media (max-width: 1240px){
  .dtm-yth-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dtm-yth-slider-track{grid-auto-columns:minmax(260px, 32%)}
}
@media (max-width: 900px){
  .dtm-yth-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dtm-yth-slider-track{grid-auto-columns:minmax(240px, 60%)}
  .dtm-yth-card-content h3{font-size:18px}
}
@media (max-width: 640px){
  .dtm-yth-grid{grid-template-columns:1fr}
  .dtm-yth-section-head{align-items:flex-start;flex-direction:column}
  .dtm-yth-slider-track{grid-auto-columns:minmax(220px, 82%)}
  
  .dtm-yth-play{width:52px;height:52px}
}
