body { background-color: #F5F5F5; padding-top: var(--window-inset-top); padding-bottom: var(--window-inset-bottom); } .no-scroll { overflow: hidden; } .floating-card { display: flex; justify-content: center; position: fixed; bottom: 50px; left: 50%; transform: translateX(-50%); z-index: 10; } .floating-btn { flex-shrink: 0; background-color: #007bff; border: none; box-shadow: 0 4px 8px #0003; color: #fff; display: flex; justify-content: center; align-items: center; padding: 10px 20px; font-size: 20px; font-weight: bold; transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1); border-radius: 50px 50px; overflow: hidden; user-select: none; } .prompt { position: fixed; bottom: 0; left: 10px; background-color: #4CAF50; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); color: white; font-size: 15px; padding: 5px 10px; z-index: 2000; width: auto; max-width: calc(100% - 40px); transform: translateY(100%); transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1); } .prompt.error { background-color: #f44336; } .loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; color: #6E6E6E; display: flex; justify-content: center; align-items: center; font-size: 24px; z-index: 1000; } .footer { display: flex; justify-content: space-between; align-items: center; width: calc(100% - 10px); max-width: 1100px; padding: 25px 0; position: relative; margin-left: auto; margin-right: auto; } .uninstall-container { padding: 10px 10px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; align-items: center; border-radius: 8px; background-color: #CE0000; white-space: nowrap; overflow: hidden; user-select: none; } .uninstall-container i { margin-right: 5px; } .uninstall-container span { font-size: 16px; font-weight: bold; color: #fff; } .uninstall-container.hidden-uninstall { display: none; } .ripple { position: absolute; border-radius: 50%; transform: scale(0); opacity: 1; animation: ripple-animation ease-out forwards; pointer-events: none; background: rgba(0, 0, 0, 0.2); } .ripple.end { opacity: 0; } @keyframes ripple-animation { to { transform: scale(3); } } @media (prefers-color-scheme: dark) { body { background-color: #121212; color: #fff; } }