.download-fab { width: 132px; height: 44px; position: fixed; right: max(24px, calc((100vw - 1800px) / 2)); bottom: 138px; z-index: 10; background: #EC237F; overflow: hidden; border-radius: 22px; justify-content: center; align-items: center; gap: 8px; display: flex; border: none; padding: 0; cursor: pointer; text-decoration: none; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35); opacity: 1; visibility: visible; transform: translateY(0); transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease, filter 0.18s ease; } .download-fab:hover { filter: brightness(1.05); } .download-fab.is-scrolling { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(12px); } .download-fab-icon { width: 24px; height: 24px; position: relative; overflow: hidden; } .download-fab-text { color: #FFFFFF; font-size: 14px; font-family: PingFang SC; font-weight: 400; line-height: 20px; word-wrap: break-word; } @media (min-width: 768px) { body[class] .download-fab { width: 132px; height: 44px; right: max(24px, calc((100vw - 1800px) / 2)); bottom: 138px; display: flex !important; background: #EC237F; } body[class] .download-fab-icon { width: 24px; height: 24px; } body[class] .download-fab-text { color: #FFFFFF; font-size: 14px; line-height: 20px; } } @media (max-width: 767px) { body[class] .download-fab { display: flex !important; width: 132px !important; height: 44px !important; right: 16px !important; bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; z-index: 80; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 22px; background: #EC237F; overflow: hidden !important; } body[class] .download-fab-icon { width: 24px; height: 24px; flex: 0 0 24px; } body[class] .download-fab-text { color: #FFFFFF; font-size: 14px; line-height: 20px; } body[class].is-detail-page .download-fab, body[class].is-play-page .download-fab { display: none !important; } } @media (prefers-reduced-motion: reduce) { .download-fab { transition: none; } }