.film-reel.svelte-1hwhvrb{position:relative;width:100%;overflow:hidden;border-radius:4px;--stock: oklch(.29 .012 300);background:linear-gradient(180deg,oklch(from var(--stock) calc(l + .09) c h) 0%,oklch(from var(--stock) calc(l - .03) c h) 9%,var(--stock) 50%,oklch(from var(--stock) calc(l - .04) c h) 91%,oklch(from var(--stock) calc(l + .07) c h) 100%);box-shadow:inset 0 1px #ffffff1f,inset 0 -1px #ffffff12,0 10px 40px #0000008c;cursor:grab;touch-action:pan-y}.film-reel.svelte-1hwhvrb:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.05}.film-reel.svelte-1hwhvrb:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 32%,oklch(1 0 0 / .055) 46%,oklch(1 0 0 / .015) 54%,transparent 68%)}.film-reel.dragging.svelte-1hwhvrb{cursor:grabbing;-webkit-user-select:none;user-select:none}.strip.svelte-1hwhvrb{display:flex;flex-direction:column;gap:6px;width:max-content;padding:8px 0;will-change:transform}.perforations.svelte-1hwhvrb{height:12px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='12'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23cbc6b6'/%3E%3Cstop offset='1' stop-color='%23f6f1e2'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='11.5' y='1.4' width='23' height='9.2' rx='3.1' fill='rgb(0 0 0 / 0.5)'/%3E%3Crect x='12' y='2.2' width='22' height='8' rx='2.6' fill='url(%23g)'/%3E%3Crect x='13' y='10.7' width='20' height='0.9' rx='0.45' fill='rgb(255 255 255 / 0.16)'/%3E%3C/svg%3E");background-size:var(--perf-pitch) 12px;background-repeat:repeat-x}.frames.svelte-1hwhvrb,.copy.svelte-1hwhvrb{display:flex;gap:4px}.frame.svelte-1hwhvrb{flex:0 0 auto;margin:0;height:var(--reel-height);background:#05050a;border:0;padding:0;position:relative;overflow:hidden;border-radius:1.5px;box-shadow:inset 0 0 0 1px #000000d9,0 0 0 1px #ffffff0f}.frame.svelte-1hwhvrb img:where(.svelte-1hwhvrb){height:100%;width:auto;display:block;object-fit:cover;-webkit-user-drag:none}.frame-button.svelte-1hwhvrb{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;color:inherit;cursor:pointer;transition:transform .2s ease}.film-reel.dragging.svelte-1hwhvrb .frame-button:where(.svelte-1hwhvrb){cursor:grabbing}.frame-button.svelte-1hwhvrb:hover{transition-duration:0s;transform:scale(1.04);z-index:2}.frame-button.svelte-1hwhvrb:focus-visible{outline:2px solid #00d6ff;outline-offset:2px}figcaption.svelte-1hwhvrb,.frame.svelte-1hwhvrb .caption:where(.svelte-1hwhvrb){position:absolute;bottom:0;left:0;right:0;padding:.2rem .5rem;background:linear-gradient(transparent,#000c);color:#fff;font-family:var(--font-mono);font-size:.7rem;opacity:0;transition:opacity .2s ease}.frame.svelte-1hwhvrb:hover figcaption:where(.svelte-1hwhvrb),.frame.svelte-1hwhvrb:hover .caption:where(.svelte-1hwhvrb){transition-duration:0s;opacity:1}@media(hover:none){figcaption.svelte-1hwhvrb,.frame.svelte-1hwhvrb .caption:where(.svelte-1hwhvrb){opacity:1}}
