/* YT Grid Feed 1.1 — premium & responsive (container-query based) */
.ytg{
--ytg-a:var(--ytg-accent,var(--wp--preset--color--primary,#e5383b));
--ytg-r:var(--ytg-radius,16px);
--ytg-line:rgba(127,127,127,.22);
--ytg-soft:rgba(127,127,127,.1);
--ytg-ease:cubic-bezier(.22,.61,.36,1);
container:ytg/inline-size;
display:block;width:100%;max-width:100%;overflow-x:clip;box-sizing:border-box;margin:1.75em 0;line-height:1.4;
font-family:var(--ytg-font,inherit);color:var(--ytg-text,inherit);background:var(--ytg-bg,transparent);
-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
@supports (color:color-mix(in srgb,red,blue)){
.ytg{--ytg-line:color-mix(in srgb,currentColor 14%,transparent);--ytg-soft:color-mix(in srgb,currentColor 7%,transparent)}}
.ytg *,.ytg *::before,.ytg *::after{box-sizing:border-box}
.ytg a{text-decoration:none;color:inherit;box-shadow:none;-webkit-tap-highlight-color:transparent}
.ytg a:focus-visible,.ytg .ytg-nav:focus-visible{outline:2px solid var(--ytg-a);outline-offset:3px}
.ytg img{display:block;margin:0;max-width:none}
.ytg strong{font-weight:650}
.ytg-i{display:inline-block;flex:none;vertical-align:-.14em}

/* waktu */
.ytg small.ytg-time{display:inline-flex;align-items:center;gap:5px;font-size:.78em;letter-spacing:.01em;color:var(--ytg-muted,inherit);opacity:.72}
.ytg small.ytg-time .ytg-i{font-size:1.05em}

/* tombol play */
.ytg-play{position:absolute;inset:0;margin:auto;z-index:1;width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;
color:#fff;font-size:24px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.38);
-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);
box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .35s var(--ytg-ease),background .25s,border-color .25s}
.ytg-play .ytg-i{margin-left:3px}
a:hover>.ytg-play,a:focus-visible>.ytg-play{transform:scale(1.1);background:var(--ytg-a);border-color:transparent}

/* info overlay */
.ytg-info{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:64px clamp(14px,3.2cqw,26px) clamp(14px,2.6cqw,22px);color:#fff;
background:linear-gradient(to top,rgba(6,6,9,.9) 0%,rgba(6,6,9,.55) 48%,rgba(6,6,9,0) 100%)}
.ytg-info small.ytg-time{color:#fff;opacity:.78}
.ytg-info strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:6px 0 8px;line-height:1.28;letter-spacing:-.012em;text-wrap:balance}
.ytg-chan{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:.7em;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;opacity:.92}
.ytg-chan .ytg-i{color:var(--ytg-a);font-size:1.45em;filter:drop-shadow(0 0 6px rgba(0,0,0,.4))}

/* kartu dengan garis aksen saat hover */
.ytg-feat::before,.ytg-reel::before{content:"";position:absolute;left:0;bottom:0;z-index:3;height:3px;width:0;background:var(--ytg-a);transition:width .55s var(--ytg-ease)}
.ytg-feat:hover::before,.ytg-reel:hover::before,.ytg-feat:focus-visible::before,.ytg-reel:focus-visible::before{width:100%}
.ytg-feat::after,.ytg-reel::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);pointer-events:none}

/* ===== VIDEO 16:9 — 1 besar + daftar ===== */
.ytg-wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(12px,2.4cqw,22px)}
.ytg-feat{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--ytg-r);overflow:hidden;isolation:isolate;background:#0b0b0e;
box-shadow:0 1px 2px rgba(0,0,0,.1),0 18px 40px -18px rgba(0,0,0,.5)}
.ytg-feat img,.ytg-reel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ytg-ease)}
.ytg-feat .ytg-info strong{font-size:clamp(1.02em,3.2cqw,1.65em)}
.ytg-feat .ytg-play{width:clamp(52px,9cqw,76px);height:clamp(52px,9cqw,76px);font-size:clamp(19px,3.4cqw,28px)}

