* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: light-dark(#f8f9fb, #09090a); color: light-dark(#17171a, #fff); font-family: Outfit-Regular, sans-serif; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.theme-page-toggle { display: none !important; }

.shorts-desktop-chrome { --shorts-header-height: 70px; position: relative; z-index: 20; height: var(--shorts-header-height); }
.shorts-shell { height: calc(100dvh - 70px); overflow: hidden; }
.shorts-layout { --frame-width: calc((100dvh - 92px) * .5625); display: grid; grid-template-columns: minmax(0, 1fr) 76px; grid-template-rows: minmax(0, 1fr); align-items: end; gap: 16px; width: 100%; max-width: calc(var(--frame-width) + 136px); height: 100%; min-height: 0; margin: auto; padding: 10px 22px 12px; }
.shorts-layout.comments-open { grid-template-columns: minmax(0, 1fr) 76px clamp(300px, 31vw, 420px); max-width: calc(var(--frame-width) + clamp(300px, 31vw, 420px) + 152px); }
.shorts-player-column { position: relative; min-width: 0; width: 100%; max-height: 100%; aspect-ratio: 9 / 16; }
.shorts-feed { position: absolute; inset: 0; width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden; overflow-anchor: none; overscroll-behavior-y: contain; scroll-snap-type: y mandatory; scrollbar-width: none; border-radius: 18px; background: #000; }
.shorts-feed::-webkit-scrollbar { display: none; }
.short-slide { position: relative; height: 100%; min-height: 100%; overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; background: #000; color: #fff; color-scheme: dark; }
.short-slide video { display: block; width: 100%; height: 100%; object-fit: cover; background: #000; }
.short-video-surface { position: absolute; inset: 0; z-index: 1; width: 100%; border: 0; background: transparent; cursor: pointer; }
.short-play-overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; display: grid; place-items: center; width: 64px; height: 64px; padding: 18px; border: 0; border-radius: 50%; background: #f16d019e; color: #fff; cursor: pointer; }
.short-play-overlay[hidden] { display: none; }
.short-play-overlay svg { width: 28px; height: 28px; }
.short-video-surface, .short-play-overlay { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.short-double-tap-heart { position: absolute; left: 50%; top: 50%; z-index: 4; width: 88px; height: 88px; color: #ef233c; opacity: 0; transform: translate(-50%, -50%); pointer-events: none; filter: drop-shadow(0 4px 12px #0006); }
.short-double-tap-heart svg { width: 100%; height: 100%; }
.short-double-tap-heart.is-visible { animation: short-like-heart 750ms cubic-bezier(.22, .61, .36, 1) both; }
@keyframes short-like-heart {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.35) rotate(-14deg); }
  25% { opacity: 1; transform: translate(-50%, -50%) scale(1.18) rotate(8deg); }
  42% { opacity: 1; transform: translate(-50%, -50%) scale(.94) rotate(-4deg); }
  58%, 70% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(0deg); }
  100% { opacity: 0; transform: translate(-50%, -80%) scale(.9) rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) { .short-double-tap-heart.is-visible { animation: short-like-heart-fade 450ms ease-out both; } }
@keyframes short-like-heart-fade {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(.94); }
  25%, 75% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
}
.short-play-overlay:hover { background: #f16d01; }
.short-play-overlay:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.short-mobile-overlay { position: absolute; right: 0; bottom: 0; left: 0; z-index: 2; display: flex; align-items: flex-end; padding: 64px 16px 24px; pointer-events: none; background: linear-gradient(transparent, #000b); }
.short-mobile-meta { flex: 1; min-width: 0; max-width: 100%; pointer-events: auto; }
.short-creator-row { display: flex; align-items: center; gap: 10px; min-width: 0; }
.short-creator-row .short-mobile-creator { display: flex; align-items: center; gap: 10px; min-width: 0; color: #fff; font-size: 16px; font-family: 'Outfit-SemiBold'; text-shadow: 0 1px 4px #0006; }
.short-creator-row .short-mobile-creator span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.short-follow { flex: none; min-height: 34px; padding: 5px 20px; border: 1px solid #fff; border-radius: 9999px; background: #fff; color: #000; box-shadow: inset 0 1px 1px #ffffff80, 0 2px 8px #0004; font-family: Outfit-Medium, sans-serif; font-size: 14px; line-height: 20px; font-family: 'Outfit-SemiBold'; white-space: nowrap; touch-action: manipulation; transition: filter .15s; }
.short-follow[hidden] { display: none; }
.short-follow:hover { filter: brightness(.95); }
.short-follow:active { filter: brightness(.9); }
.short-follow:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.short-follow:disabled { opacity: .65; cursor: wait; }
.short-mobile-actions { display: none; }
.short-mobile-avatar { display: block; width: 42px; height: 42px; flex: none; border: 1px solid #ffffff38; border-radius: 50%; object-fit: cover; }
.short-footer h2 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; max-height: 2.7em; overflow: hidden; overflow-wrap: anywhere; white-space: normal; margin: 12px 0 3px; font-size: 16px; font-family: 'Outfit-SemiBold'; line-height: 1.35; }
.short-footer h2.is-expanded { -webkit-line-clamp: 10; max-height: 13.5em; }
.short-title-toggle { display: block; border: 0; background: transparent; color: #ffffffb3; padding: 3px 0 8px; font-family: Outfit-Medium, sans-serif; font-size: 12px; text-align: left; }
.short-title-toggle[hidden] { display: none; }
.short-title-toggle:hover { color: #fff; }
.short-title-toggle:focus-visible { outline: 2px solid #fff; outline-offset: 3px; border-radius: 3px; }
.short-footer p { display: -webkit-box; overflow: hidden; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 1; margin: 0; color: #ddd; font-size: 15px; line-height: 1.4; white-space: pre-line; }
.shorts-back { position: absolute; top: 18px; left: 18px; z-index: 12; display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #0009; color: #fff; cursor: pointer; }
.shorts-back svg { width: 20px; height: 20px; }
.shorts-back:hover { background: #000c; }
.shorts-back:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.shorts-back.shorts-ad-sound { left: auto; right: 18px; }
.shorts-ad-sound[hidden] { display: none; }
.shorts-ad-sound svg { width: 19px; height: 19px; }
.short-desktop-sound { position: absolute; top: 18px; right: 18px; z-index: 12; display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #0009; color: #fff; cursor: pointer; box-shadow: 0 2px 10px #0006; }
.short-desktop-sound svg { width: 19px; height: 19px; }
.short-desktop-sound:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.short-progress { position: absolute; right: 16px; bottom: 12px; left: 16px; z-index: 3; height: 3px; border-radius: 999px; overflow: hidden; background: #ffffff55; pointer-events: none; }
.short-progress-fill { width: 0; height: 100%; background: #fff; }
.shorts-status { position: absolute; top: 18px; left: 50%; z-index: 4; margin: 0; transform: translateX(-50%); border-radius: 20px; background: #000a; padding: 6px 12px; color: #eee; font-size: 12px; white-space: nowrap; pointer-events: none; }
.shorts-status:empty { display: none; }

.shorts-rail { position: relative; display: flex; align-items: flex-end; justify-content: center; min-width: 0; min-height: 0; padding-bottom: 8px; }
.shorts-desktop-actions { width: 100%; }
.short-rail-items { display: flex; flex-direction: column; align-items: center; gap: 11px; width: 100%; }
.short-rail-items button { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 70px; border: 0; background: none; color: light-dark(#17171a, #f6f6f6); padding: 0; font-size: 12px; font-family: 'Outfit-SemiBold'; }
.short-rail-items button svg { width: 52px; height: 52px; padding: 13px; border-radius: 50%; background: light-dark(#eef0f4, #242426); transition: background .15s, transform .15s; }
.short-rail-items button:hover svg { background: light-dark(#dce0e6, #39393c); transform: scale(1.04); }
.liquid-like { display: grid; justify-items: center; gap: 4px; width: fit-content; }
.liquid-like button.like-button { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 1px solid #ffffff33; border-radius: 50%; color: inherit; font: inherit; cursor: pointer; text-shadow: none; background: radial-gradient(circle at 30% 15%, #ffffff4d, transparent 55%), linear-gradient(150deg, #ffffff1f, #ffffff08); box-shadow: inset 0 1px 2px #ffffff59, 0 4px 12px #00000040; transition: transform 180ms ease, color 180ms ease; }
.liquid-like button.like-button svg { width: 20px; height: 20px; padding: 0; border-radius: 0; background: transparent; filter: none; transform: none; }
.liquid-like button.like-button:hover { transform: translateY(-2px); }
.liquid-like button.like-button:active { transform: scale(.92); }
.liquid-like button.like-button[data-action="like"][aria-pressed="true"] { color: #ff5078; }
.liquid-like button.like-button[aria-pressed="true"] svg { fill: currentColor; }
.liquid-like .like-count { padding: 0 4px; border: 0; border-radius: 4px; background: transparent; color: inherit; font-size: 13px; line-height: 1.4; font-variant-numeric: tabular-nums; }
.liquid-like button.like-count { display: block; width: auto; font-family: inherit; font-weight: inherit; font-size: 10px; color: inherit; text-shadow: none; cursor: pointer; }
.liquid-like button.like-count:hover { text-decoration: underline; }
.liquid-like button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
:root[data-theme="light"] .liquid-like { color: #202020; }
:root[data-theme="light"] .liquid-like button.like-button { border-color: #ffffffe6; background: linear-gradient(145deg, #d1d1d1, #eeeeee); box-shadow: inset 0 1px 2px #ffffff80, 0 2px 6px #00000012; }
:root[data-theme="light"] .liquid-like .like-count { color: #626262; }
:root[data-theme="light"] .liquid-like button[data-action="bookmark"][aria-pressed="true"] svg { color: #252525; }
@media (min-width: 768px) { .liquid-like button.like-button { width: 45px; height: 45px; } }
@media (prefers-reduced-motion: reduce) { .liquid-like button.like-button { transition: none; } }
.short-rail-items button[data-action="bookmark"][aria-pressed="true"] svg { color: light-dark(#17171a, #fff); }
.short-mobile-actions button[data-action="bookmark"][aria-pressed="true"] svg { color: #fff; }

.shorts-details { border-radius: 15px; display: none; align-self: stretch; height: 100%; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; border-left: 1px solid light-dark(#17171a1a, #ffffff1b); background: light-dark(#fff, #101012); }
.comments-open .shorts-details { display: flex; }
.shorts-info { display: none; }
.shorts-comments-head { display: flex; flex: none; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px 16px 18px; }
.shorts-comments-head h2 { margin: 0; font-size: 19px; font-family: 'Outfit-SemiBold'; }
.shorts-comments-head button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: light-dark(#e9ebef, #272729); color: light-dark(#17171a, #fff); font-size: 23px; line-height: 1; }
.shorts-comments-head #closeDesktopComments { margin-left: auto; flex-shrink: 0; }
.shorts-comments-list { flex: 1 1 0; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; padding: 0 17px; }
.short-comment { display: flex; gap: 10px; padding: 14px 0; border-bottom: 1px solid light-dark(#17171a12, #ffffff12); }
.short-comment img { width: 36px; height: 36px; flex: none; border-radius: 50%; object-fit: cover; }
.short-comment-main { min-width: 0; flex: 1; }
.short-comment-name { font-size: 13px; font-family: 'Outfit-SemiBold'; overflow-wrap: anywhere; }
.short-comment-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 7px; }
.short-comment-edited { font-size: 11px; color: light-dark(#737985, #999); }
.short-comment-clamped { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
.short-comment-read-more { display: block; margin: -2px 0 9px; padding: 0; border: 0; background: none; color: light-dark(#555c68, #bbb); font: inherit; font-size: 12px; cursor: pointer; }
.short-comment-read-more[hidden], .short-comment-content[hidden] { display: none; }
.short-comment-content { min-width: 0; max-width: 100%; margin: 5px 0 8px; color: light-dark(#31343c, #ededed); font-size: 14px; line-height: 1.45; white-space: pre-wrap; word-break: normal; overflow-wrap: anywhere; }
.short-comments-off { margin: 40px 0 8px; text-align: center; color: light-dark(#31343c, #ededed); font-size: 14px; line-height: 1.45; }
.shorts-comments-head h2[hidden], .shorts-mobile-comments-head strong[hidden], .liquid-like .like-count[hidden] { display: none; }
.short-comment-actions { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.short-comment-actions button { border: 0; background: none; color: light-dark(#656b76, #999); padding: 0; font-size: 12px; }
.short-comment-actions button:hover { color: light-dark(#17171a, #fff); }
.short-replies { margin-top: 8px; padding-left: 12px; border-left: 2px solid light-dark(#17171a20, #ffffff20); }
.short-replies .short-comment img { width: 22px; height: 22px; }
.short-comment-avatar { flex: none; align-self: flex-start; }
.short-comment-avatar img { display: block; }
.short-comment-like { display: flex; flex: none; align-self: flex-start; align-items: center; flex-direction: column; gap: 5px; min-width: 32px; margin-top: 4px; padding: 7px 3px; border: 0; border-radius: 9px; background: none; color: light-dark(#737985, #a4a4ad); cursor: pointer; }
.short-comment-like svg { width: 17px; height: 17px; }
.short-comment-like span { font-size: 11px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.short-comment-like[aria-pressed="true"] svg { color: #ef233c; }
.short-comment-like:focus-visible, .short-comment-reply:focus-visible, .short-replies-more:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.short-comment-like:hover svg { fill: #ef233c; }
.short-comment-thread { margin-top: 10px; }
.short-replies:empty { display: none; }
.short-replies .short-comment { gap: 7px; padding: 11px 0; border-bottom: 0; }
.short-replies .short-comment-content { font-size: 13px; }
.short-replies-more { margin: 8px 0; padding: 4px 0; border: 0; background: none; color: light-dark(#656b76, #aaa); font-size: 12px; cursor: pointer; }
.short-reply-composer { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.short-reply-composer textarea { box-sizing: border-box; width: 100%; min-height: 65px; max-height: 160px; resize: vertical; border: 1px solid light-dark(#17171a20, #ffffff20); border-radius: 12px; background: light-dark(#f4f5f7, #ffffff06); color: inherit; padding: 10px 12px; font: inherit; font-size: 13px; line-height: 1.5; }
.short-reply-composer textarea:focus { outline: none; border-color: light-dark(#17171a80, #ffffff80); }
.short-reply-actions { display: flex; justify-content: flex-end; gap: 7px; }
.short-reply-actions button { border: 0; border-radius: 18px; padding: 7px 13px; background: light-dark(#17171a09, #ffffff09); color: inherit; font: inherit; font-size: 12px; cursor: pointer; }
.short-reply-actions button[type="submit"] { background: light-dark(#17171a, #fff); color: light-dark(#fff, #17171a); }
.short-comment button:disabled { opacity: .55; cursor: wait; }
.short-comment-error { margin: 8px 0; color: light-dark(#b42332, #ff8994); font-size: 12px; overflow-wrap: anywhere; }
.short-comment-thread[hidden], .short-reply-composer[hidden], .short-replies-more[hidden], .short-comment-error[hidden] { display: none; }
.shorts-more { flex: none; align-self: flex-start; margin: 0 17px 9px; border: 0; background: none; color: light-dark(#555c68, #bbb); font-size: 12px; }
.shorts-comment-form { display: flex; flex-wrap: wrap; flex: none; gap: 8px; border-top: 1px solid light-dark(#17171a1a, #ffffff1a); padding: 13px 16px; }
.shorts-comment-form[hidden] { display: none; }
.short-post-error { flex-basis: 100%; }
.short-pending-avatar { width: 32px; height: 32px; flex: none; border-radius: 50%; object-fit: cover; }
.short-reply-skeleton { display: flex; gap: 10px; padding: 12px 0; }
.short-reply-skeleton i, .short-reply-skeleton span { display: block; background: light-dark(#17171a1a, #ffffff1a); border-radius: 5px; }
.short-reply-skeleton i { width: 24px; height: 24px; flex: none; border-radius: 50%; }
.short-reply-skeleton div { flex: 1; }
.short-reply-skeleton span { height: 10px; margin-bottom: 7px; width: 90%; }
.short-reply-skeleton span:first-child { width: 30%; }
.short-reply-skeleton span:last-child { width: 60%; }
.short-reply-skeletons { animation: short-reply-pulse 1.4s ease-in-out infinite; }
@keyframes short-reply-pulse { 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .short-reply-skeletons { animation: none; } }
.shorts-comment-form input { min-width: 0; flex: 1; border: 1px solid light-dark(#17171a25, #ffffff25); border-radius: 20px; background: light-dark(#f1f3f6, #232326); color: light-dark(#17171a, #fff); padding: 10px 13px; outline: none; font-size: 13px; }
.shorts-comment-form input:focus { border-color: light-dark(#17171a91, #ffffff91); }
.shorts-comment-form button { border: 0; border-radius: 20px; background: light-dark(#17171a, #fff); color: light-dark(#fff, #111); padding: 0 15px; font-size: 13px; font-family: 'Outfit-SemiBold'; }
.shorts-comment-form button:disabled { opacity: .5; }
.shorts-details.is-ad .shorts-comments-head, .shorts-details.is-ad .shorts-comments-list, .shorts-details.is-ad .shorts-more, .shorts-details.is-ad .shorts-comment-form { display: none; }

.shorts-toast { position: fixed; z-index: 40; bottom: 24px; left: 50%; transform: translateX(-50%); border-radius: 9px; background: light-dark(#eef0f4, #303034); color: light-dark(#17171a, #fff); padding: 10px 14px; font-size: 13px; opacity: 0; pointer-events: none; transition: opacity .2s; }
.shorts-toast.show { opacity: 1; }
.shorts-share-dialog { position: fixed; inset: 0; width: min(480px, calc(100% - 24px)); height: fit-content; max-height: calc(100dvh - 32px); margin: auto; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; border: 1px solid light-dark(#e5e5e9, #ffffff1a); border-radius: 24px; background: light-dark(#fff, #202023); color: light-dark(#17171a, #fafafa); padding: 24px; box-shadow: 0 24px 80px #0005; font-family: Outfit-Regular, sans-serif; }
.shorts-share-dialog::backdrop { background: #0008; }
.shorts-share-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.shorts-share-head > div { min-width: 0; }
.shorts-share-head h2 { margin: 0; font-family: Outfit-SemiBold, sans-serif; font-size: 22px; line-height: 1.3; letter-spacing: -.5px; }
.shorts-share-head p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 5px 0 0; color: light-dark(#626874, #b1b1b9); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.shorts-share-head button { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: light-dark(#17171a0a, #ffffff0d); color: inherit; }
.shorts-share-head button svg { width: 18px; height: 18px; }
.shorts-share-apps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 24px; border-top: 1px solid light-dark(#17171a14, #ffffff14); padding-top: 16px; }
.shorts-share-apps a { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: 9px; border: 1px solid transparent; border-radius: 12px; padding: 10px 2px; font-family: Outfit-Medium, sans-serif; font-size: 12px; text-align: center; transition: background .15s, border-color .15s; }
.shorts-share-apps a:hover { border-color: light-dark(#17171a12, #ffffff18); background: light-dark(#17171a05, #ffffff08); }
.shorts-share-apps a span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 15px; color: #fff; box-shadow: 0 3px 10px #0003; }
.shorts-share-apps a svg { width: 25px; height: 25px; }
.shorts-share-apps a[data-share-app="whatsapp"] span { background: #25d366; }
.shorts-share-apps a[data-share-app="facebook"] span { background: #1877f2; }
.shorts-share-apps a[data-share-app="x"] span { background: #111; box-shadow: inset 0 0 0 1px #ffffff26; }
.shorts-share-apps a[data-share-app="telegram"] span { background: #229ed9; }
.shorts-share-preview { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding: 12px; border-radius: 14px; background: light-dark(#f6f6f8, #ffffff05); }
.shorts-share-preview img { width: 112px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; flex: none; }
.shorts-share-preview > div { min-width: 0; }
.shorts-share-preview span { color: light-dark(#8a4800, #ffad66); font-size: 9px; letter-spacing: 1.4px; font-family: 'Outfit-Medium', sans-serif; }
.shorts-share-preview p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; margin: 5px 0 0; font-size: 13px; line-height: 1.5; }
.shorts-share-link-content { flex: 1; min-width: 0; }
.shorts-share-link-label { display: block; margin-bottom: 2px; color: inherit; font-size: 12px; font-family: 'Outfit-Medium', sans-serif; }
.shorts-share-link-row { display: flex; align-items: center; gap: 12px; border: 1px solid light-dark(#e5e5eb, #ffffff14); border-radius: 12px; background: light-dark(#fafafa, #0002); padding: 12px; }
.shorts-share-link-row input { display: block; width: 100%; min-width: 0; border: 0; background: transparent; color: light-dark(#73737c, #ffffff73); padding: 0; font-size: 11px; text-overflow: ellipsis; }
.shorts-share-link-row button { display: flex; flex: none; align-items: center; justify-content: center; gap: 7px; height: 40px; border: 0; border-radius: 7px; background: light-dark(color-mix(in srgb, #17171a 10%, transparent), rgb(255 255 255 / 0.1)); color: light-dark(#17171a, white); padding: 0 12px; font-size: 12px; white-space: nowrap; }
.shorts-share-link-row button:hover { background: #f16f01; }
.shorts-share-dialog :is(button, a, input):focus-visible { outline: 2px solid #f16f01; outline-offset: 3px; }
@media (max-width: 380px) {
  .shorts-share-dialog { padding: 18px; border-radius: 18px; }
  .shorts-share-preview img { width: 88px; }
  .shorts-share-apps { gap: 6px; }
  .shorts-share-apps a { font-size: 10px; }
}
.shorts-share-link-row button svg { width: 15px; height: 15px; }
.shorts-share-embed-row { margin-top: 8px; }
.shorts-share-embed-detail { display: block; overflow: hidden; color: light-dark(#73737c, #ffffff73); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.shorts-share-footer { border-top: 1px solid light-dark(#17171a12, #ffffff12); margin-top: 22px; padding-top: 12px; }
.shorts-share-report { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; border-radius: 10px; background: transparent; color: light-dark(#b42318, #ffb5bd); padding: 11px 10px; font-family: Outfit-Medium, sans-serif; font-size: 13px; text-align: left; }
.shorts-share-report svg { width: 18px; height: 18px; flex: none; }
.shorts-share-report .shorts-share-chevron { margin-left: auto; width: 14px; height: 14px; }
.shorts-share-report:hover { background: light-dark(#b423180a, #ffb5bd0d); }
.shorts-share-head button:hover { background: light-dark(#17171a12, #ffffff18); }
.shorts-share-dialog :is(a, button, input):focus-visible { outline: 2px solid light-dark(#555c68, #d6dae2); outline-offset: 3px; }
.shorts-report-dialog { width: min(560px, calc(100% - 24px)); max-height: min(600px, calc(100dvh - 24px)); overflow: hidden; border: 1px solid light-dark(#17171a1a, #ffffff1a); border-radius: 8px; background: light-dark(#eef0f4, #242426); color: light-dark(#17171a, #fff); padding: 20px; box-shadow: 0 24px 70px #0009; font-family: Outfit-Regular, sans-serif; }
.shorts-report-dialog[open] { display: flex; flex-direction: column; }
.shorts-report-dialog::backdrop { background: #000b; }
.shorts-report-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex: none; }
.shorts-report-head h2 { margin: 0; font-family: Outfit-SemiBold, sans-serif; font-size: 18px; }
.shorts-report-head p { margin: 5px 0 0; color: light-dark(#626874, #ffffff80); font-size: 12px; line-height: 1.5; }
.shorts-report-head button { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border: 0; border-radius: 50%; background: transparent; color: light-dark(#626874, #ffffff80); font-size: 24px; }
.shorts-report-head button:hover { background: light-dark(#17171a1a, #ffffff1a); color: light-dark(#17171a, #fff); }
#reportForm { display: flex; min-height: 0; flex: 1; flex-direction: column; margin-top: 20px; }
.shorts-report-body { min-height: 0; flex: 1; overflow-y: auto; padding-right: 4px; padding-bottom: 12px; }
.shorts-report-field { margin-bottom: 12px; }
.shorts-report-field label { display: block; margin-bottom: 5px; color: light-dark(#454b57, #ffffffb3); font-size: 12px; }
.shorts-report-field label span { color: #f16f01; }
.shorts-report-field label small { color: light-dark(#6b707a, #ffffff59); font-size: 12px; }
.shorts-report-input { width: 100%; border: 1px solid light-dark(#17171a1f, #ffffff1f); border-radius: 8px; background: light-dark(#17171a08, #ffffff0f); color: light-dark(#17171a, #fff); padding: 9px 10px; font-size: 13px; outline: none; }
.shorts-report-input:focus, .shorts-report-reason-toggle[aria-expanded="true"] { border-color: #f16f01; }
.shorts-report-input::placeholder { color: light-dark(#737986, #ffffff66); }
.shorts-report-input option { background: light-dark(#eef0f4, #242426); color: light-dark(#17171a, #fff); }
textarea.shorts-report-input { min-height: 112px; resize: vertical; }
.shorts-report-reason-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-family: Outfit-Medium, sans-serif; text-align: left; }
.shorts-report-reason-toggle svg { flex: none; transition: transform .15s; }
.shorts-report-reason-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.shorts-report-reason-options { position: fixed; z-index: 2; max-height: min(240px, 45dvh); overflow-y: auto; border: 1px solid light-dark(#17171a1a, #ffffff1a); border-radius: 10px; background: light-dark(#fff, #29292d); padding: 4px; box-shadow: 0 12px 32px #0009; }
.shorts-report-reason-options[hidden] { display: none; }
.shorts-comments-list,
.shorts-report-body,
.shorts-report-reason-options {
  scrollbar-gutter: stable;
}
.shorts-report-reason-options button { display: block; width: 100%; border: 0; border-radius: 6px; background: transparent; color: light-dark(#17171a, #fff); padding: 9px 10px; font-family: Outfit-Medium, sans-serif; font-size: 13px; text-align: left; }
.shorts-report-reason-options button:hover, .shorts-report-reason-options button:focus-visible, .shorts-report-reason-options button[aria-selected="true"] { background: #f16f0129; outline: none; }
.shorts-report-reason-options button[aria-selected="true"] { color: #f16f01; }
.shorts-report-error { min-height: 16px; margin: 2px 0 0; color: light-dark(#b42318, #fca5a5); font-size: 11px; }
.shorts-report-copyright { border-top: 1px solid light-dark(#17171a1a, #ffffff1a); padding-top: 16px; }
.shorts-report-copyright[hidden], .shorts-report-success[hidden] { display: none; }
.shorts-report-note { margin: 0 0 14px; color: light-dark(#626874, #ffffff8c); font-size: 12px; line-height: 1.6; }
.shorts-report-confirm { display: flex; align-items: flex-start; gap: 8px; color: light-dark(#555c68, #ffffffa6); font-size: 12px; line-height: 1.6; cursor: pointer; }
.shorts-report-confirm input { margin-top: 3px; accent-color: #f16f01; }
.shorts-report-success { border-radius: 8px; background: #10b9811a; color: light-dark(#087443, #a7f3d0); padding: 9px 12px; font-size: 12px; }
.shorts-report-footer { display: flex; justify-content: flex-end; gap: 8px; flex: none; border-top: 1px solid light-dark(#17171a1a, #ffffff1a); padding-top: 16px; }
.shorts-report-footer button { border: 0; border-radius: 8px; padding: 9px 16px; font-family: Outfit-Medium, sans-serif; font-size: 13px; }
#cancelReport { background: transparent; color: light-dark(#626874, #ffffff99); }
#cancelReport:hover { background: light-dark(#17171a1a, #ffffff1a); color: light-dark(#17171a, #fff); }
#sendReport { background: #f16f01; color: #fff; font-family: 'Outfit-Medium', sans-serif; }
#sendReport:hover { background: #d86100; }
#sendReport:disabled { opacity: .6; cursor: default; }
.shorts-comments-backdrop, .shorts-mobile-comments { display: none; }
.short-ad-slide video { object-fit: contain; }
.short-ad-label { position: absolute; top: 18px; right: 18px; border: 1px solid #ffffff26; border-radius: 20px; background: #0009; backdrop-filter: blur(12px); padding: 6px 10px; color: #fff; font-size: 11px; }
.short-ad-actions { position: absolute; right: 16px; bottom: max(20px, env(safe-area-inset-bottom)); left: 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.short-ad-actions a, .short-ad-actions button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 24px; padding: 11px 16px; font-family: 'Outfit-Medium', sans-serif; font-size: 13px; line-height: 20px; text-decoration: none; cursor: pointer; transition: background .18s, border-color .18s; }
.short-ad-actions a { background: #fff; color: #17171a; box-shadow: 0 3px 16px #0003; }
.short-ad-actions a:hover { background: #e9e9ed; }
.short-ad-actions a svg { width: 18px; height: 18px; flex: none; }
.short-ad-actions a[hidden] { display: none; }
.short-ad-actions button { margin-left: auto; border-color: #ffffff40; background: #16171acc; backdrop-filter: blur(12px); color: #fff; }
.short-ad-actions button:not(:disabled)::after { content: ''; width: 7px; height: 7px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); margin-right: 3px; }
.short-ad-actions button:not(:disabled):hover { border-color: #ffffff80; background: #303136; }
.short-ad-actions button:disabled { color: #ffffffa6; border-color: #ffffff20; cursor: default; }
.short-ad-actions a:focus-visible, .short-ad-actions button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.short-ad-title { position: absolute; right: 18px; bottom: max(80px, calc(env(safe-area-inset-bottom) + 60px)); left: 18px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; color: #fff; font-size: 16px; font-family: 'Outfit-SemiBold'; text-shadow: 0 1px 6px #000; }

@media (min-width: 901px) and (max-width: 1023px) {
  .shorts-desktop-chrome { --shorts-header-height: 64px; }
  .shorts-shell { height: calc(100dvh - 64px); }
  .shorts-layout { --frame-width: calc((100dvh - 86px) * .5625); }
}
@media (max-width: 900px) {
  html, body { height: 100%; min-height: 0; overflow: hidden; }
  .shorts-desktop-chrome { display: none; }
  .shorts-shell { position: fixed; top: var(--shorts-visible-top, 0px); right: 0; left: 0; width: 100%; height: var(--shorts-visible-height, 100dvh); margin: 0; padding: 0; }
  .shorts-layout, .shorts-layout.comments-open { display: block; max-width: none; padding: 0; }
  .shorts-player-column { width: 100%; height: 100%; max-height: none; aspect-ratio: auto; }
  .shorts-feed { border-radius: 0; }
  .shorts-back { top: calc(12px + env(safe-area-inset-top)); left: 12px; width: 38px; height: 38px; }
  .shorts-back.shorts-ad-sound { left: auto; right: max(12px, env(safe-area-inset-right)); }
  .short-desktop-sound { top: calc(12px + env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); width: 38px; height: 38px; }
  .short-slide video { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; object-fit: contain; transform: none; }
  .shorts-rail, .shorts-details, .comments-open .shorts-details { display: none; }
  .short-mobile-overlay { position: absolute; top: auto; right: 0; bottom: 0; left: 0; z-index: 10; min-height: 210px; align-items: flex-end; justify-content: space-between; padding: 40px 12px calc(24px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, #000d); }
  .short-progress { position: absolute; right: max(12px, env(safe-area-inset-right)); bottom: calc(12px + env(safe-area-inset-bottom)); left: max(12px, env(safe-area-inset-left)); z-index: 11; }
  .short-mobile-meta { max-width: calc(100% - 85px); }
  .short-mobile-meta a { font-size: 14px; font-family: 'Outfit-SemiBold'; }
  .short-mobile-creator { display: flex; align-items: center; gap: 8px; max-width: 100%; }
  .short-mobile-creator span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .short-footer h2 { margin: 12px 0 3px; font-size: 15px; }
  .short-footer p { font-size: 14px; }
  .short-mobile-actions { font-family: 'Outfit-Medium'; display: flex; flex-direction: column; align-items: center; gap: 6px; pointer-events: auto; }
  :root .short-mobile-actions .liquid-like { color: #fff; background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  :root .short-mobile-actions .liquid-like { gap: 0; }
  :root .short-mobile-actions .liquid-like button.like-button { width: 44px; height: 36px; background: transparent; border: 0; border-radius: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; transform: none; transition: none; }
  :root .short-mobile-actions .liquid-like button.like-button svg { width: 24px; height: 24px; }
  :root .short-mobile-actions .liquid-like .like-count { font-size: 11px; color: #fff; text-shadow: 0 1px 4px #000; }
  :root .short-mobile-actions .liquid-like button[data-action="bookmark"][aria-pressed="true"] svg { color: #fff; }
  .short-mobile-actions button { display: flex; flex-direction: column; align-items: center; gap: 3px; border: 0; background: none; color: #fff; font-size: 11px; text-shadow: 0 1px 4px #000; }
  .short-mobile-actions button svg { width: 25px; height: 25px; filter: drop-shadow(0 1px 3px #00000096); }
  .short-mobile-actions button:is([aria-label="Mute"], [aria-label="Unmute"]) svg { width: 21px; height: 21px; }
  .shorts-status { top: auto; bottom: 120px; }
  .shorts-comments-backdrop:not([hidden]) { position: fixed; z-index: 18; inset: 0; display: block; background: #0008; }
  .shorts-mobile-comments { position: fixed; z-index: 19; right: 0; bottom: 0; left: 0; display: flex; height: min(72dvh, 700px); flex-direction: column; border-radius: 18px 18px 0 0; background: light-dark(#fff, #242428); transform: translateY(105%); transition: transform .25s; }
  .shorts-mobile-comments.open { transform: translateY(0); }
  .shorts-mobile-comments-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid light-dark(#17171a18, #ffffff18); padding: 15px 20px; }
  .shorts-mobile-comments-head button { border: 0; background: none; color: light-dark(#17171a, #fff); font-size: 25px; }
  .shorts-mobile-comments #mobileCommentsMount { display: flex; min-height: 0; flex: 1; flex-direction: column; }
  .shorts-mobile-comments .shorts-comments-list { padding: 0 18px; }
  .shorts-mobile-comments .shorts-comment-form { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .shorts-report-dialog { margin: auto; }
  .shorts-share-dialog { width: 100%; max-width: none; max-height: calc(100dvh - 24px); margin: auto 0 0; border-radius: 20px 20px 0 0; padding: 20px; padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
}

/* Compact caption and playback strip shared by desktop and mobile Shorts. */
.short-footer { position: relative; grid-column: 1 / -1; min-width: 0; padding: 5px 0 0; color: #fff; pointer-events: auto; }
.short-footer h2 { margin: 0; font-family: Arial, sans-serif; font-size: 16px; font-weight: 700; line-height: 22px; -webkit-line-clamp: 1; max-height: 22px; }
.short-footer h2.is-expanded { max-height: 220px; }
.short-footer p { margin: 2px 0 0; color: #fff; font-family: Arial, sans-serif; font-size: 14px; line-height: 20px; }
.short-title-trigger { display: block; width: 100%; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.short-title-trigger:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
.short-footer.is-expanded { max-height: 45dvh; overflow-y: auto; overscroll-behavior: contain; }
.short-footer.is-expanded h2, .short-footer.is-expanded p { display: block; max-height: none; -webkit-line-clamp: unset; }
.short-footer .short-progress { position: relative; inset: auto; width: 100%; height: 3px; margin-top: 8px; border-radius: 0; background: #ffffff40; }
.short-mobile-overlay { bottom: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 10px; padding-bottom: calc(15px + env(safe-area-inset-bottom)); }
.short-mobile-overlay .short-mobile-meta { max-width: 100%; }
@media (max-width: 900px) {
  .short-mobile-overlay { min-height: 0; gap: 4px 8px; padding: 12px max(8px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .short-mobile-avatar { width: 28px; height: 28px; }
  .short-creator-row { gap: 8px; }
  .short-follow { min-height: 28px; padding: 3px 12px; font-size: 12px; }
  .short-mobile-actions { gap: 4px; }
  :root .short-mobile-actions .liquid-like button.like-button svg { width: 22px; height: 22px; }
  .short-footer { padding-top: 2px; }
  .short-footer h2 { font-size: 14px; line-height: 20px; max-height: 20px; }
  .short-footer h2.is-expanded { max-height: none; }
  .short-footer p { font-size: 12px; line-height: 18px; }
  .short-footer .short-progress { margin-top: 6px; }
}