.slide{--slide-h:44px;--slide-thumb:36px;--slide-inset:4px;--slide-ratio:0;--slide-travel:220ms;--slide-ease:cubic-bezier(.22,.75,.2,1);--slide-quiet:#ADA698;position:relative;isolation:isolate;display:block;box-sizing:border-box;width:100%;max-width:280px;height:var(--slide-h);margin:4px auto 2px;border-radius:999px;background:#eee9dd;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none;cursor:grab}.slide-fill{position:absolute;inset:0 auto 0 0;border-radius:999px;width:calc(var(--slide-thumb) + var(--slide-inset)*2 + (100% - var(--slide-thumb) - var(--slide-inset)*2)*var(--slide-ratio));background-color:var(--accent);opacity:min(1,calc(var(--slide-ratio)*4))}.slide-label{position:absolute;inset:0;display:block;padding:0 calc(var(--slide-inset)*3) 0 calc(var(--slide-thumb) + var(--slide-inset)*3);color:var(--muted);font-size:14px;font-weight:700;line-height:var(--slide-h);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:calc(1 - var(--slide-ratio)*1.6);pointer-events:none}.slide-thumb{position:absolute;top:var(--slide-inset);left:calc(var(--slide-inset) + (100% - var(--slide-thumb) - var(--slide-inset)*2)*var(--slide-ratio));display:grid;place-items:center;width:var(--slide-thumb);height:var(--slide-thumb);border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(60,50,35,.22),0 2px 5px rgba(60,50,35,.12);color:var(--accent);touch-action:none;cursor:grab;outline:0;transition:background-color .13s,color .13s,scale .13s}.slide-thumb:focus-visible{outline:1.5px solid var(--ink);outline-offset:2px}.slide[data-dragging] .slide-thumb{cursor:grabbing;scale:1.08}.slide[data-ready] .slide-thumb{background:var(--accent);color:#fff}.slide[disabled],.slide[disabled] .slide-thumb{touch-action:auto;cursor:default}.slide[disabled] .slide-label,.slide[disabled] .slide-thumb{color:var(--slide-quiet)}.slide:not([data-dragging]) .slide-label{transition:opacity var(--slide-travel) var(--slide-ease)}.slide:not([data-dragging])>.slide-fill{transition:width var(--slide-travel) var(--slide-ease),opacity var(--slide-travel) var(--slide-ease)}.slide:not([data-dragging]) .slide-thumb{transition:left var(--slide-travel) var(--slide-ease),background-color var(--slide-travel) ease,color var(--slide-travel) ease,scale .13s ease}.slide-sparks{position:absolute;inset:0;display:none;border-radius:inherit;pointer-events:none}.slide-sparks>i{position:absolute;left:var(--x);top:var(--y);width:0;height:0;font-style:normal;opacity:0}.slide-sparks>i::before{content:"\2726";position:absolute;left:0;top:0;color:#fff;font-size:var(--s);line-height:1;text-shadow:0 0 4px var(--accent),0 0 8px #fff;transform:translate(-50%,-50%)}.slide-sparks>i:first-child{--x:18%;--y:30%;--s:11px;--d:0s;--dx:-10px;--dy:-14px}.slide-sparks>i:nth-child(2){--x:32%;--y:72%;--s:8px;--d:.35s;--dx:-4px;--dy:16px}.slide-sparks>i:nth-child(3){--x:46%;--y:26%;--s:13px;--d:.7s;--dx:2px;--dy:-18px}.slide-sparks>i:nth-child(4){--x:58%;--y:68%;--s:9px;--d:.15s;--dx:6px;--dy:15px}.slide-sparks>i:nth-child(5){--x:70%;--y:34%;--s:12px;--d:.55s;--dx:10px;--dy:-16px}.slide-sparks>i:nth-child(6){--x:24%;--y:50%;--s:7px;--d:.9s;--dx:-14px;--dy:2px}.slide-sparks>i:nth-child(7){--x:62%;--y:46%;--s:7px;--d:.45s;--dx:16px;--dy:-2px}.slide[data-ready]>.slide-fill{background-image:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.6) 50%,transparent 68%);background-size:250% 100%;background-repeat:no-repeat;animation:1s linear infinite slide-gleam,.45s ease-out slide-charge-fill}.slide[data-ready]::after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none;animation:.52s ease-out forwards slide-charge}.slide[data-burst]>.slide-sparks,.slide[data-ready]>.slide-sparks{display:block}.slide[data-ready]>.slide-sparks>i{animation:slide-twinkle 1.1s ease-in-out var(--d) infinite}.slide[data-burst]:not([data-ready])>.slide-sparks{background-image:linear-gradient(100deg,transparent 30%,#e7bcae 50%,transparent 70%);background-size:250% 100%;background-repeat:no-repeat;animation:.6s ease-out forwards slide-flash}.slide[data-burst]:not([data-ready])>.slide-sparks>i{animation:.6s cubic-bezier(.2,.7,.3,1) forwards slide-burst}@keyframes slide-gleam{from{background-position:150% 0}to{background-position:-50% 0}}@keyframes slide-charge{0%{box-shadow:inset 0 0 0 0 rgba(255,255,255,0),inset 0 0 0 0 rgba(255,255,255,0)}30%{box-shadow:inset 0 0 0 3px #fff,inset 0 0 18px 4px rgba(255,255,255,.85)}100%{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7),inset 0 0 10px 1px rgba(255,255,255,.35)}}@keyframes slide-charge-fill{from{filter:brightness(1.6)}to{filter:brightness(1)}}@keyframes slide-twinkle{0%,100%{opacity:0;transform:scale(.2) rotate(0)}50%{opacity:1;transform:scale(1) rotate(45deg)}}@keyframes slide-flash{from{background-position:150% 0;opacity:1}to{background-position:-50% 0;opacity:0}}@keyframes slide-burst{0%{opacity:1;transform:translate(0,0) scale(.6) rotate(0)}40%{opacity:1;transform:translate(calc(var(--dx)*.6),calc(var(--dy)*.6)) scale(1.5) rotate(60deg)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3) rotate(120deg)}}@media (prefers-reduced-motion:reduce){.slide[data-ready]>.slide-fill{background-image:none;animation:none}.slide[data-ready]::after{animation:none}.slide[data-burst]>.slide-sparks,.slide[data-ready]>.slide-sparks{display:none}}