.ytg-list{display:flex;flex-direction:column;gap:6px;padding:clamp(10px,2cqw,16px);border-radius:var(--ytg-r);background:var(--ytg-panel,var(--ytg-soft));border:1px solid var(--ytg-line)}
.ytg-list-title{display:flex;align-items:center;gap:10px;padding:6px 8px 10px;font-size:.72em;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ytg-muted,inherit)}
.ytg-list-title::before{content:"";width:18px;height:3px;border-radius:3px;background:var(--ytg-a)}
.ytg-list-title .ytg-i{display:none}
.ytg-list-body{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;scrollbar-width:thin;scrollbar-color:rgba(127,127,127,.4) transparent}
.ytg-row{display:flex;gap:14px;align-items:center;min-width:0;padding:8px;border-radius:calc(var(--ytg-r)*.7);transition:background .25s}
.ytg-row:hover,.ytg-row:focus-visible{background:var(--ytg-soft)}
.ytg-thumb{position:relative;flex:none;width:clamp(96px,22cqw,128px);aspect-ratio:16/10;border-radius:calc(var(--ytg-r)*.5);overflow:hidden;background:#0b0b0e;box-shadow:0 6px 14px -8px rgba(0,0,0,.5)}
.ytg-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ytg-ease)}
.ytg-mini{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;background:rgba(6,6,9,.42);opacity:0;transition:opacity .25s}
.ytg-row:hover .ytg-mini,.ytg-row:focus-visible .ytg-mini{opacity:1}
.ytg-row:hover .ytg-thumb img{transform:scale(1.08)}
.ytg-txt{display:flex;flex-direction:column;gap:5px;min-width:0}
.ytg-row strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.92em;line-height:1.35;letter-spacing:-.005em;transition:color .2s}
.ytg-row:hover strong{color:var(--ytg-a)}

@container ytg (max-width:559px){
.ytg-feat .ytg-play{inset:12px 12px auto auto;margin:0;width:44px;height:44px;font-size:16px}
.ytg-feat .ytg-info{padding-top:48px}
}
@container ytg (min-width:560px){
.ytg-list-body{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:6px}
}
@container ytg (min-width:860px){
.ytg-wrap{grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr);align-items:stretch}
.ytg-list{contain:size}/* tinggi daftar mengikuti video besar, sisanya bisa di-scroll */
.ytg-list-body{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;padding-right:2px;margin-right:-2px}
.ytg-thumb{width:clamp(96px,12cqw,128px)}
}

