/* A gallery-first Foundry library, informed by the approved layout references. */
:root{--paper:#080909;--ink:#eeefed;--muted:#8c8e8d;--line:#242525;--orange:#b6f7ee;color-scheme:dark}html{scroll-padding-top:105px;scroll-behavior:smooth}body{background:#080909;color:#eeefed}button,a,input,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #b6f7ee;outline-offset:5px}.library-page>.hero,.library-page>.ticker,.library-page>.orbital-feature,.library-page>.sequence-feature,.library-page>.jopo-release,.library-page>#golden-circuit,.library-page>.how,.library-page>.end{display:none!important}
.library-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:24px;height:98px;margin:0;padding:16px max(4vw,calc((100vw - 1400px)/2));background:#080909e8;backdrop-filter:blur(20px);border-bottom:1px solid #ffffff0b}.library-header .brand{white-space:nowrap;font-size:17px;gap:13px;letter-spacing:-.6px}.library-header .mark{width:44px;height:44px;border-radius:11px;background:#151918;border:1px solid #363d39;color:#b6f7ee;font-size:32px}.library-search{flex:1;max-width:780px;display:flex;align-items:center;gap:13px;height:54px;margin-left:auto;padding:0 17px;background:linear-gradient(#181a19,#131514);border:1px solid #2c302e;border-radius:13px;box-shadow:inset 0 1px #ffffff08}.library-search svg{width:21px;height:21px;fill:none;stroke:#929895;stroke-width:1.7;flex:none}.library-search input{border:0;outline:0;background:none;width:100%;font:15px Manrope,Arial,sans-serif;color:#f3f6f3;min-width:0}.library-search input::placeholder{color:#929895}.library-menu-button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;flex:none;width:54px;height:54px;padding:0;border:1px solid #2c302e;border-radius:13px;background:#141615;color:#ddd;cursor:pointer}.library-menu-button span{width:20px;height:1px;background:currentColor}.library-navigation{position:absolute;top:86px;right:4vw;width:260px;padding:10px;border:1px solid #303531;border-radius:15px;background:#151816;box-shadow:0 15px 50px #0009;display:grid!important;gap:3px}.library-navigation[hidden]{display:none!important}.library-navigation a,.library-navigation button{display:flex;justify-content:space-between;width:100%;padding:15px 13px;border:0;background:none;color:#d8ded9;text-align:left;font:13px Manrope,Arial,sans-serif;border-radius:8px}.library-navigation a:hover,.library-navigation button:hover{background:#252b26}.library-navigation #saved-count{background:#313a33;color:#b6f7ee;padding:1px 7px;border-radius:10px}
.collection{padding:0;margin:0 auto;max-width:1400px;background:none}.library-intro{text-align:center;padding:44px 20px 37px}.library-count{display:inline-flex;border:1px solid #303531;background:linear-gradient(#1c201e,#101211);border-radius:30px;padding:9px 17px;color:#9fa6a0;font-size:11px;box-shadow:inset 0 1px #ffffff0a}.library-intro h1{font:400 clamp(32px,3.8vw,56px)/1.16 Manrope,Arial,sans-serif;letter-spacing:-2.2px;margin:25px 0 14px}.library-intro>p{font-size:13px;color:#909991;margin:0}.tools{margin:0 4vw;padding:0;border:0;display:block}.library-tabs{display:grid;grid-template-columns:repeat(6,1fr);width:min(920px,100%);padding:6px;background:#0c0e0d;border:1px solid #252926;border-radius:14px;gap:4px;margin:0 auto}.library-tabs button{border:0;border-radius:9px;background:none;padding:15px 12px;color:#959d97;font-size:13px;cursor:pointer;white-space:nowrap}.library-tabs button.active{background:linear-gradient(#262b27,#202521);color:#f2f6f2;box-shadow:inset 0 1px #ffffff0c}.library-refine{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:32px 4vw 0;padding:23px 0;border-top:1px solid #202521;border-bottom:1px solid #202521}.library-tones{display:flex;align-items:center;gap:9px}.library-tones>span{font-size:9px;letter-spacing:1.6px;color:#737e75;margin-right:5px}.library-tones button{font:12px Manrope,Arial,sans-serif;color:#a2aca4;border:1px solid #252b26;background:#131713;padding:10px 15px;border-radius:10px;cursor:pointer}.library-tones button[aria-pressed=true]{color:#b6f7ee;border-color:#6c9b8f;background:#1d2d25}.library-selects{display:flex;gap:9px}.library-selects select{font:12px Manrope,Arial,sans-serif;max-width:160px;background:#101410;color:#9da89f;border:1px solid #2c342d;border-radius:10px;padding:10px 28px 10px 12px;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.library-results{display:flex;align-items:center;justify-content:space-between;margin:20px 4vw 0;min-height:24px;font-size:10px;color:#849188}.library-results button{color:#b6f7ee;background:none;border:0;font:11px Manrope,Arial,sans-serif;cursor:pointer}.library-results [hidden]{display:none!important}
.grid{padding:14px 4vw 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27px 25px}.library-group-label{grid-column:1/-1;display:flex;align-items:center;gap:15px;margin:7px 0 0;color:#8b978e;font-size:10px;letter-spacing:1.5px}.library-group-label i{height:1px;background:#252d26;flex:1}.card{min-width:0}.card-preview{border:1px solid #232c25;border-radius:13px;background:#101710;aspect-ratio:1.32;box-shadow:0 0 0 1px #ffffff02;isolation:isolate}.card-preview:hover{border-color:#678075}.card-preview canvas{width:100%;height:100%}.card-preview>.favourite{z-index:3;right:10px;top:10px;width:30px;height:30px;border-radius:50%;font-size:17px;color:#dce8df;background:#101a15ad;border-color:#ffffff35}.card-preview>.open-effect{opacity:1;transform:none;z-index:2;background:#131b16d4;color:#b6f7ee;border:1px solid #b6f7ee44;right:12px;bottom:12px;width:31px;height:31px;backdrop-filter:blur(5px)}.card-tag{z-index:2;left:12px;top:12px;font-size:8px;text-transform:none;color:#e9d6aa;background:#241e15d9;padding:5px 8px;border:1px solid #a7916155;border-radius:20px;letter-spacing:0}.card-meta{padding:13px 4px 0;gap:12px;align-items:flex-start}.card h3{font-size:16px;line-height:1.3;margin-bottom:6px}.card-title{display:block;text-align:left;padding:0;margin:0;border:0;background:none;color:#e1e9e3;font:inherit;letter-spacing:-.35px;cursor:pointer}.card p{color:#76867b;font-size:10px;line-height:1.4}.library-card-badge{display:inline-flex;align-items:center;gap:5px;flex:none;font-size:9px;color:#a9c4b4;padding:5px 9px;border:1px solid #314237;border-radius:30px;background:#152019}.library-card-badge:before{content:'';width:4px;height:4px;background:#a5dcc1;border-radius:50%}.card[data-effect-id="16"] .library-card-badge{color:#d8bc82;border-color:#51452d;background:#211d14}.card[data-effect-id="16"] .library-card-badge:before{background:#d8bc82}.collection-footer{margin:42px 4vw 0;border-color:#263128;padding:23px 0;font-size:9px;color:#738279;align-items:center}.library-help-link{padding:0;border:0;background:none;color:#9fb0a4;font:11px Manrope,Arial,sans-serif;cursor:pointer}.library-page+footer{border-top:1px solid #1d261f;margin-top:35px;min-height:115px}.library-page+footer>span{display:none}#empty{padding:60px 20px}#library-help{max-width:520px;padding:35px;border:1px solid #354039;border-radius:18px;background:#111813;color:#e4eee7}#library-help h2{font-size:38px;letter-spacing:-1px;margin:20px 0 30px}#library-help ol{padding-left:20px}#library-help li{padding:0 0 23px 8px}#library-help strong{font-size:16px}#library-help p{font-size:12px;color:#91a397;line-height:1.7;margin-top:7px}.library-help-close{position:absolute;right:20px;top:18px;border:0;background:none;color:#a4baad;font-size:27px;cursor:pointer}
@media(min-width:1500px){.tools,.library-refine,.library-results,.collection-footer{margin-left:0;margin-right:0}.grid{padding-left:0;padding-right:0}}
@media(max-width:750px){html{scroll-padding-top:90px}.library-header{height:84px;padding:14px 4vw;gap:12px}.library-header .brand{gap:0}.library-brand-name{display:none}.library-header .mark{width:43px;height:45px;font-size:32px}.library-search{height:45px;border-radius:11px;gap:9px;padding:0 12px}.library-search input{font-size:13px}.library-search svg{width:18px;height:18px}.library-menu-button{width:43px;height:45px;border-radius:11px}.library-navigation{top:74px}.library-intro{padding:26px 16px 25px}.library-count{font-size:10px;padding:8px 14px}.library-intro h1{font-size:29px;letter-spacing:-1.3px;margin:22px auto 12px;max-width:350px}.library-intro>p{font-size:11px}.library-tabs{grid-template-columns:repeat(3,1fr);border-radius:12px}.library-tabs button{padding:12px 5px;font-size:11px}.library-refine{margin-top:21px;padding:17px 0;gap:13px;flex-wrap:wrap}.library-tones{gap:7px}.library-tones>span{font-size:8px;margin-right:1px}.library-tones button{padding:9px 12px;font-size:11px}.library-selects{gap:7px;margin-left:auto}.library-selects select{font-size:10px;padding:9px 18px 9px 8px;max-width:127px}.library-results{margin-top:13px;font-size:9px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 16px;padding-top:8px}.library-group-label{font-size:9px;letter-spacing:1.1px;gap:10px;margin:0}.card:not(.library-small-card){grid-column:1/-1}.card-preview{border-radius:10px;aspect-ratio:1.34}.card-meta{padding:11px 3px 0;gap:7px}.card h3{font-size:14px;letter-spacing:-.4px;line-height:1.35;margin-bottom:4px}.card p{font-size:9px}.library-card-badge{font-size:8px;padding:4px 7px}.card-preview>.favourite{width:27px;height:27px;right:7px;top:7px;font-size:15px}.card-preview>.open-effect{width:27px;height:27px;right:9px;bottom:9px;font-size:15px}.library-small-card .card-meta{flex-wrap:wrap;gap:5px}.library-small-card h3{font-size:13px}.library-small-card .card-meta>div{width:100%}.library-small-card .card-meta p{display:none}.library-small-card .library-card-badge{padding:3px 7px}.collection-footer{font-size:7px;letter-spacing:.6px;margin-top:30px;gap:15px}.collection-footer .library-help-link{font-size:10px}.library-page+footer{padding:27px 0;display:block}.library-page+footer .brand{font-size:15px}.library-page+footer p{font-size:9px;margin-top:16px}#library-help{padding:28px;width:92vw}}
@media(max-width:380px){.library-refine{display:block}.library-selects{margin-top:13px}.library-selects label{flex:1}.library-selects select{max-width:none;width:100%}.library-intro h1{font-size:27px}}
/* Override the previous six-column showcase rules with the library's card grid. */
.grid>.card,.grid>.card:has(.website-preview){grid-column:auto}.grid>.card .card-preview{height:auto;min-height:0}@media(max-width:750px){.grid>.card.library-small-card,.grid>.card.library-small-card:has(.website-preview){grid-column:auto}.grid>.card:not(.library-small-card),.grid>.card:not(.library-small-card):has(.website-preview){grid-column:1/-1}}
.grid>.card .card-preview{width:100%;max-width:100%;height:auto!important}.grid>.card .website-preview{padding:18px 16px!important}.card:has(.website-preview) h3{font-size:16px}.card:has(.website-preview) p{font-size:10px}@media(max-width:750px){.grid>.card .website-preview{padding:9px 8px!important}.library-small-card:has(.website-preview) h3{font-size:13px}.library-small-card .card-preview .device-shell{max-width:80%;height:100%;}.library-small-card .card-preview .device-screen{overflow:hidden}}
@media(min-width:751px){.grid{grid-template-columns:repeat(12,minmax(0,1fr))}.grid>.card,.grid>.card:has(.website-preview){grid-column:span 4}.grid>.card.library-small-card,.grid>.card.library-small-card:has(.website-preview){grid-column:span 3}}@media(min-width:751px) and (max-width:1050px){.grid>.card,.grid>.card:has(.website-preview),.grid>.card.library-small-card,.grid>.card.library-small-card:has(.website-preview){grid-column:span 6}}
/* One device vocabulary for every effect, independent of the visitor's phone/laptop. */
.library-results{gap:15px;flex-wrap:wrap}.library-device{display:flex;gap:3px;padding:4px;border:1px solid #303b33;background:#111713;border-radius:10px;margin-right:auto}.library-device button{font:11px Manrope,Arial,sans-serif;padding:8px 14px;border:0;border-radius:6px;color:#9cad9f;background:none;cursor:pointer}.library-device button[aria-pressed=true]{background:#29372e;color:#c4f8e2}.library-results>span{margin-left:auto}.grid>.card .card-preview{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 80%,#1b2721,#0c120f 70%);padding:18px 20px!important;contain:layout paint}.grid>.card .device-shell{width:92%!important;max-width:92%!important;height:auto!important;flex:none;pointer-events:none;margin:0 auto 10px;padding:7px 7px 12px;border-radius:10px 10px 5px 5px;box-shadow:0 12px 20px -8px #000b}.grid>.card .device-screen{aspect-ratio:16/10;height:auto!important;overflow:hidden;background:#070b09}.grid>.card .device-screen>canvas,.grid>.card .device-screen>video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.grid>.card .device-screen>iframe{transition:opacity .25s ease;pointer-events:none;z-index:1}.library-screen-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.library-golden-video{z-index:1}.grid>.card .device-shell[data-device=mobile]{height:91%!important;width:auto!important;max-width:55%!important;aspect-ratio:1/2;box-sizing:border-box;padding:6px!important;border-radius:20px!important;margin:0!important}.grid>.card .device-shell[data-device=mobile] .device-screen{height:100%!important;aspect-ratio:auto;border-radius:14px}.grid>.card .device-shell[data-device=mobile]:before{top:9px;height:7px}.grid>.card .device-shell[data-device=mobile] .device-base{top:35%;height:22px}.grid>.card .device-shell:not([data-device=mobile]) .device-base{height:8px;bottom:-7px}.grid>.card .device-shell:not([data-device=mobile]) .device-base:after{height:3px}.grid>.card .device-shell:before{width:3px;height:3px;top:2px}.grid>.card .device-shell[data-device=mobile] .library-golden-video{display:none}.grid>.card .device-shell[data-device=mobile] .library-screen-poster{object-fit:cover}.grid>.card .device-screen>video{pointer-events:none}
@media(max-width:750px){.library-device button{font-size:10px;padding:7px 11px}.library-device{margin-right:0}.grid>.card .card-preview{padding:13px 13px!important}.grid>.card .device-shell{width:94%!important;max-width:94%!important;padding:4px 4px 7px}.grid>.card .device-shell[data-device=mobile]{max-width:60%!important;height:91%!important;padding:4px!important;border-radius:14px!important}.grid>.card .device-shell[data-device=mobile] .device-screen{border-radius:10px}.grid>.card .device-shell[data-device=mobile]:before{top:6px;height:5px}.grid>.card .device-shell:not([data-device=mobile]) .device-base{height:5px;bottom:-4px}.library-small-card .card-preview{padding:10px 11px!important}}