html.sv-pwa-mobileApp,
html.sv-pwa-mobileApp body{
  overscroll-behavior-y:contain;
}

@media (max-width:980px){
  html.sv-pwa-mobileApp body.sv-reelsPage{
    background:#000 !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage .sv-reelsTabs{
    display:none !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels{
    scroll-snap-type:y mandatory;
    scroll-behavior:smooth;
    background:#000 !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels > .sv-reel,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels > .sv-reelAd{
    min-height:100svh !important;
    height:100svh !important;
    scroll-snap-align:start !important;
    scroll-snap-stop:always;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelMedia::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(180deg, rgba(0,0,0,.40) 0%, rgba(0,0,0,.02) 22%, rgba(0,0,0,.02) 58%, rgba(0,0,0,.64) 100%);
    z-index:1;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelLeft,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelRight,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelMute,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelTime,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-reelProgress,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-likeBurst,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-swipeHint{
    z-index:4;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelLeft{
    left:max(12px, env(safe-area-inset-left, 0px) + 12px) !important;
    right:92px !important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 88px) !important;
    display:grid;
    gap:10px;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelAuthorRow{
    display:inline-flex;
    width:max-content;
    max-width:100%;
    padding:8px 12px 8px 8px;
    border-radius:999px;
    background:rgba(0,0,0,.30);
    border:1px solid rgba(255,255,255,.12);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelCap{
    max-width:100% !important;
    padding:12px 14px !important;
    border-radius:22px !important;
    background:rgba(0,0,0,.28) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    box-shadow:0 18px 44px rgba(0,0,0,.24);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelRight{
    right:max(10px, env(safe-area-inset-right, 0px) + 8px) !important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 92px) !important;
    gap:12px !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rBtn,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rViews{
    width:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    border-radius:20px !important;
    background:rgba(0,0,0,.32) !important;
    border:1px solid rgba(255,255,255,.12) !important;
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    box-shadow:0 16px 40px rgba(0,0,0,.24);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rBtn .sv-ico,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rViews .sv-ico{
    width:26px !important;
    height:26px !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rBtn small,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-rViews small{
    margin-top:3px !important;
    font-size:11px !important;
    font-weight:800 !important;
    color:rgba(255,255,255,.95) !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelMute,
  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelTime{
    top:calc(env(safe-area-inset-top, 0px) + 12px) !important;
    border-radius:16px !important;
    background:rgba(0,0,0,.34) !important;
    border:1px solid rgba(255,255,255,.12) !important;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    box-shadow:0 14px 32px rgba(0,0,0,.18);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelTime{
    left:max(10px, env(safe-area-inset-left, 0px) + 8px) !important;
    right:auto !important;
    min-height:38px;
    padding:0 10px !important;
    display:inline-flex;
    align-items:center;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv-reelMute{
    right:max(10px, env(safe-area-inset-right, 0px) + 8px) !important;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage .sv-bottom{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%);
    width:min(360px, calc(100vw - 18px)) !important;
    max-width:calc(100vw - 18px) !important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
    border-radius:26px !important;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    background:rgba(8,10,16,.84) !important;
    border:1px solid rgba(255,255,255,.10) !important;
    box-shadow:0 26px 60px rgba(0,0,0,.34) !important;
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage .sv-bottom .sv-btmLink{
    border-radius:18px;
    min-height:52px;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage .sv-bottom .sv-btmLbl{
    font-size:11px !important;
    font-weight:800;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-reelProgress{
    position:absolute;
    top:calc(env(safe-area-inset-top, 0px) + 8px);
    left:max(10px, env(safe-area-inset-left, 0px) + 8px);
    right:max(62px, env(safe-area-inset-right, 0px) + 58px);
    height:4px;
    border-radius:999px;
    overflow:hidden;
    background:rgba(255,255,255,.20);
    box-shadow:0 0 0 1px rgba(255,255,255,.08);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-reelProgress > i{
    display:block;
    width:100%;
    height:100%;
    transform-origin:left center;
    transform:scaleX(0);
    background:linear-gradient(90deg, #fff, rgba(255,255,255,.82));
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-likeBurst{
    position:absolute;
    inset:50% auto auto 50%;
    width:124px;
    height:124px;
    margin:-62px 0 0 -62px;
    border-radius:999px;
    display:grid;
    place-items:center;
    color:#fff;
    opacity:0;
    transform:scale(.76);
    pointer-events:none;
    transition:transform .24s ease, opacity .24s ease;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-likeBurst::before{
    content:"❤";
    font-size:56px;
    line-height:1;
    text-shadow:0 18px 38px rgba(244,7,82,.42);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-likeBurst.is-on{
    opacity:1;
    transform:scale(1);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-swipeHint{
    position:absolute;
    left:50%;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 156px);
    transform:translateX(-50%);
    padding:10px 14px;
    border-radius:999px;
    background:rgba(0,0,0,.42);
    border:1px solid rgba(255,255,255,.12);
    color:#fff;
    font-size:12px;
    font-weight:800;
    letter-spacing:.02em;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    opacity:0;
    transition:opacity .24s ease, transform .24s ease;
    pointer-events:none;
  }

  html.sv-pwa-mobileApp body.sv-reelsPage #sv-reels .sv109-swipeHint.is-on{
    opacity:1;
    transform:translateX(-50%) translateY(-4px);
  }

  html.sv-pwa-mobileApp body.sv-reelsPage .sv109-reelPager{
    position:fixed;
    top:calc(env(safe-area-inset-top, 0px) + 12px);
    left:50%;
    transform:translateX(-50%);
    z-index:100080;
    padding:7px 12px;
    border-radius:999px;
    background:rgba(0,0,0,.34);
    border:1px solid rgba(255,255,255,.10);
    color:#fff;
    font-size:12px;
    font-weight:900;
    letter-spacing:.03em;
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    box-shadow:0 14px 32px rgba(0,0,0,.18);
  }
}
