.ytg{--ytg-a:var(--ytg-accent,var(--wp--preset--color--primary,#e5383b));font-family:var(--ytg-font,inherit);color:var(--ytg-text,inherit);background:var(--ytg-bg,transparent);margin:1.5em 0;box-sizing:border-box}
.ytg *{box-sizing:border-box}
.ytg a{text-decoration:none;color:inherit;box-shadow:none}
.ytg img{display:block;margin:0}
.ytg small{opacity:.7;font-size:.8em;color:var(--ytg-muted,inherit)}
.ytg-heading:not(.sec-title){margin:0 0 12px;font-size:1.1em}
.ytg-play{position:absolute;top:50%;left:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:var(--ytg-a);box-shadow:0 4px 14px rgba(0,0,0,.35);transition:transform .2s}
.ytg-play{display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;padding-left:3px}
.ytg-badge{position:absolute;top:8px;left:8px;z-index:1;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);color:#fff;font-size:12px}
.ytg-chan i,.ytg-list-title i{margin-right:4px}
.ytg-list-title i{color:var(--ytg-a)}
.ytg small i{margin-right:3px}
a:hover>.ytg-play{transform:scale(1.1)}
.ytg-feat img,.ytg-reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.ytg-feat:hover img,.ytg-reel:hover img{transform:scale(1.04)}
.ytg-info{position:absolute;left:0;right:0;bottom:0;padding:48px 18px 16px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.8));background:linear-gradient(transparent,color-mix(in srgb,var(--ytg-a) 70%,#000 30%))}
.ytg-info small{color:#fff;opacity:.8}
.ytg-info strong{display:block;line-height:1.3;margin:3px 0}
.ytg-chan{display:block;font-size:.8em;font-weight:600;color:#fff;color:color-mix(in srgb,var(--ytg-a),#fff 55%)}

/* VIDEO 16:9: 1 besar + daftar */
.ytg-wrap{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px}
.ytg-feat{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--ytg-radius,16px);overflow:hidden;background:#000}
.ytg-feat .ytg-info strong{font-size:clamp(1rem,2.2vw,1.45rem)}
.ytg-list{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:var(--ytg-radius,16px);background:var(--ytg-panel,rgba(127,127,127,.12))}
.ytg-list-title{font-weight:700;font-size:.95em}
.ytg-row{display:flex;gap:12px;align-items:center}
.ytg-row img{flex:none;width:96px;aspect-ratio:16/10;object-fit:cover;border-radius:calc(var(--ytg-radius,16px)/2.5)}
.ytg-row strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.9em;line-height:1.35}
.ytg-row:hover strong{color:var(--ytg-a)}

/* REELS 9:16: grid vertikal */
.ytg-track{display:grid;grid-template-columns:repeat(var(--ytg-cols,6),minmax(0,1fr));gap:12px}
.ytg-reel{position:relative;display:block;aspect-ratio:9/16;border-radius:var(--ytg-radius,16px);overflow:hidden;background:#000}
.ytg-reel .ytg-play{width:40px;height:40px;margin:-20px 0 0 -20px;font-size:14px}
.ytg-reel .ytg-info{padding:36px 10px 10px;font-size:.8em}
.ytg-reel .ytg-info strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

@media(max-width:900px){
.ytg-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
.ytg-reel{flex:0 0 44%;scroll-snap-align:start}
}
@media(max-width:700px){.ytg-wrap{grid-template-columns:1fr}}

/* Pemutar (lightbox) */
.ytg-modal{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.82)}
.ytg-modal.on{display:flex}
.ytg-m-box{position:relative;width:min(900px,100%,calc((100vh - 90px)*1.7778))}
.ytg-modal.reels .ytg-m-box{width:min(380px,100%,calc((100vh - 90px)*.5625))}
.ytg-m-vid{aspect-ratio:16/9;background:#000;border-radius:12px;overflow:hidden}
.ytg-modal.reels .ytg-m-vid{aspect-ratio:9/16}
.ytg-m-vid iframe{width:100%;height:100%;border:0}
.ytg-m-close{position:absolute;right:0;top:-42px;padding:7px 14px;border:0;border-radius:999px;background:rgba(255,255,255,.18);color:#fff;font:600 13px/1 system-ui,sans-serif;cursor:pointer}
.ytg-m-close:hover{background:#e5383b}

/* Di bawah foto berita utama */
.ytg-after-feat .ytg{margin:6px 0 20px}
.ytg-after-feat:empty{display:none}

/* Beranda: di bawah Spotlight */
.ytg-after-spot .ytg{margin:0}
.ytg-after-short{margin-top:-8px}

/* Short: geser ke samping, semua Short */
.ytg-scrollwrap{position:relative}
.ytg-scroll .ytg-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;gap:12px;padding-bottom:8px;scrollbar-width:thin}
.ytg-scroll .ytg-reel{flex:0 0 clamp(130px,15vw,180px);scroll-snap-align:start}
.ytg-arrow{position:absolute;top:50%;z-index:3;width:38px;height:38px;margin-top:-23px;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ytg-a);color:#fff;font-size:14px;cursor:pointer;box-shadow:0 3px 10px rgba(0,0,0,.35);padding:0;transition:transform .2s,opacity .2s}
.ytg-arrow:hover{transform:scale(1.1)}
.ytg-arrow[disabled]{opacity:0;pointer-events:none}
.ytg-prev{left:-8px}
.ytg-next{right:-8px}
@media(hover:none){.ytg-arrow{display:none}}

/* Logo media di kiri atas video */
.ytg-logo{position:absolute;top:10px;left:10px;z-index:2;display:flex;align-items:center;padding:4px 8px;border-radius:8px;background:rgba(255,255,255,.88);box-shadow:0 2px 8px rgba(0,0,0,.25)}
.ytg-logo img{display:block;height:24px;width:auto;max-width:96px;object-fit:contain}
.ytg-reel .ytg-logo{top:8px;left:8px;padding:3px 6px;border-radius:6px}
.ytg-reel .ytg-logo img{height:16px;max-width:64px}
.ytg-reel .ytg-badge{left:auto;right:8px}

/* Pemutar: geser / scroll untuk video berikutnya */
.ytg-m-vid{position:relative}
.ytg-m-gesture{position:absolute;left:0;right:0;top:0;bottom:56px;z-index:3;cursor:pointer;touch-action:none}
.ytg-m-logo{position:absolute;left:0;top:-42px;height:34px;display:flex;align-items:center;padding:0 10px;border-radius:8px;background:rgba(255,255,255,.9)}
.ytg-m-logo:empty{display:none}
.ytg-m-logo img{display:block;height:22px;width:auto;max-width:120px}
@media(max-width:700px){
.ytg-modal{padding:0}
.ytg-modal .ytg-m-box,.ytg-modal.reels .ytg-m-box{width:min(100vw,calc(100dvh*.5625));max-height:100dvh}
.ytg-modal.video .ytg-m-box{width:100vw}
.ytg-m-logo{display:none}
.ytg-m-close{top:10px;right:10px;z-index:4}
.ytg-m-vid{border-radius:0}
}