/* ===== REELS 9:16 ===== */
.ytg-heading{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:1.2em;font-weight:700;letter-spacing:-.015em;line-height:1.2;color:inherit}
.ytg-heading::before{content:"";flex:none;width:4px;height:1.15em;border-radius:4px;background:var(--ytg-a)}
.ytg-slider{position:relative}
.ytg-track{display:flex;gap:clamp(10px,1.8cqw,16px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 2px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
scrollbar-width:none;padding:6px 2px 20px;margin:-6px 0 -14px}
.ytg-track::-webkit-scrollbar{display:none}
.ytg-reel{position:relative;display:block;flex:0 0 clamp(140px,42cqw,220px);scroll-snap-align:start;aspect-ratio:9/16;border-radius:var(--ytg-r);overflow:hidden;isolation:isolate;background:#0b0b0e;
box-shadow:0 1px 2px rgba(0,0,0,.1),0 12px 24px -14px rgba(0,0,0,.55);transition:transform .45s var(--ytg-ease),box-shadow .45s var(--ytg-ease)}
.ytg-reel .ytg-play{width:46px;height:46px;font-size:16px}
.ytg-reel .ytg-info{padding:56px 12px 12px;font-size:.84em}
.ytg-reel .ytg-info strong{-webkit-line-clamp:3;margin:0 0 6px;line-height:1.3}
.ytg-badge{position:absolute;top:10px;left:10px;z-index:3;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;
background:rgba(10,10,14,.5);border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

.ytg .ytg-nav{position:absolute;top:50%;z-index:4;display:none;align-items:center;justify-content:center;width:44px;height:44px;margin:-30px 0 0;padding:0;border:1px solid rgba(255,255,255,.32);border-radius:50%;
background:rgba(10,10,14,.62);color:#fff;cursor:pointer;line-height:1;min-height:0;box-shadow:0 8px 22px rgba(0,0,0,.35);
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s,transform .2s}
.ytg .ytg-nav:hover{background:var(--ytg-a);transform:scale(1.07)}
.ytg-prev{left:10px}.ytg-next{right:10px}
.ytg-prev svg{transform:rotate(180deg)}
@media(hover:hover){.ytg .ytg-nav{display:flex}.ytg .ytg-nav[hidden]{display:none}}

@container ytg (min-width:900px){
.ytg-track{display:grid;grid-template-columns:repeat(var(--ytg-cols,6),minmax(0,1fr));overflow:visible;scroll-snap-type:none}
.ytg-reel{flex:none}
}

@media(hover:hover){
.ytg-feat:hover img,.ytg-reel:hover img{transform:scale(1.05)}
.ytg-reel:hover{transform:translateY(-5px);box-shadow:0 1px 2px rgba(0,0,0,.1),0 22px 34px -14px rgba(0,0,0,.6)}
}

/* Layar kecil: sedikit diperkecil + diberi ruang di kiri/kanan */
@media(max-width:600px){
.ytg{width:calc(100% - 24px);margin-left:auto;margin-right:auto}
.ytg-wrap{gap:10px}
.ytg-feat .ytg-info{padding:40px 12px 12px}
.ytg-feat .ytg-info strong{font-size:.95em;margin:4px 0 5px}
.ytg-chan{font-size:.62em}
.ytg-list{padding:8px;gap:2px}
.ytg-list-title{padding:4px 6px 6px;font-size:.64em}
.ytg-row{gap:10px;padding:5px 6px}
.ytg-thumb{width:76px;border-radius:8px}
.ytg-row strong{font-size:.8em;-webkit-line-clamp:2;line-height:1.3}
.ytg-txt{gap:3px}
.ytg small.ytg-time{font-size:.68em}
.ytg-heading{font-size:1em;margin-bottom:10px}
.ytg-track{gap:8px;padding:4px 2px 14px;margin:-4px 0 -10px}
.ytg-reel{flex:0 0 calc((100% - 24px)/4);border-radius:calc(var(--ytg-r)*.6)}
.ytg-reel .ytg-info{padding:26px 6px 6px;font-size:.68em}
.ytg-reel .ytg-info strong{-webkit-line-clamp:2;margin:0;line-height:1.25}
.ytg-reel small.ytg-time{display:none}
.ytg-reel .ytg-play{width:30px;height:30px;font-size:11px}
.ytg-reel .ytg-play .ytg-i{margin-left:1px}
.ytg-badge{top:5px;left:5px;width:20px;height:20px;font-size:10px}
}

/* Fallback untuk browser tanpa container query */
@supports not (container-type:inline-size){
.ytg{width:auto}
@media(min-width:861px){.ytg-wrap{grid-template-columns:minmax(0,1.75fr) minmax(300px,1fr)}.ytg-track{display:grid;grid-template-columns:repeat(var(--ytg-cols,6),minmax(0,1fr));overflow:visible}.ytg-reel{flex:none}}
.ytg-thumb{width:112px}.ytg-reel{flex-basis:44%}
}

/* ===== Pemutar (lightbox) ===== */
.ytg-modal{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;
padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
background:rgba(6,6,9,.8);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2)}
.ytg-modal.on{display:flex;animation:ytg-fade .25s ease both}
.ytg-m-box{position:relative;width:min(960px,100%,calc((100vh - 220px)*1.7778));animation:ytg-pop .4s cubic-bezier(.22,.61,.36,1) both}
.ytg-modal.reels .ytg-m-box{width:min(400px,100%,calc((100vh - 320px)*.5625))}
@supports(height:100dvh){
.ytg-m-box{width:min(960px,100%,calc((100dvh - 220px)*1.7778))}
.ytg-modal.reels .ytg-m-box{width:min(400px,100%,calc((100dvh - 320px)*.5625))}
}
.ytg-m-vid{aspect-ratio:16/9;background:#000;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:0 40px 90px -20px rgba(0,0,0,.8)}
.ytg-modal.reels .ytg-m-vid{aspect-ratio:9/16}
.ytg-m-vid iframe{display:block;width:100%;height:100%;border:0}
.ytg-modal .ytg-m-close{position:absolute;right:0;top:-54px;display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;margin:0;border:1px solid rgba(255,255,255,.28);border-radius:50%;
background:rgba(255,255,255,.14);color:#fff;cursor:pointer;line-height:1;min-height:0;transition:background .2s,transform .25s}
.ytg-modal .ytg-m-close:hover{background:var(--ytg-a,#e5383b);transform:rotate(90deg)}
.ytg-modal .ytg-m-close:focus-visible{outline:2px solid #fff;outline-offset:3px}
html.ytg-lock{overflow:hidden}
.ytg-m-box{display:flex;flex-direction:column;max-height:calc(100vh - 120px)}
@supports(height:100dvh){.ytg-m-box{max-height:calc(100dvh - 120px)}}
.ytg-m-vid{flex:none}
.ytg-m-strip{position:relative;display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-height:0;margin-top:12px;padding:4px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.35) transparent;border-radius:14px;background:rgba(255,255,255,.07)}
.ytg-modal .ytg-m-it{flex:none;display:flex;align-items:center;gap:12px;width:100%;padding:6px;margin:0;border:0;border-radius:10px;background:none;color:#fff;cursor:pointer;text-align:left;font:500 13px/1.35 system-ui,-apple-system,sans-serif;opacity:.7;transition:opacity .2s,background .2s}
.ytg-modal .ytg-m-it:hover{opacity:1;background:rgba(255,255,255,.08)}
.ytg-modal .ytg-m-it.on{opacity:1;background:rgba(255,255,255,.14)}
.ytg-m-it img{flex:none;display:block;width:96px;aspect-ratio:16/9;object-fit:cover;border-radius:8px;border:2px solid transparent;background:#111}
.ytg-m-it.on img{border-color:var(--ytg-a,#e5383b)}
.ytg-m-it span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-width:0}
.ytg-modal.reels .ytg-m-it img{width:42px;aspect-ratio:9/16}
@media(min-width:900px){
.ytg-modal.video .ytg-m-box{display:grid;grid-template-columns:minmax(0,1fr) 320px;column-gap:16px;width:min(1240px,100%,calc((100vh - 120px)*1.7778 + 336px));max-height:none}
.ytg-modal.video .ytg-m-strip{margin-top:0;contain:size;align-self:stretch}
}
@keyframes ytg-fade{from{opacity:0}to{opacity:1}}
@keyframes ytg-pop{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
.ytg *,.ytg *::before,.ytg *::after,.ytg-modal,.ytg-modal *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* ===== Mode Shorts (Reels, scroll vertikal) ===== */
.ytg-shorts{--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);
--ytg-fw:min(calc(100vw - 100px),calc((100vh - 200px - var(--safe-t) - var(--safe-b))*.5625));
position:fixed;inset:0;z-index:999999;display:none;background:#05050a;color:#fff;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
@supports(height:100dvh){.ytg-shorts{--ytg-fw:min(calc(100vw - 100px),calc((100dvh - 200px - var(--safe-t) - var(--safe-b))*.5625))}}
.ytg-shorts.on{display:block;animation:ytg-fade .25s ease both}
.ytg-shorts [hidden]{display:none!important}
.ytg-s-top{position:absolute;top:0;left:0;right:0;z-index:5;height:calc(56px + var(--safe-t));padding:var(--safe-t) 16px 0;display:flex;align-items:center;justify-content:space-between;background:#05050a}
.ytg-s-logo{display:flex;align-items:center;min-width:0;font-size:18px;font-weight:700;letter-spacing:-.01em}
.ytg-s-logo img{display:block;height:30px;width:auto;max-width:180px;object-fit:contain}
.ytg-shorts .ytg-s-x{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;margin:0;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;line-height:1;min-height:0;transition:background .2s}
.ytg-shorts .ytg-s-x:hover{background:var(--ytg-a,#e5383b)}
.ytg-shorts button:focus-visible,.ytg-shorts a:focus-visible{outline:2px solid #fff;outline-offset:3px}

.ytg-s-feed{position:absolute;inset:0;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ytg-s-feed::-webkit-scrollbar{display:none}
.ytg-s-slide{height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;justify-content:center;align-items:flex-start;padding:calc(64px + var(--safe-t)) 12px 0}
.ytg-s-grp{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.ytg-s-main{display:flex;align-items:flex-end;gap:12px}
.ytg-s-frame{position:relative;width:var(--ytg-fw);aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#000 center/cover no-repeat;box-shadow:0 30px 70px -20px rgba(0,0,0,.8)}
.ytg-s-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.ytg-s-rail{display:flex;flex-direction:column;align-items:center;gap:14px;width:56px}
.ytg-shorts .ytg-s-b{display:flex;flex-direction:column;align-items:center;gap:5px;width:56px;padding:0;margin:0;border:0;background:none;color:#fff;cursor:pointer;font:600 11.5px/1.1 system-ui,-apple-system,sans-serif;min-height:0;text-align:center}
.ytg-s-b i{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.12);transition:background .2s,transform .2s,color .2s}
.ytg-s-b:hover i{background:rgba(255,255,255,.22)}
.ytg-s-b:active i{transform:scale(.92)}
.ytg-s-like.on i{background:var(--ytg-a,#e5383b)}
.ytg-s-dis.on i{background:#fff;color:#111}
.ytg-s-cap{width:var(--ytg-fw);min-height:0}
.ytg-s-cap strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;font-weight:650;line-height:1.3;letter-spacing:-.01em}
.ytg-s-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:4px 0 0;font-size:13px;line-height:1.4;color:rgba(255,255,255,.78)}
.ytg-shorts .ytg-s-more{padding:0;margin:3px 0 0;border:0;background:none;color:#fff;opacity:.7;font:600 12.5px/1.2 system-ui,sans-serif;cursor:pointer;min-height:0}
.ytg-shorts .ytg-s-more:hover{opacity:1;text-decoration:underline}

.ytg-sheet{position:absolute;inset:0;z-index:8;display:flex;align-items:flex-end;justify-content:center}
.ytg-sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.ytg-sheet-box{position:relative;width:min(560px,100%);max-height:72vh;display:flex;flex-direction:column;background:#17181d;border-radius:20px 20px 0 0;padding-bottom:var(--safe-b);animation:ytg-up .3s cubic-bezier(.22,.61,.36,1) both;box-shadow:0 -20px 60px rgba(0,0,0,.5)}
@supports(height:100dvh){.ytg-sheet-box{max-height:72dvh}}
.ytg-sheet-h{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 18px;border-bottom:1px solid rgba(255,255,255,.1);font-size:15px}
.ytg-sheet-b{flex:1 1 auto;min-height:0;overflow-y:auto;padding:8px 18px;overscroll-behavior:contain}
.ytg-sheet-f{padding:12px 16px}
.ytg-sheet-f:empty{display:none}
.ytg-yt-link{display:block;padding:11px 16px;border-radius:999px;background:var(--ytg-a,#e5383b);color:#fff!important;text-align:center;font:600 14px/1.2 system-ui,sans-serif;text-decoration:none}
.ytg-note{margin:18px 0;text-align:center;font-size:14px;opacity:.7}
.ytg-c{display:flex;gap:12px;padding:10px 0}
.ytg-c img{flex:none;width:34px;height:34px;border-radius:50%;background:#333;object-fit:cover}
.ytg-c>div{min-width:0}
.ytg-c b{font-size:12.5px;font-weight:600;opacity:.75}
.ytg-c p{margin:3px 0 4px;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.ytg-c small{font-size:11.5px;opacity:.55}
.ytg-d-t{display:block;margin:8px 0 6px;font-size:15px;line-height:1.35}
.ytg-d-p{margin:0 0 10px;font-size:14px;line-height:1.55;white-space:pre-wrap;word-break:break-word;color:rgba(255,255,255,.85)}
@keyframes ytg-up{from{transform:translateY(100%)}to{transform:none}}

/* ===== Shorts: layar penuh ===== */
.ytg-shorts{--ytg-fh:calc(100vh - 56px - var(--safe-t));--ytg-fw:min(100vw,calc(var(--ytg-fh)*.5625))}
@supports(height:100dvh){.ytg-shorts{--ytg-fh:calc(100dvh - 56px - var(--safe-t));--ytg-fw:min(100vw,calc(var(--ytg-fh)*.5625))}}
.ytg-s-btns{display:flex;align-items:center;gap:10px}
.ytg-shorts .ytg-s-fs{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;margin:0;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;line-height:1;min-height:0;transition:background .2s}
.ytg-shorts .ytg-s-fs:hover{background:var(--ytg-a,#e5383b)}
.ytg-s-slide{padding:calc(56px + var(--safe-t)) 0 0;align-items:flex-start}
.ytg-s-grp{position:relative;display:block;width:var(--ytg-fw);height:var(--ytg-fh)}
.ytg-s-main{display:contents}
.ytg-s-frame{position:absolute;inset:0;width:auto;height:auto;aspect-ratio:auto;border-radius:0;box-shadow:none}
.ytg-s-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;width:auto;padding:56px 76px calc(16px + var(--safe-b)) 14px;pointer-events:none;
background:linear-gradient(to top,rgba(0,0,0,.78) 0%,rgba(0,0,0,.4) 60%,rgba(0,0,0,0) 100%)}
.ytg-s-cap strong{text-shadow:0 1px 6px rgba(0,0,0,.6)}
.ytg-s-cap .ytg-s-more{pointer-events:auto}
.ytg-s-rail{position:absolute;right:10px;bottom:calc(20px + var(--safe-b));z-index:3;gap:12px}
.ytg-s-b i{background:rgba(0,0,0,.38);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ytg-s-b{text-shadow:0 1px 4px rgba(0,0,0,.7)}
@media(min-width:700px){
.ytg-s-frame{border-radius:18px;box-shadow:0 30px 70px -20px rgba(0,0,0,.8)}
.ytg-s-cap{padding:56px 16px 18px;border-radius:0 0 18px 18px}
.ytg-s-rail{right:auto;left:calc(100% + 14px);bottom:calc(20px + var(--safe-b))}
.ytg-s-b i{background:rgba(255,255,255,.12)}
}
