.folder-float{--ff-w: 220px;--ff-h: 160px;--ff-r: 18px;--ff-tab: 16px;--ff-back: #312e81;--ff-front: #4f46e5;--ff-paper: #ffffff;--ff-item: #ffffff;--ff-item-ink: #0f172a;--ff-label: #ffffff;--ff-spread: 185px;--ff-lift: 34px;--ff-angle: 34deg;--ff-rest: 16deg;--ff-open: .46s;--ff-close: .38s;--ff-stagger: 32ms;--ff-n: 6;--ff-spring: cubic-bezier(.2, .95, .3, 1);--ff-ease-out: cubic-bezier(.16, 1, .3, 1);--ff-ease-in: cubic-bezier(.38, 0, .22, 1);--ff-pocket-y: calc(var(--ff-h) * .52);position:relative;display:inline-block;width:var(--ff-w);padding-top:var(--ff-tab);font-family:inherit;font-size:13px;font-weight:500;line-height:1;-moz-user-select:none;user-select:none;-webkit-user-select:none}.folder-float__folder{position:relative;width:var(--ff-w);height:var(--ff-h);cursor:pointer;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.folder-float:hover .folder-float__folder{transform:translateY(-2px)}.folder-float__back{position:absolute;inset:0;z-index:1;border-radius:var(--ff-r);background:var(--ff-back);transform:perspective(600px) rotateX(8deg);transform-origin:50% 100%;box-shadow:inset 0 2px 4px #ffffff26;filter:drop-shadow(0 20px 30px rgba(79,70,229,.28)) drop-shadow(0 8px 16px rgba(0,0,0,.12))}.folder-float__back:before{content:"";position:absolute;top:calc(-1 * var(--ff-tab));left:0;width:44%;height:calc(var(--ff-tab) + var(--ff-r));border-radius:var(--ff-r) var(--ff-r) 0 0;background:inherit;box-shadow:inset 0 2px 3px #fff3}.folder-float__paper{position:absolute;top:8%;z-index:2;right:8%;left:8%;height:52%;border-radius:8px;background:var(--ff-paper);opacity:0;transform:translateY(14px);box-shadow:0 4px 12px #00000014;transition:transform var(--ff-close) var(--ff-ease-out),opacity var(--ff-close) ease}.folder-float__paper:after{content:"";position:absolute;top:14px;left:14px;right:14px;height:4px;background:#e2e8f0;border-radius:2px;box-shadow:0 8px #f1f5f9,0 16px #f8fafc}.folder-float__front{position:absolute;right:0;bottom:0;left:0;z-index:4;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;height:76%;padding:16px 18px;box-sizing:border-box;border-radius:var(--ff-r);background:linear-gradient(135deg,#6366f1,#4f46e5,#4338ca);color:var(--ff-label);box-shadow:0 -8px 24px #00000038,inset 0 1px 1px #ffffff59;transform:perspective(600px) rotateX(calc(-1 * var(--ff-rest)));transform-origin:50% 100%;transition:transform var(--ff-close) var(--ff-ease-out)}.folder-float__icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;background:#fff3;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);margin-bottom:2px;box-shadow:0 4px 8px #0000001a}.folder-float__label{font-size:14px;font-weight:800;letter-spacing:-.01em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.15)}.folder-float__sub{font-size:11px;font-weight:600;color:#ffffffd9;display:flex;align-items:center;gap:4px}.folder-float__trigger{position:absolute;right:0;bottom:0;left:0;z-index:5;height:76%;margin:0;padding:0;border:0;border-radius:var(--ff-r);background:transparent;cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent}.folder-float[data-open] .folder-float__front{transform:perspective(600px) rotateX(calc(-1 * var(--ff-angle)));transition:transform var(--ff-open) var(--ff-ease-out)}.folder-float[data-open] .folder-float__paper{opacity:1;transform:translateY(0);transition:transform var(--ff-open) var(--ff-ease-out),opacity .2s ease}.folder-float__items{position:absolute;top:0;left:50%;z-index:3;width:0;height:0}.folder-float[data-trigger=hover][data-open] .folder-float__items:before{content:"";position:absolute;top:calc(-1 * (var(--ff-lift) + 180px));left:calc(-1 * (var(--ff-spread) + 120px));width:calc(2 * var(--ff-spread) + 240px);height:calc(var(--ff-lift) + 180px + 80px);background:transparent;z-index:0;pointer-events:auto}.folder-float[data-trigger=click] .folder-float__items:before{display:none}.folder-float__item{position:absolute;top:0;left:50%;margin:0;padding:0 14px;height:38px;box-sizing:border-box;border:1px solid rgba(226,232,240,.9);border-radius:20px;background:var(--ff-item);color:var(--ff-item-ink);font:inherit;font-size:12px;font-weight:700;line-height:1;white-space:nowrap;width:-moz-max-content;width:max-content;width:-moz-fit-content;width:fit-content;box-shadow:0 8px 20px -4px #0f172a1f,0 2px 6px -1px #0000000f;cursor:pointer;outline:none;opacity:0;visibility:hidden;transform:translate(calc(-50% + 0px),var(--ff-pocket-y)) rotate(0) scale(.45);transform-origin:50% 50%;pointer-events:none;-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;touch-action:manipulation;z-index:3;transition:transform var(--ff-close) var(--ff-ease-in) calc((var(--ff-n) - 1 - var(--i)) * var(--ff-stagger) * .5),opacity .18s ease calc((var(--ff-n) - 1 - var(--i)) * var(--ff-stagger) * .5 + var(--ff-close) * .35),visibility 0s linear calc(var(--ff-close) + (var(--ff-n) - 1) * var(--ff-stagger) * .5 + 40ms),border-color .15s ease,box-shadow .15s ease}.folder-float[data-open] .folder-float__item{opacity:1;visibility:visible;transform:translate(calc(-50% + var(--x)),var(--y)) rotate(var(--r)) scale(1);pointer-events:auto;z-index:10;transition:transform var(--ff-open) var(--ff-spring) calc(var(--i) * var(--ff-stagger)),opacity .22s ease-out calc(var(--i) * var(--ff-stagger)),visibility 0s linear 0s,border-color .15s ease,box-shadow .15s ease}.folder-float[data-live] .folder-float__item{cursor:grab;transition:scale .16s var(--ff-ease-out)}.folder-float__item[data-drag]{cursor:grabbing;z-index:50;box-shadow:0 16px 32px -4px #4f46e540,0 4px 12px #0000001a}@media(hover:hover)and (pointer:fine){.folder-float[data-open] .folder-float__item:hover{scale:1.07;z-index:20;border-color:#818cf8;box-shadow:0 12px 24px -4px #6366f138,0 4px 8px -2px #00000014}}.folder-float[data-open] .folder-float__item:active{scale:.96}.folder-float__item[data-pop]{animation:folder-float-pop .32s var(--ff-ease-out)}.folder-float__drift{display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;flex-shrink:0;animation:folder-float-drift 3.2s ease-in-out infinite;animation-delay:calc(var(--ff-open) + var(--i) * .12s);animation-play-state:paused}.folder-float[data-open] .folder-float__drift{animation-play-state:running}.folder-float[data-physics] .folder-float__drift,.folder-float[data-live] .folder-float__drift{animation:none}@keyframes folder-float-drift{0%,to{translate:0 0}50%{translate:0 -3px}}@keyframes folder-float-pop{30%{scale:1.15}to{scale:1}}@media(prefers-reduced-motion:reduce){.folder-float__front,.folder-float__paper{transition:opacity .2s ease}.folder-float[data-open] .folder-float__front{transform:perspective(600px) rotateX(calc(-1 * var(--ff-rest)))}.folder-float__paper{transform:none!important}.folder-float__item{transition:opacity .2s ease}.folder-float[data-open] .folder-float__item{transition:opacity .2s ease calc(var(--i) * var(--ff-stagger))}.folder-float__drift{animation:none}}@media(max-width:640px){.folder-float{--ff-w: 180px;--ff-h: 130px;--ff-r: 14px;--ff-spread: 120px;--ff-lift: 22px;font-size:11px}.folder-float__item{height:32px;font-size:10.5px;line-height:1;padding:0 11px;gap:6px;border-radius:16px;white-space:nowrap;width:-moz-max-content;width:max-content;width:-moz-fit-content;width:fit-content;box-sizing:border-box}.folder-float__drift{display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;flex-shrink:0}.folder-float__label{font-size:12px}.folder-float__sub{font-size:10px}.folder-float__icon{width:26px;height:26px;border-radius:8px}.folder-float__front{padding:12px 14px;gap:4px}}@media(max-width:380px){.folder-float{--ff-w: 160px;--ff-h: 116px;--ff-r: 12px;--ff-spread: 105px;--ff-lift: 18px;font-size:10px}.folder-float__item{height:29px;font-size:9.5px;line-height:1;padding:0 9px;gap:5px;border-radius:14px;white-space:nowrap;width:-moz-max-content;width:max-content;width:-moz-fit-content;width:fit-content;box-sizing:border-box}.folder-float__drift{display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;flex-shrink:0}}