.token.token-sticker { width: 4.924%; } .token-sticker .token-inner { border: 0; border-radius: 0; background: transparent !important; box-shadow: none; overflow: visible; } .token-own.token-sticker .token-inner { outline: none; filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.9)); } .token-sticker-svg { display: block; width: 100%; height: 100%; overflow: visible; pointer-events: none; } .ledger-sticker { display: inline-block; vertical-align: middle; width: 18.17%; aspect-ratio: 1; margin: 0; flex: 0 0 auto; } .ledger-row.message-row:has(.ledger-sticker), .lobby-panel-entry-body:has(.ledger-sticker) { display: flex; align-items: center; flex-wrap: nowrap; gap: 0.4em; } .lobby-panel-entry .ledger-sticker { width: calc(var(--lobby-token-size, 56px) * var(--lobby-row-scale, 1) * 1.41); } .ledger-sticker .token-sticker-svg { pointer-events: auto; } .sticker-chat-btn svg { width: 58%; height: 58%; display: block; flex: 0 0 auto; } .stk-anim { transform-box: fill-box; transform-origin: center; } .stk-poop-coil, .stk-poop-face { transform-box: fill-box; transform-origin: center bottom; } @property --poop-off { syntax: '<number>'; inherits: true; initial-value: 0; } .stk-poop-coil { --poop-off: 0; } .stk-poop-arc { stroke-dasharray: var(--poop-len) calc(var(--poop-len) * 2); stroke-dashoffset: calc(var(--poop-off) * var(--poop-len)); } .stk-poop-face { transform-origin: center; } .stk-joy-face { transform-origin: center; transform-box: fill-box; transform: rotate(0deg); } .stk-joy-tear { transform-box: fill-box; transform-origin: center; } .stk-joy-tear-l { transform: rotate(45deg); } .stk-joy-tear-r { transform: rotate(-45deg); } .stk-heart { transform-origin: center; transform-box: fill-box; } @property --fire-sx { syntax: "<number>"; inherits: false; initial-value: 1; } @property --fire-sy { syntax: "<number>"; inherits: false; initial-value: 1; } @property --fire-rot { syntax: "<angle>"; inherits: false; initial-value: 0deg; } .stk-fire-outer, .stk-fire-mid, .stk-fire-inner, .stk-fire-core { transform-box: fill-box; transform-origin: center bottom; transform: scale(var(--fire-sx), var(--fire-sy)) rotate(var(--fire-rot)); will-change: transform; } .stk-fire-spark, .stk-fire-spark2 { transform-box: fill-box; transform-origin: center center; } .stk-fire-spark, .stk-fire-spark2 { opacity: 0; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-poop-coil-1 { animation: stk-poop-swirl-1 1.05s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-poop-coil-2 { animation: stk-poop-swirl-2 1.05s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-poop-coil-3 { animation: stk-poop-swirl-3 1.05s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-poop-face { animation: stk-poop-face 1.05s ease-out infinite; } :is(.token.moving, .token.sticker-pulse) .stk-poop-coil-1 { animation: stk-poop-swirl-1 1.05s linear 1 forwards; } :is(.token.moving, .token.sticker-pulse) .stk-poop-coil-2 { animation: stk-poop-swirl-2 1.05s linear 1 forwards; } :is(.token.moving, .token.sticker-pulse) .stk-poop-coil-3 { animation: stk-poop-swirl-3 1.05s linear 1 forwards; } :is(.token.moving, .token.sticker-pulse) .stk-poop-face { animation: stk-poop-face 1.05s ease-out 1 forwards; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-joy-face { animation: stk-joy-roll 1.1s linear infinite; } .token.joy-ccw:hover .stk-joy-face, .token.joy-ccw.moving .stk-joy-face, .token.joy-ccw.sticker-pulse .stk-joy-face, .token.joy-ccw.is-sticker-preview .stk-joy-face, .token.joy-ccw.sticker-live .stk-joy-face { animation-name: stk-joy-roll-ccw; } .joy-tears .stk-joy-tear-l { animation: stk-joy-tear-l 0.48s ease-in 1 both; } .joy-tears .stk-joy-tear-r { animation: stk-joy-tear-r 0.48s ease-in 1 both; } :is( .token:hover, .token.moving, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover ) .stk-joy-tear-l { opacity: 0; animation: none; } :is( .token:hover, .token.moving, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover ) .stk-joy-tear-r { opacity: 0; animation: none; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-outer { animation: stk-fire-outer 0.95s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-mid { animation: stk-fire-mid 0.95s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-inner, :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-core { animation: stk-fire-inner 0.95s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-spark { animation: stk-fire-spark 1.05s linear infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-fire-spark2 { animation: stk-fire-spark 1.05s linear 0.42s infinite; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-heart { animation: stk-heart 1.5s ease-in-out infinite; } .stk-cry-face { transform-box: fill-box; transform-origin: center; transform: scale(1, 1); } .stk-cry-tear { opacity: 0; transform-box: view-box; transform-origin: 0 0; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-cry-face { animation: stk-cry-squash-hold 0.32s ease-out forwards; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-cry-tear { animation: stk-cry-tear-loop 0.48s linear 0.32s infinite; } .stk-party-bit { opacity: 0; transform-box: view-box; transform-origin: center; } .stk-thumb { transform-box: fill-box; transform-origin: center; } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-party-bit { animation-name: stk-party-burst; animation-duration: 0.85s; animation-timing-function: linear; animation-iteration-count: infinite; animation-delay: var(--delay, 0s); } :is( .token:hover, .token.moving, .token.sticker-pulse, .token.is-sticker-preview, .lobby-token-avatar:hover, .lobby-token-avatar:active, .lobby-token-avatar.is-sticker-preview, .sticker-picker-item:hover, .sticker-picker-item:focus-visible, .sticker-picker-item.is-pressed, .ledger-sticker:hover, .token.sticker-live, .lobby-token-avatar.sticker-live, .ledger-sticker.sticker-live, .sticker-picker-item.sticker-live ) .stk-thumb { animation: stk-thumb-wave 1.5s ease-in-out infinite; } .lobby-token-avatar.has-sticker, .is-mine .lobby-token-avatar.has-sticker { background: transparent !important; border: none !important; box-shadow: none !important; overflow: visible; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-poop-coil-1 { animation: stk-poop-swirl-1 1.05s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-poop-coil-2 { animation: stk-poop-swirl-2 1.05s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-poop-coil-3 { animation: stk-poop-swirl-3 1.05s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-poop-face { animation: stk-poop-face 1.05s ease-out 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-joy-face { animation: stk-joy-roll 1.1s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-joy-tear-l { animation: stk-joy-tear-l 0.48s ease-in 1.1s 1 both; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-joy-tear-r { animation: stk-joy-tear-r 0.48s ease-in 1.1s 1 both; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-cry-face { animation: stk-cry-squash 1.9s ease-in-out 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-cry-tear { animation: stk-cry-tear 1.9s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-party-bit { animation-name: stk-party-burst; animation-duration: 0.85s; animation-timing-function: linear; animation-iteration-count: 1; animation-fill-mode: forwards; animation-delay: var(--delay, 0s); } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-thumb { animation: stk-thumb-wave 1.5s ease-in-out 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-outer { animation: stk-fire-outer 0.95s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-mid { animation: stk-fire-mid 0.95s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-inner, .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-core { animation: stk-fire-inner 0.95s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-spark { animation: stk-fire-spark 1.05s linear 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-fire-spark2 { animation: stk-fire-spark 1.05s linear 0.42s 1 forwards; } .lobby-token-avatar.lobby-sticker-play:not(:active):not(.is-sticker-preview) .stk-heart { animation: stk-heart 1.5s ease-in-out 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-poop-coil-1 { animation: stk-poop-swirl-1 1.05s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-poop-coil-2 { animation: stk-poop-swirl-2 1.05s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-poop-coil-3 { animation: stk-poop-swirl-3 1.05s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-poop-face { animation: stk-poop-face 1.05s ease-out 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-joy-face { animation: stk-joy-roll 1.1s linear 1 forwards; } .token.joy-ccw.sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-joy-face { animation-name: stk-joy-roll-ccw; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-joy-tear-l { animation: stk-joy-tear-l 0.48s ease-in 1.1s 1 both; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-joy-tear-r { animation: stk-joy-tear-r 0.48s ease-in 1.1s 1 both; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-outer { animation: stk-fire-outer 0.95s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-mid { animation: stk-fire-mid 0.95s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-inner, :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-core { animation: stk-fire-inner 0.95s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-spark { animation: stk-fire-spark 1.05s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-fire-spark2 { animation: stk-fire-spark 1.05s linear 0.42s 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-heart { animation: stk-heart 1.5s ease-in-out 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-cry-face { animation: stk-cry-squash 1.9s ease-in-out 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-cry-tear { animation: stk-cry-tear 1.9s linear 1 forwards; } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-party-bit { animation-name: stk-party-burst; animation-duration: 0.85s; animation-timing-function: linear; animation-iteration-count: 1; animation-fill-mode: forwards; animation-delay: var(--delay, 0s); } :is(.token, .ledger-sticker).sticker-idle:not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .stk-thumb { animation: stk-thumb-wave 1.5s ease-in-out 1 forwards; } .lobby-token-avatar.has-sticker .token-sticker-svg { width: 141%; height: 141%; margin: -20.5%; } .sticker-picker { position: fixed; z-index: 25004; width: 196px; padding: 8px; border: 1px solid rgba(240, 215, 140, 0.55); border-radius: 11px; background: rgba(22, 16, 10, 0.97); color: #f5e6c8; box-shadow: var(--lobby-shadow-lift, 0 10px 28px rgba(0, 0, 0, 0.45)); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-family: var(--lobby-font, "Segoe UI", system-ui, sans-serif); pointer-events: auto; } .sticker-picker::before { content: ""; position: absolute; left: 50%; top: -6px; width: 10px; height: 10px; margin-left: -5px; background: rgba(22, 16, 10, 0.97); border-left: 1px solid rgba(240, 215, 140, 0.55); border-top: 1px solid rgba(240, 215, 140, 0.55); transform: rotate(45deg); } .sticker-picker.is-above::before { top: auto; bottom: -6px; border-left: 0; border-top: 0; border-right: 1px solid rgba(240, 215, 140, 0.55); border-bottom: 1px solid rgba(240, 215, 140, 0.55); } .sticker-picker-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 51px); gap: 4px; } .sticker-picker-item, .sticker-picker-plain { margin: 0; padding: 0; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 10px; background: rgba(255, 255, 255, 0.06); color: #f5e6c8; cursor: pointer; font: inherit; } .sticker-picker-item { position: relative; height: 51px; } .sticker-picker-art { display: block; width: 37px; height: 37px; margin: 7px auto; } .sticker-picker-item.is-locked .sticker-picker-art { opacity: 0.55; } .sticker-picker-lock { position: absolute; left: 2px; right: 2px; bottom: 2px; font-size: 8px; line-height: 1.1; text-align: center; color: #ffe7a8; text-shadow: 0 1px 2px #000; pointer-events: none; } .sticker-picker-item.is-current, .sticker-picker-plain.is-current { border-color: rgba(140, 210, 255, 0.95); box-shadow: 0 0 0 1px rgba(100, 180, 255, 0.45); } .sticker-picker-plain { display: block; width: 100%; margin-top: 6px; padding: 6px 8px; font-size: 13px; } .lobby-billing-pay-host.billing-pay-host { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(440px, 92vw); height: min(640px, 88vh); z-index: 520; margin: 0; padding: 0; border: 0; background: transparent; overflow: visible; border-radius: 12px; box-shadow: 0 10px 36px rgba(0, 0, 0, 0.45); } .lobby-billing-pay-host.billing-pay-host[hidden] { display: none !important; } .lobby-billing-pay-host .billing-pay-frame { position: absolute; inset: 0; overflow: auto; border-radius: 12px; } .lobby-billing-pay-host iframe { display: block; width: 100% !important; height: 100% !important; border: 0; background: transparent !important; border-radius: 12px; } .lobby-billing-pay-host .billing-pay-close { position: absolute; top: -10px; right: -10px; z-index: 2; width: 32px; height: 32px; margin: 0; padding: 0; border: 1px solid rgba(240, 215, 140, 0.55); border-radius: 999px; background: rgba(18, 12, 6, 0.92); color: #f5e6c8; font-size: 1.25rem; font-weight: 700; line-height: 1; cursor: pointer; } @media (prefers-reduced-motion: reduce) { html:not(.sticker-motion) .stk-anim { animation: none !important; } } html:not(.sticker-motion) .token-sticker-svg * { animation: none !important; } @media (hover: none) { .token:not(.sticker-idle):not(.moving):not(.sticker-pulse):not(.is-sticker-preview) .token-sticker-svg *, .lobby-token-avatar:not(.lobby-sticker-play):not(:active):not(.is-sticker-preview) .token-sticker-svg *, .ledger-sticker:not(.sticker-idle) .token-sticker-svg *, .sticker-picker-item:not(:active):not(.is-pressed):not(:focus-visible) .token-sticker-svg * { animation: none !important; } } @keyframes stk-poop-swirl-3 { 0% { --poop-off: 1.5; } 3% { --poop-off: 1; } 33%, 100% { --poop-off: 0; } } @keyframes stk-poop-swirl-2 { 0%, 33% { --poop-off: 1.5; } 36% { --poop-off: 1; } 66%, 100% { --poop-off: 0; } } @keyframes stk-poop-swirl-1 { 0%, 66% { --poop-off: 1.5; } 69% { --poop-off: 1; } 100% { --poop-off: 0; } } @keyframes stk-poop-face { 0%, 66% { opacity: 0; } 100% { opacity: 1; } } @keyframes stk-joy-roll { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes stk-joy-roll-ccw { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } @keyframes stk-joy-tear-l { 0% { transform: rotate(45deg) translate(0, -16px); opacity: 0; } 28% { opacity: 1; } 78% { transform: rotate(45deg) translate(0, 0); opacity: 1; } 100% { transform: rotate(45deg) translate(0, 0); opacity: 0; } } @keyframes stk-joy-tear-r { 0% { transform: rotate(-45deg) translate(0, -16px); opacity: 0; } 28% { opacity: 1; } 78% { transform: rotate(-45deg) translate(0, 0); opacity: 1; } 100% { transform: rotate(-45deg) translate(0, 0); opacity: 0; } } @keyframes stk-cry-squash { 0%, 100% { transform: scale(1, 1); } 17%, 93% { transform: scale(1.04, 0.92); } } @keyframes stk-cry-squash-hold { 0% { transform: scale(1, 1); } 100% { transform: scale(1.04, 0.92); } } @keyframes stk-party-burst { 0% { transform: translate(0, 0) rotate(0deg) scale(0.35); opacity: 0; } 16% { opacity: 1; } 100% { transform: translate(calc(var(--dx) * 1%), calc(var(--dy) * 1%)) rotate(var(--rot)) scale(1); opacity: 0; } } @keyframes stk-thumb-wave { 0%, 100% { transform: translate(0, 0) rotate(0deg); } 25% { transform: translate(-7%, -3%) rotate(-8deg); } 50% { transform: translate(0, 4%) rotate(1deg); } 75% { transform: translate(7%, -3%) rotate(8deg); } } @keyframes stk-cry-tear-loop { 0% { transform: translate(0, -17%); opacity: 0; } 12% { transform: translate(0, -17%); opacity: 1; } 82% { transform: translate(0, 0); opacity: 1; } 92%, 100% { transform: translate(0, 0); opacity: 0; } } @keyframes stk-cry-tear { 0%, 17% { transform: translate(0, -17%); opacity: 0; } 22% { transform: translate(0, -17%); opacity: 1; } 78% { transform: translate(0, 0); opacity: 1; } 94%, 100% { transform: translate(0, 0); opacity: 0; } } @keyframes stk-fire-outer { 0%, 100% { --fire-sx: 1; --fire-sy: 1; --fire-rot: 0deg; } 25% { --fire-sx: 0.95; --fire-sy: 1.1; --fire-rot: -5deg; } 50% { --fire-sx: 1.04; --fire-sy: 0.94; --fire-rot: 3.5deg; } 75% { --fire-sx: 0.97; --fire-sy: 1.07; --fire-rot: -2.5deg; } } @keyframes stk-fire-mid { 0%, 100% { --fire-sx: 1; --fire-sy: 1; --fire-rot: 0deg; } 25% { --fire-sx: 0.92; --fire-sy: 1.14; --fire-rot: -5deg; } 50% { --fire-sx: 1.06; --fire-sy: 0.9; --fire-rot: 3.5deg; } 75% { --fire-sx: 0.94; --fire-sy: 1.1; --fire-rot: -2.5deg; } } @keyframes stk-fire-inner { 0%, 100% { --fire-sx: 1; --fire-sy: 1; --fire-rot: 0deg; } 25% { --fire-sx: 0.9; --fire-sy: 1.16; --fire-rot: -4deg; } 50% { --fire-sx: 1.08; --fire-sy: 0.88; --fire-rot: 3deg; } 75% { --fire-sx: 0.92; --fire-sy: 1.1; --fire-rot: -2deg; } } @keyframes stk-fire-spark { 0% { transform: translate(0, 18%) scale(0.45); opacity: 0; } 18% { transform: translate(-5%, -50%) scale(0.42); opacity: 1; } 55% { transform: translate(-12%, -150%) scale(0.32); opacity: 1; } 100% { transform: translate(-18%, -250%) scale(0.2); opacity: 0; } } @keyframes stk-heart { 0%, 31%, 100% { transform: scale(1, 1) rotate(0deg); } 7.5% { transform: scale(1.22, 0.78) rotate(-8deg); } 15% { transform: scale(0.88, 1.2) rotate(6deg); } 22.5% { transform: scale(1.14, 0.86) rotate(-4deg); } }