@layer properties,theme,base;@layer components{.ca-pocket{--pk-lip:38cqw;--pk-back:34.5cqw;--pk-radius:6.5cqw;--pk-card-w:80cqw;--pk-notch-r:7.5cqw;--pk-notch-o:2.6cqw;--pk-blur:1.5cqw;--pk-open:0;--pk-spring:cubic-bezier(.34, 1.26, .64, 1);--pk-base:color-mix(in oklab, var(--sunken) 55%, var(--surface));--pk-ghost-o:.74;--pk-ghost-fallback:var(--line-strong);--pk-veil-top:color-mix(in oklab, var(--surface) 22%, transparent);--pk-veil-bottom:color-mix(in oklab, var(--surface) 50%, transparent);--pk-rim:oklch(100% 0 0/.95);--pk-edge:color-mix(in oklab, var(--ink) 9%, transparent);--pk-lip-band:color-mix(in oklab, var(--ink) 7%, transparent);--pk-depth:color-mix(in oklab, var(--ink) 9%, transparent);--pk-sheen:oklch(100% 0 0/.42);--pk-sheen-2:oklch(100% 0 0/.2);--pk-shade:var(--ink);--pk-back-top:var(--sunken);--pk-back-fill:color-mix(in oklab, var(--sunken) 55%, var(--line));--pk-back-rim:oklch(100% 0 0/.85);--pk-ground:0 1px 1px oklch(23.5% .02 255/.05), 0 2.4cqw 5cqw -2.6cqw oklch(23.5% .02 255/.3);--pk-card-shadow:0 .15cqw .4cqw oklch(23.5% .02 255/.12), 0 1.4cqw 3cqw -1.2cqw oklch(23.5% .02 255/.32);isolation:isolate;aspect-ratio:100/84;transition:transform var(--dur-2) var(--ease-out);position:relative;container-type:inline-size}.ca-pocket:before{content:"";inset:var(--pk-back) 0 0;border-radius:var(--pk-radius);box-shadow:var(--pk-ground);pointer-events:none;position:absolute}.ca-pocket-back{inset:var(--pk-back) 1.2cqw 0;border-radius:calc(var(--pk-radius) - 1cqw) calc(var(--pk-radius) - 1cqw) var(--pk-radius) var(--pk-radius);background:linear-gradient(to bottom, var(--pk-back-top), var(--pk-back-fill) 9cqw);box-shadow:inset 0 1px 0 var(--pk-back-rim), inset 0 0 0 1px var(--pk-edge);position:absolute}.ca-pocket-card,.ca-pocket-ghost{width:var(--pk-card-w);border-radius:var(--card-radius);transform:translate(calc(var(--x) + var(--dx) * var(--pk-open)), calc(var(--y) - var(--rise) * var(--pk-open))) rotate(calc(var(--r) * (1 + .4 * var(--pk-open))));transition:transform .46s var(--pk-spring) calc(var(--i,0) * 24ms);position:absolute;top:0;left:0}.ca-pocket-card{box-shadow:var(--pk-card-shadow)}.ca-pocket-front{inset:var(--pk-lip) 0 0;border-radius:var(--pk-radius);background:linear-gradient(to bottom, color-mix(in oklab, var(--pk-base), var(--pk-shade) 7%), var(--pk-base) 45%);-webkit-mask-image:radial-gradient(circle var(--pk-notch-r) at 50% calc(-1 * var(--pk-notch-o)), transparent calc(100% - .5px), #000 calc(100% + .5px));-webkit-mask-image:radial-gradient(circle var(--pk-notch-r) at 50% calc(-1 * var(--pk-notch-o)), transparent calc(100% - .5px), #000 calc(100% + .5px));mask-image:radial-gradient(circle var(--pk-notch-r) at 50% calc(-1 * var(--pk-notch-o)), transparent calc(100% - .5px), #000 calc(100% + .5px));position:absolute;overflow:hidden}.ca-pocket-ghosts{top:calc(-1 * var(--pk-lip));width:100cqw;height:84cqw;opacity:var(--pk-ghost-o);position:absolute;left:0}.ca-pocket-ghost{aspect-ratio:1536/969;background:var(--dom,var(--pk-ghost-fallback));filter:blur(var(--pk-blur)) saturate(1.4)}.ca-pocket-ghost img{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block}.ca-pocket-front:before{content:"";z-index:1;background:linear-gradient(to bottom, var(--pk-veil-top), var(--pk-veil-bottom));position:absolute;inset:0}.ca-pocket-sheen{z-index:2;background:linear-gradient(112deg, transparent 36%, var(--pk-sheen) 44%, transparent 51%, transparent 56%, var(--pk-sheen-2) 59%, transparent 63%);transition:transform .7s var(--ease-out);position:absolute;inset:-10% -50%;transform:translate(-5%)}.ca-pocket-front:after{content:"";z-index:3;border-radius:inherit;background:radial-gradient(circle var(--pk-notch-r) at 50% calc(-1 * var(--pk-notch-o)), transparent calc(100% - .5px), var(--pk-rim) calc(100% + .25px), var(--pk-rim) calc(100% + 1px), transparent calc(100% + 1.75px)), linear-gradient(to bottom, transparent 1px, var(--pk-lip-band) 1px, transparent 2.6cqw);box-shadow:inset 0 1px 0 var(--pk-rim), inset 0 0 0 1px var(--pk-edge), inset 0 -1.6cqw 3.2cqw -2.2cqw var(--pk-depth);position:absolute;inset:0}.ca-pocket-slot{inset:var(--pk-lip) 0 0;z-index:4;color:var(--ink-3);place-items:center;display:grid;position:absolute}.ca-pocket[data-size=sm]{--pk-ghost-o:.7;--pk-blur:3cqw}.ca-pocket[data-tint]{--pk-base:color-mix(in oklab, var(--pk-tint) 80%, var(--surface));--pk-veil-top:color-mix(in oklab, var(--pk-tint) 22%, transparent);--pk-veil-bottom:color-mix(in oklab, var(--pk-tint) 52%, transparent);--pk-back-top:color-mix(in oklab, var(--pk-tint) 45%, var(--sunken));--pk-back-fill:color-mix(in oklab, var(--pk-tint-deep) 22%, var(--sunken))}:root[data-theme=dark] .ca-pocket{--pk-base:color-mix(in oklab, var(--surface) 85%, var(--line));--pk-ghost-o:.66;--pk-ghost-fallback:var(--line-strong);--pk-veil-top:oklch(100% 0 0/.03);--pk-veil-bottom:oklch(100% 0 0/.07);--pk-rim:oklch(100% 0 0/.3);--pk-edge:oklch(100% 0 0/.07);--pk-lip-band:oklch(0% 0 0/.16);--pk-depth:oklch(0% 0 0/.32);--pk-shade:oklch(0% 0 0);--pk-sheen:oklch(100% 0 0/.09);--pk-sheen-2:oklch(100% 0 0/.05);--pk-back-top:var(--raised);--pk-back-fill:var(--surface);--pk-back-rim:oklch(100% 0 0/.12);--pk-ground:0 2.4cqw 6cqw -2cqw oklch(0% 0 0/.6);--pk-card-shadow:0 .15cqw .4cqw oklch(0% 0 0/.35), 0 1.4cqw 3.2cqw -1cqw oklch(0% 0 0/.6)}:root[data-theme=dark] .ca-pocket[data-tint]{--pk-base:color-mix(in oklab, var(--pk-tint-deep) 26%, color-mix(in oklab, var(--surface) 85%, var(--line)));--pk-veil-bottom:color-mix(in oklab, var(--pk-tint) 9%, transparent);--pk-back-top:color-mix(in oklab, var(--pk-tint-deep) 22%, var(--raised));--pk-back-fill:color-mix(in oklab, var(--pk-tint-deep) 16%, var(--surface))}@media (prefers-color-scheme:dark){:root:not([data-theme=light],[data-theme=dark]) .ca-pocket{--pk-base:color-mix(in oklab, var(--surface) 85%, var(--line));--pk-ghost-o:.66;--pk-ghost-fallback:var(--line-strong);--pk-veil-top:oklch(100% 0 0/.03);--pk-veil-bottom:oklch(100% 0 0/.07);--pk-rim:oklch(100% 0 0/.3);--pk-edge:oklch(100% 0 0/.07);--pk-lip-band:oklch(0% 0 0/.16);--pk-depth:oklch(0% 0 0/.32);--pk-shade:oklch(0% 0 0);--pk-sheen:oklch(100% 0 0/.09);--pk-sheen-2:oklch(100% 0 0/.05);--pk-back-top:var(--raised);--pk-back-fill:var(--surface);--pk-back-rim:oklch(100% 0 0/.12);--pk-ground:0 2.4cqw 6cqw -2cqw oklch(0% 0 0/.6);--pk-card-shadow:0 .15cqw .4cqw oklch(0% 0 0/.35), 0 1.4cqw 3.2cqw -1cqw oklch(0% 0 0/.6)}:root:not([data-theme=light],[data-theme=dark]) .ca-pocket[data-tint]{--pk-base:color-mix(in oklab, var(--pk-tint-deep) 26%, color-mix(in oklab, var(--surface) 85%, var(--line)));--pk-veil-bottom:color-mix(in oklab, var(--pk-tint) 9%, transparent);--pk-back-top:color-mix(in oklab, var(--pk-tint-deep) 22%, var(--raised));--pk-back-fill:color-mix(in oklab, var(--pk-tint-deep) 16%, var(--surface))}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){:where(a,button):hover .ca-pocket{--pk-open:1}:where(a,button):hover .ca-pocket-sheen{transform:translate(4%)}}@media (prefers-reduced-motion:no-preference){:where(a,button):focus-visible .ca-pocket{--pk-open:1}}@media (prefers-reduced-motion:reduce){.ca-pocket-card,.ca-pocket-ghost,.ca-pocket-sheen{transition:none}}.ca-folder{min-width:0;position:relative}.ca-folder[data-size=sm]{width:136px}.ca-folder-link{color:inherit;border-radius:var(--radius-md);-webkit-tap-highlight-color:transparent;outline:none;text-decoration:none;display:block}.ca-folder-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media (hover:none){.ca-folder-link:active .ca-pocket{transform:scale(var(--press-tile));transition-duration:var(--dur-1)}}.ca-folder-meta{align-items:baseline;gap:12px;margin-top:12px;padding-inline:2px;display:flex}.ca-folder-title{-webkit-line-clamp:2;line-clamp:2;overflow-wrap:anywhere;min-width:0;color:var(--ink);-webkit-box-orient:vertical;flex:1;font-size:14px;font-weight:500;line-height:20px;display:-webkit-box;overflow:hidden}.ca-folder-title[data-private]{position:relative}.ca-folder-title[data-private] .ca-folder-name{padding-left:17px}.ca-folder-lock{color:var(--ink-3);position:absolute;top:4px;left:0}.ca-folder-count{letter-spacing:-.02em;color:var(--ink-3);flex:none;font-size:20px;font-weight:450;line-height:20px}.ca-folder[data-size=sm] .ca-folder-meta{gap:8px;margin-top:8px;padding-inline:1px}.ca-folder[data-size=sm] .ca-folder-title{-webkit-line-clamp:1;line-clamp:1;font-size:13px;line-height:18px}.ca-folder[data-size=sm] .ca-folder-title[data-private] .ca-folder-name{padding-left:15px}.ca-folder[data-size=sm] .ca-folder-lock{top:3.5px}.ca-folder[data-size=sm] .ca-folder-count{font-size:15px;line-height:18px}}@layer utilities;
