.live-tile{transition:translate .22s var(--ease-soft),border-color .22s var(--ease-soft)}.live-tile:hover{translate:0 -4px;border-color:color-mix(in srgb,var(--color-brand-500) 45%,transparent)}.lt-stage{position:relative;display:flex;flex-direction:column;gap:8px;margin-top:20px;min-height:204px;padding:16px 14px 14px;border-radius:14px;border:1px solid var(--glass-line);background:var(--color-ink-950);font-size:13px;line-height:1.4;color:var(--color-fg-muted);overflow:hidden}.lt-stage:before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,#f7c948,#f0614a,#a81e5a);transform-origin:left;animation:lt-loop 9s linear infinite}@keyframes lt-loop{0%{transform:scaleX(0)}92%,to{transform:scaleX(1)}}.lt-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid var(--glass-line);background:var(--color-ink-900)}.lt-strong{font-weight:600;color:var(--color-fg)}.lt-dim{color:var(--color-fg-dim)}.lt-badge{padding:2px 8px;border-radius:999px;border:1px solid var(--glass-line);font-size:11px;font-weight:600;white-space:nowrap;color:var(--color-fg-muted)}.lt-badge-on{border-color:var(--color-brand-500);color:var(--color-brand-500)}.lt-swap{display:inline-grid;justify-items:end}.lt-swap>*{grid-area:1 / 1}.lt-swap>:first-child{opacity:0}.lt-tick{display:block;height:1.4em;overflow:hidden;font-weight:600;color:var(--color-fg);font-variant-numeric:tabular-nums;text-align:right}.lt-tick>span{display:flex;flex-direction:column;transform:translateY(-50%)}.lt-tick>span>span{height:1.4em}.lt-bubble{align-self:flex-start;max-width:88%;padding:9px 12px;border-radius:12px 12px 12px 3px;background:var(--color-ink-800)}.lt-bubble-me{align-self:flex-end;border-radius:12px 12px 3px;color:var(--color-fg);font-weight:600;background:color-mix(in srgb,var(--color-brand-500) 22%,var(--color-ink-900))}.lt-typing{display:flex;gap:4px;height:0;align-self:flex-start;opacity:0;transform:translate(12px,6px)}.lt-typing-me{align-self:flex-end;transform:translate(-12px,6px)}.lt-typing span{width:6px;height:6px;border-radius:999px;background:var(--color-fg-dim);animation:lt-dot 1s ease-in-out infinite}.lt-typing span:nth-child(2){animation-delay:.15s}.lt-typing span:nth-child(3){animation-delay:.3s}@keyframes lt-dot{50%{transform:translateY(-4px);background:var(--color-brand-500)}}.lt-replies{display:flex;flex-wrap:wrap;gap:6px}.lt-replies span{padding:5px 11px;border-radius:999px;border:1px solid var(--glass-line);font-weight:600;color:var(--color-fg)}.lt-replies .lt-on{border-color:var(--color-brand-500);color:var(--color-brand-500);background:color-mix(in srgb,var(--color-brand-500) 10%,transparent);animation:lt-press 9s ease-in-out infinite}@keyframes lt-press{0%,36%,44%,to{transform:none}40%{transform:scale(.92)}}.lt-bar{display:block;height:6px;margin-top:6px;border-radius:999px;background:var(--color-ink-800);overflow:hidden}.lt-bar span{display:block;height:100%;width:100%;border-radius:inherit;background:linear-gradient(90deg,#f7c948,#f0614a);transform-origin:left}.lt-bars{display:flex;align-items:flex-end;gap:6px;height:46px;margin-top:6px}.lt-bars span{flex:1;height:100%;border-radius:4px 4px 0 0;background:var(--color-ink-700);transform-origin:bottom;transform:scaleY(var(--h))}.lt-bars span:nth-child(1){--h: .45}.lt-bars span:nth-child(2){--h: .7}.lt-bars span:nth-child(3){--h: .55}.lt-bars span:nth-child(4){--h: 1;background:var(--color-brand-500)}.lt-bars span:nth-child(5){--h: .8}.lt-toggle{display:block;flex:none;width:34px;height:20px;padding:3px;border-radius:999px;background:var(--color-brand-500)}.lt-toggle>span{display:block;width:14px;height:14px;border-radius:999px;background:#fff;transform:translate(14px)}.lt-swatches{position:relative;display:flex;gap:10px;margin-top:8px}.lt-swatches>span{width:26px;height:26px;border-radius:999px;border:1px solid var(--glass-line)}.lt-swatches>span:nth-child(1){background:#c8553d}.lt-swatches>span:nth-child(2){background:#2f4858}.lt-swatches>span:nth-child(3){background:#7a8450}.lt-swatches>span:nth-child(4){background:#d9c5a0}.lt-pick{position:absolute;left:-4px;top:-4px;width:34px;height:34px;border-radius:999px;border:2px solid var(--color-brand-500);transform:translate(72px);animation:lt-pick 9s var(--ease-soft) infinite}@keyframes lt-pick{0%,30%{transform:translate(0)}38%,44%{transform:translate(36px)}52%,to{transform:translate(72px)}}.lt-note{display:flex;align-items:center;gap:7px;margin-top:auto;padding-top:4px;font-weight:600;color:var(--color-fg)}.lt-note.lt-s4{box-shadow:none!important}.lt-ic{flex:none;width:16px;height:16px;fill:currentColor;color:var(--color-brand-500)}.lt-s1{animation:lt-s1 9s var(--ease-soft) infinite}@keyframes lt-s1{0%,3%{opacity:0;transform:translateY(10px) scale(.98);box-shadow:0 0 0 0 transparent}8%{opacity:1;transform:none;box-shadow:0 0 0 1.5px var(--color-brand-500),0 0 22px -4px var(--color-brand-500)}20%,92%{opacity:1;transform:none;box-shadow:0 0 0 0 transparent}97%,to{opacity:0;transform:none}}.lt-swap1>:first-child{animation:lt-swap-a1 9s linear infinite}.lt-swap1>:last-child{animation:lt-swap-b1 9s linear infinite}@keyframes lt-swap-a1{0%,17%{opacity:1;transform:none}20%,to{opacity:0;transform:translateY(-6px)}}@keyframes lt-swap-b1{0%,17%{opacity:0;transform:translateY(6px)}20%,to{opacity:1;transform:none}}.lt-tick1>span{animation:lt-tick1 9s var(--ease-soft) infinite}@keyframes lt-tick1{0%,16%{transform:translateY(0)}20%,to{transform:translateY(-50%)}}.lt-typing1{animation:lt-typing1 9s linear infinite}@keyframes lt-typing1{0%,-9%{opacity:0}-7%,2%{opacity:1}4%,to{opacity:0}}.lt-fill1{animation:lt-fill1 9s linear infinite}@keyframes lt-fill1{0%,8%{transform:scaleX(0)}24%,to{transform:scaleX(1)}}.lt-bars1>span{animation:lt-bars1 9s var(--ease-soft) infinite}@keyframes lt-bars1{0%,8%{transform:scaleY(.08)}20%,to{transform:scaleY(var(--h))}}.lt-toggle1{animation:lt-track1 9s linear infinite}.lt-toggle1>span{animation:lt-knob1 9s var(--ease-soft) infinite}@keyframes lt-track1{0%,15%{background-color:var(--color-ink-700)}18%,to{background-color:var(--color-brand-500)}}@keyframes lt-knob1{0%,15%{transform:translate(0)}18%,to{transform:translate(14px)}}.lt-s2{animation:lt-s2 9s var(--ease-soft) infinite}@keyframes lt-s2{0%,22%{opacity:0;transform:translateY(10px) scale(.98);box-shadow:0 0 0 0 transparent}27%{opacity:1;transform:none;box-shadow:0 0 0 1.5px var(--color-brand-500),0 0 22px -4px var(--color-brand-500)}39%,92%{opacity:1;transform:none;box-shadow:0 0 0 0 transparent}97%,to{opacity:0;transform:none}}.lt-swap2>:first-child{animation:lt-swap-a2 9s linear infinite}.lt-swap2>:last-child{animation:lt-swap-b2 9s linear infinite}@keyframes lt-swap-a2{0%,36%{opacity:1;transform:none}39%,to{opacity:0;transform:translateY(-6px)}}@keyframes lt-swap-b2{0%,36%{opacity:0;transform:translateY(6px)}39%,to{opacity:1;transform:none}}.lt-tick2>span{animation:lt-tick2 9s var(--ease-soft) infinite}@keyframes lt-tick2{0%,35%{transform:translateY(0)}39%,to{transform:translateY(-50%)}}.lt-typing2{animation:lt-typing2 9s linear infinite}@keyframes lt-typing2{0%,10%{opacity:0}12%,21%{opacity:1}23%,to{opacity:0}}.lt-fill2{animation:lt-fill2 9s linear infinite}@keyframes lt-fill2{0%,27%{transform:scaleX(0)}43%,to{transform:scaleX(1)}}.lt-bars2>span{animation:lt-bars2 9s var(--ease-soft) infinite}@keyframes lt-bars2{0%,27%{transform:scaleY(.08)}39%,to{transform:scaleY(var(--h))}}.lt-toggle2{animation:lt-track2 9s linear infinite}.lt-toggle2>span{animation:lt-knob2 9s var(--ease-soft) infinite}@keyframes lt-track2{0%,34%{background-color:var(--color-ink-700)}37%,to{background-color:var(--color-brand-500)}}@keyframes lt-knob2{0%,34%{transform:translate(0)}37%,to{transform:translate(14px)}}.lt-s3{animation:lt-s3 9s var(--ease-soft) infinite}@keyframes lt-s3{0%,42%{opacity:0;transform:translateY(10px) scale(.98);box-shadow:0 0 0 0 transparent}47%{opacity:1;transform:none;box-shadow:0 0 0 1.5px var(--color-brand-500),0 0 22px -4px var(--color-brand-500)}59%,92%{opacity:1;transform:none;box-shadow:0 0 0 0 transparent}97%,to{opacity:0;transform:none}}.lt-swap3>:first-child{animation:lt-swap-a3 9s linear infinite}.lt-swap3>:last-child{animation:lt-swap-b3 9s linear infinite}@keyframes lt-swap-a3{0%,56%{opacity:1;transform:none}59%,to{opacity:0;transform:translateY(-6px)}}@keyframes lt-swap-b3{0%,56%{opacity:0;transform:translateY(6px)}59%,to{opacity:1;transform:none}}.lt-tick3>span{animation:lt-tick3 9s var(--ease-soft) infinite}@keyframes lt-tick3{0%,55%{transform:translateY(0)}59%,to{transform:translateY(-50%)}}.lt-typing3{animation:lt-typing3 9s linear infinite}@keyframes lt-typing3{0%,30%{opacity:0}32%,41%{opacity:1}43%,to{opacity:0}}.lt-fill3{animation:lt-fill3 9s linear infinite}@keyframes lt-fill3{0%,47%{transform:scaleX(0)}63%,to{transform:scaleX(1)}}.lt-bars3>span{animation:lt-bars3 9s var(--ease-soft) infinite}@keyframes lt-bars3{0%,47%{transform:scaleY(.08)}59%,to{transform:scaleY(var(--h))}}.lt-toggle3{animation:lt-track3 9s linear infinite}.lt-toggle3>span{animation:lt-knob3 9s var(--ease-soft) infinite}@keyframes lt-track3{0%,54%{background-color:var(--color-ink-700)}57%,to{background-color:var(--color-brand-500)}}@keyframes lt-knob3{0%,54%{transform:translate(0)}57%,to{transform:translate(14px)}}.lt-s4{animation:lt-s4 9s var(--ease-soft) infinite}@keyframes lt-s4{0%,62%{opacity:0;transform:translateY(10px) scale(.98);box-shadow:0 0 0 0 transparent}67%{opacity:1;transform:none;box-shadow:0 0 0 1.5px var(--color-brand-500),0 0 22px -4px var(--color-brand-500)}79%,92%{opacity:1;transform:none;box-shadow:0 0 0 0 transparent}97%,to{opacity:0;transform:none}}.lt-swap4>:first-child{animation:lt-swap-a4 9s linear infinite}.lt-swap4>:last-child{animation:lt-swap-b4 9s linear infinite}@keyframes lt-swap-a4{0%,76%{opacity:1;transform:none}79%,to{opacity:0;transform:translateY(-6px)}}@keyframes lt-swap-b4{0%,76%{opacity:0;transform:translateY(6px)}79%,to{opacity:1;transform:none}}.lt-tick4>span{animation:lt-tick4 9s var(--ease-soft) infinite}@keyframes lt-tick4{0%,75%{transform:translateY(0)}79%,to{transform:translateY(-50%)}}.lt-typing4{animation:lt-typing4 9s linear infinite}@keyframes lt-typing4{0%,50%{opacity:0}52%,61%{opacity:1}63%,to{opacity:0}}.lt-fill4{animation:lt-fill4 9s linear infinite}@keyframes lt-fill4{0%,67%{transform:scaleX(0)}83%,to{transform:scaleX(1)}}.lt-bars4>span{animation:lt-bars4 9s var(--ease-soft) infinite}@keyframes lt-bars4{0%,67%{transform:scaleY(.08)}79%,to{transform:scaleY(var(--h))}}.lt-toggle4{animation:lt-track4 9s linear infinite}.lt-toggle4>span{animation:lt-knob4 9s var(--ease-soft) infinite}@keyframes lt-track4{0%,74%{background-color:var(--color-ink-700)}77%,to{background-color:var(--color-brand-500)}}@keyframes lt-knob4{0%,74%{transform:translate(0)}77%,to{transform:translate(14px)}}[data-live-tiles]:hover *,[data-live-tiles]:hover .lt-stage:before,[data-shots-paused] [data-live-tiles] *,[data-shots-paused] [data-live-tiles] .lt-stage:before{animation-play-state:paused}@media(prefers-reduced-motion:reduce){[data-live-tiles] *,[data-live-tiles] .lt-stage:before{animation:none}.live-tile:hover{translate:none}}
/*# sourceMappingURL=/cdn/shop/t/28/assets/component-live-tiles.css.map */