.folder-appearance-menu {position:fixed;z-index:10020;width:320px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;box-sizing:border-box;padding:12px;background:var(--surface,#1b1e26);color:var(--text,#eee);border:1px solid var(--line,#434650);border-radius:6px;box-shadow:0 12px 45px #0006;font-size:12px}
.appearance-menu-heading {display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:12px}
.appearance-menu-heading button {display:grid;place-items:center;border:0;background:none;color:var(--muted,#aaa);width:24px;height:24px;padding:0;cursor:pointer}
.appearance-menu-heading svg {width:16px;height:16px}
.appearance-colors {display:grid;gap:6px}
.appearance-colors > div {display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}
.appearance-colors button {width:100%;aspect-ratio:1;max-height:25px;border:1px solid #8885;border-radius:3px;padding:0;background:var(--swatch);cursor:pointer}
.appearance-colors button[aria-pressed=true] {outline:2px solid var(--text,#fff);outline-offset:2px}
.appearance-designs {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:16px}
.appearance-designs button {height:55px;position:relative;isolation:isolate;overflow:hidden;cursor:pointer;border:1px solid var(--line,#555);border-radius:4px;color:var(--text,#eee);padding:5px;text-align:left;box-sizing:border-box}
.appearance-designs small {font-size:9px;position:absolute;bottom:5px;left:5px;z-index:1;text-shadow:0 1px 3px var(--surface,#111)}
.appearance-designs button[aria-pressed=true] {outline:2px solid var(--folder-color);outline-offset:2px}
.appearance-design-lines {display:block;width:55%;height:3px;background:currentColor;opacity:.3;box-shadow:0 7px currentColor;margin-top:3px;pointer-events:none}
.folder-appearance-menu footer {display:flex;justify-content:space-between;gap:8px;margin-top:15px}
.folder-appearance-menu footer button {display:flex;align-items:center;justify-content:center;gap:5px;min-height:32px;padding:5px 10px;border:1px solid var(--line,#555);border-radius:3px;background:transparent;color:inherit;font:inherit;cursor:pointer}
.folder-appearance-menu footer svg {width:15px;height:15px}
.folder-appearance-menu footer [data-appearance-confirm] {background:color-mix(in srgb,var(--folder-color) 15%,transparent);border-color:color-mix(in srgb,var(--folder-color) 60%,transparent)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect][data-effect] {--effect-tint:color-mix(in srgb,var(--folder-color) 20%,transparent);--effect-base:var(--surface,#191c23);border-color:color-mix(in srgb,var(--folder-color) 35%,var(--line,#444));background:linear-gradient(145deg,color-mix(in srgb,var(--folder-color) 10%,var(--effect-base)),var(--effect-base) 72%);background-size:auto;box-shadow:none;animation:none}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=aurora][data-effect] {background:linear-gradient(125deg,var(--effect-tint),transparent 40%,var(--effect-tint) 70%,transparent),var(--effect-base);background-size:250% 250%;animation:appearance-drift 10s ease-in-out infinite alternate}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=border][data-effect] {border-color:var(--folder-color);box-shadow:inset 2px 0 12px var(--effect-tint);animation:appearance-border 5s ease-in-out infinite}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=wash][data-effect] {background:color-mix(in srgb,var(--folder-color) 22%,var(--effect-base))}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=pulse][data-effect] {animation:appearance-pulse 4s ease-in-out infinite}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=stripe][data-effect] {background:repeating-linear-gradient(135deg,transparent 0 14px,var(--effect-tint) 14px 16px),var(--effect-base)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=scan][data-effect] {background:linear-gradient(0deg,transparent 40%,var(--effect-tint) 50%,transparent 60%),var(--effect-base);background-size:100% 200%;animation:appearance-scan 5s linear infinite}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=halo][data-effect] {border-color:var(--folder-color);box-shadow:0 0 14px var(--effect-tint),inset 0 0 18px var(--effect-tint)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=surge][data-effect] {background:repeating-linear-gradient(0deg,transparent 0 5px,var(--effect-tint) 6px 8px),linear-gradient(115deg,var(--effect-tint),transparent 65%),var(--effect-base);background-size:100% 40px,100% 100%;border-color:var(--folder-color);animation:appearance-surge 2s linear infinite}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=prism][data-effect] {background:repeating-linear-gradient(135deg,var(--effect-base) 0 22px,color-mix(in srgb,var(--folder-color) 40%,var(--effect-base)) 24px 35px,var(--effect-base) 38px 60px);background-size:170px 170px;border-color:var(--folder-color);animation:appearance-prism 6s linear infinite}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=edge][data-effect] {box-shadow:inset 0 3px var(--folder-color);background:var(--effect-base)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=dots][data-effect] {background:radial-gradient(circle,var(--effect-tint) 1px,transparent 1.5px) 0 0/9px 9px,var(--effect-base)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=glass][data-effect] {background:linear-gradient(160deg,color-mix(in srgb,var(--folder-color) 30%,transparent),transparent 49%,#ffffff0a 50%,transparent 53%),var(--effect-base);box-shadow:inset 0 1px #ffffff35,inset 0 -1px var(--effect-tint)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=rays][data-effect] {background:repeating-conic-gradient(from 35deg at 100% 0%,var(--effect-tint) 0deg 4deg,transparent 4deg 15deg),var(--effect-base)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=circuit][data-effect] {background:linear-gradient(90deg,var(--effect-tint) 1px,transparent 1px),linear-gradient(0deg,var(--effect-tint) 1px,transparent 1px),var(--effect-base);background-size:23px 17px;box-shadow:inset 3px 0 var(--folder-color)}
:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect=flow][data-effect] {background:linear-gradient(110deg,transparent 20%,var(--effect-tint) 42%,color-mix(in srgb,var(--folder-color) 40%,transparent) 50%,var(--effect-tint) 58%,transparent 80%),var(--effect-base);background-size:300% 100%;animation:appearance-drift 4s linear infinite alternate}
@keyframes appearance-drift {from{background-position:0% 0%}to{background-position:100% 100%}}
@keyframes appearance-scan {from{background-position:0 200%}to{background-position:0 0%}}
@keyframes appearance-border {50%{border-color:color-mix(in srgb,var(--folder-color) 65%,white);box-shadow:inset 3px 0 20px var(--effect-tint)}}
@keyframes appearance-pulse {50%{box-shadow:0 0 18px var(--effect-tint),inset 0 0 28px var(--effect-tint)}}
@keyframes appearance-surge {to{background-position:0 40px,0 0}}
@keyframes appearance-prism {to{background-position:170px 170px}}
@media(prefers-reduced-motion:reduce){:is(.folder-card,.lab-category-head,.appearance-designs button)[data-effect][data-effect]{animation:none!important}}
