.folder-float{--ff-w:260px;--ff-h:170px;--ff-r:18px;--ff-tab:18px;--ff-back:hsl(var(--reel-bone));--ff-front:#2a303c;--ff-paper:hsl(var(--reel-ink-deep));--ff-item:hsl(var(--background));--ff-item-ink:hsl(var(--reel-bone));--ff-label:hsl(var(--reel-ink));--ff-spread:160px;--ff-lift:30px;--ff-angle:34deg;--ff-rest:14deg;--ff-open:.52s;--ff-close:.312s;--ff-stagger:55ms;--ff-n:3;--ff-spring:cubic-bezier(.34, 1.38, .64, 1);--ff-ease-out:cubic-bezier(.23, 1, .32, 1);width:var(--ff-w);padding-top:var(--ff-tab);isolation:isolate;font-family:inherit;line-height:1;display:inline-block;position:relative}.folder-float__stage{min-height:var(--ff-h);transition:min-height var(--ff-open) var(--ff-ease-out);justify-content:center;align-items:flex-end;display:flex;position:relative}.folder-float[data-open] .folder-float__stage{min-height:calc(var(--ff-h) + 760px)}.folder-float__folder{width:var(--ff-w);height:var(--ff-h);z-index:3;position:relative}.folder-float__back{z-index:0;border-radius:var(--ff-r);background:var(--ff-back);box-shadow:var(--shadow-lg);transform-origin:50% 100%;position:absolute;inset:0;transform:perspective(600px)rotateX(8deg)}.folder-float__back:before{content:"";top:calc(-1 * var(--ff-tab));width:42%;height:calc(var(--ff-tab) + var(--ff-r));border-radius:var(--ff-r) var(--ff-r) 0 0;background:inherit;position:absolute;left:0}.folder-float__paper{z-index:1;background:var(--ff-paper);opacity:0;height:52%;transition:transform var(--ff-close) var(--ff-ease-out),opacity var(--ff-close) ease;border-radius:8px;position:absolute;top:10%;left:8%;right:8%;transform:translateY(12px)}.folder-float__front{z-index:2;box-sizing:border-box;border-radius:var(--ff-r);background:linear-gradient(180deg,color-mix(in srgb,var(--ff-front) 92%,white),var(--ff-front) 60%);height:76%;color:var(--ff-label);transform:perspective(600px) rotateX(calc(-1 * var(--ff-rest)));transform-origin:50% 100%;transition:transform var(--ff-open) var(--ff-ease-out);flex-direction:column;justify-content:flex-end;gap:7px;padding:20px;display:flex;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -10px 24px #0a0c1047}.folder-float__label{font-size:15px;font-weight:650}.folder-float__sub{opacity:.62;font-size:11px}.folder-float__trigger{z-index:4;border-radius:var(--ff-r);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;outline:none;height:76%;position:absolute;inset:auto 0 0}.folder-float__trigger:focus-visible{box-shadow:0 0 0 3px hsl(var(--reel-crimson) / .45)}.folder-float[data-open] .folder-float__front{transform:perspective(600px) rotateX(calc(-1 * var(--ff-angle)))}.folder-float[data-open] .folder-float__paper{opacity:1;transition:transform var(--ff-open) var(--ff-ease-out),opacity .2s ease;transform:translateY(0)}.folder-float__items{bottom:calc(var(--ff-h) - 10px);z-index:2;width:0;height:0;position:absolute;left:50%}.folder-float__item{border:1px solid var(--reel-hairline-strong);background:var(--ff-item);width:min(280px,100vw - 48px);color:var(--ff-item-ink);box-shadow:var(--shadow-lg);text-align:left;opacity:0;transform-origin:50%;pointer-events:none;transition:transform var(--ff-close) var(--ff-ease-out),opacity .16s ease;border-radius:14px;padding:16px;position:absolute;top:0;left:50%;transform:translate(-50%,44px)scale(.72)}.folder-float[data-open] .folder-float__item{opacity:1;transform:translate(calc(-50% + var(--x)),var(--y)) rotate(var(--r)) scale(1);pointer-events:auto;transition:transform var(--ff-open) var(--ff-spring) calc(var(--i) * var(--ff-stagger)),opacity .16s ease calc(var(--i) * var(--ff-stagger))}.folder-float[data-live] .folder-float__item{cursor:grab;transition:box-shadow .16s}.folder-float__item[data-drag]{cursor:grabbing;box-shadow:0 24px 60px -18px #1f2c4761}@media(min-width:640px){.folder-float[data-open] .folder-float__stage{min-height:calc(var(--ff-h) + 280px)}.folder-float__item{width:300px}}@media(prefers-reduced-motion:reduce){.folder-float__front,.folder-float__paper,.folder-float__item,.folder-float__stage{transition:opacity .2s!important}.folder-float[data-open] .folder-float__front{transform:perspective(600px) rotateX(calc(-1 * var(--ff-rest)))}.folder-float__paper{transform:none!important}}
