.filters-row{position:relative;z-index:5;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:0 0 18px}.project-filters{display:flex;flex-wrap:wrap;gap:8px}.filter-button{padding:12px 20px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:var(--card-bg);cursor:pointer;font:700 12px Be Vietnam Pro,sans-serif;transition:color .25s var(--ease-smooth),background .25s var(--ease-smooth),border-color .25s var(--ease-smooth),transform .25s var(--ease-smooth),box-shadow .25s var(--ease-smooth)}.filter-button:hover{color:var(--blue);border-color:#9fe0e8;transform:translateY(-2px);box-shadow:0 6px 14px #0a92b01f}.filter-button.is-active{color:#fff;border-color:transparent;background:var(--gradient-brand);background-size:200% 100%;background-position:0 0;box-shadow:0 8px 18px #0a92b038}.filter-button.is-active:hover{background-position:100% 0;transform:translateY(-2px);box-shadow:0 10px 22px #12b98142}.filter-dropdowns{display:flex;flex-wrap:wrap;gap:8px}.dropdown-filter{position:relative}.dropdown-filter-toggle{display:flex;align-items:center;gap:8px;padding:12px 20px;border:1px solid var(--line);border-radius:999px;color:var(--muted);background:var(--card-bg);cursor:pointer;font:700 12px Be Vietnam Pro,sans-serif;transition:color .25s var(--ease-smooth),background .25s var(--ease-smooth),border-color .25s var(--ease-smooth),transform .25s var(--ease-smooth),box-shadow .25s var(--ease-smooth)}.dropdown-filter-toggle:hover{color:var(--blue);border-color:#9fe0e8;transform:translateY(-2px);box-shadow:0 6px 14px #0a92b01f}.dropdown-filter-toggle:focus-visible{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px #0a92b029}.dropdown-filter.is-open .dropdown-filter-toggle{color:#fff;border-color:transparent;background:var(--gradient-brand);box-shadow:0 8px 18px #0a92b038;transform:translateY(-2px)}.dropdown-filter-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:30;width:max-content;min-width:190px;max-width:min(240px,calc(100vw - 48px));margin:0;padding:6px;list-style:none;border:1px solid var(--line);border-radius:14px;background:var(--card-bg);box-shadow:0 18px 40px #0a283229;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px) scale(.96);transform-origin:top right;transition:opacity .22s var(--ease-smooth),transform .22s var(--ease-smooth),visibility 0s linear .22s,background-color .3s var(--ease-smooth)}.dropdown-filter.is-open .dropdown-filter-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1);transition:opacity .25s var(--ease-smooth),transform .25s var(--ease-smooth),visibility 0s}.dropdown-filter-menu li{padding:10px 12px;border-radius:9px;color:var(--ink);white-space:nowrap;font:600 12.5px Be Vietnam Pro,sans-serif;cursor:pointer;transition:background .2s var(--ease-smooth),color .2s var(--ease-smooth)}.dropdown-filter-menu li:hover{background:var(--gradient-brand-soft);color:var(--blue)}.dropdown-filter-menu li[aria-selected=true]{color:#fff;background:var(--gradient-brand)}.product-count{margin:0 0 20px;color:var(--muted);font:600 12px Be Vietnam Pro,sans-serif;letter-spacing:.2px}.project[hidden]{display:none}@media(max-width:640px){.filters-row{flex-direction:column;align-items:stretch}.project-filters{width:100%}.filter-dropdowns{flex-direction:column;align-items:stretch}.dropdown-filter{align-self:stretch}.dropdown-filter-toggle{width:100%;justify-content:space-between}.dropdown-filter-menu{left:0;right:0;width:auto;max-width:none;transform-origin:top center}}.project-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.project-list .project{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--card-bg);cursor:pointer;box-shadow:0 1px 2px #10182808,0 6px 16px #10182808;transition:transform .3s var(--ease-smooth),box-shadow .3s var(--ease-smooth),border-color .3s var(--ease-smooth),background-color .3s var(--ease-smooth);animation:card-in .5s var(--ease-smooth) both;animation-delay:calc(var(--i, 0) * 70ms)}.project-list .project{position:relative;--mx: 50%;--my: 0%}.project-list .project:before,.project-list .project:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;content:"";border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s var(--ease-smooth)}.project-list .project:before{background:radial-gradient(320px circle at var(--mx) var(--my),rgb(45 212 238 / 10%),transparent 65%)}.project-list .project:after{padding:1.5px;background:radial-gradient(260px circle at var(--mx) var(--my),#2dd4ee,#12b981 45%,transparent 75%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}.project-list .project:hover:before,.project-list .project:hover:after{opacity:1}.project-list .project:hover{border-color:#9fe0e8;box-shadow:0 18px 38px #0a92b01f,0 6px 16px #12b98114;transform:translateY(-4px) scale(1.01)}.card-image{position:relative;height:180px;padding:14px;overflow:hidden}.card-image:after{position:absolute;width:130px;height:130px;right:-32px;bottom:-70px;border:1px solid rgb(255 255 255 / 30%);border-radius:50%;content:""}.card-type{position:relative;z-index:1;display:inline-block;padding:6px 8px;border:1px solid rgb(255 255 255 / 34%);border-radius:999px;color:#12303a;background:#ffffffb8;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);font:700 11px Be Vietnam Pro,sans-serif;letter-spacing:.3px}.card-app .card-image{background:linear-gradient(135deg,#cfe0ff,#4f6bd8)}.card-tool .card-image{background:linear-gradient(135deg,#b9f1ff,#14a3c7)}.card-bot .card-image{background:linear-gradient(135deg,#bdf3d9,#12a06f)}.app-art{position:absolute;bottom:-16px;left:calc(50% - 43px);width:86px;height:158px;padding:27px 12px;border:6px solid #1e2a5e;border-radius:20px;background:#fff;box-shadow:0 12px 23px #1e285a42;transform:perspective(600px) rotateX(3deg) rotateY(4deg);transition:transform .3s var(--ease-smooth)}.project:hover .app-art{transform:perspective(600px) rotateX(0) rotateY(0) translateY(-6px)}.app-art i{position:absolute;top:10px;left:28px;width:18px;height:4px;border-radius:4px;background:#1e2a5e}.app-art b{display:block;height:48px;border-radius:6px;background:#5b74e0}.app-art b:nth-child(2){height:6px;margin-top:10px}.app-art b:nth-child(3){width:70%;height:6px;margin-top:7px}.pc-art{position:absolute;bottom:22px;left:calc(50% - 84px);width:168px;transform:perspective(600px) rotateX(3deg) rotateY(-4deg);transition:transform .3s var(--ease-smooth)}.project:hover .pc-art{transform:perspective(600px) rotateX(0) rotateY(0) translateY(-6px)}.pc-screen{position:relative;height:108px;padding:22px 14px 0;border:6px solid #1e2a5e;border-radius:12px;background:#fff;box-shadow:0 12px 23px #1e285a42}.pc-screen i{position:absolute;top:7px;left:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:#1e2a5e}.pc-screen b{display:block;height:38px;border-radius:6px;background:#5b74e0}.pc-screen b:nth-child(2){height:6px;margin-top:9px}.pc-screen b:nth-child(3){width:60%;height:6px;margin-top:6px}.pc-art{display:flex;flex-direction:column}.pc-art:before{order:1;width:26px;height:14px;margin:0 auto;content:"";background:#1e2a5e}.pc-art:after{order:2;width:78px;height:7px;margin:0 auto;content:"";border-radius:4px;background:#1e2a5e}.device-split{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom right,rgb(255 255 255 / 9%) 50%,transparent 50%)}.device-split:before{position:absolute;top:0;right:0;bottom:0;left:0;content:"";background:linear-gradient(to bottom right,transparent calc(50% - .75px),rgb(255 255 255 / 75%) 50%,transparent calc(50% + .75px));-webkit-mask-image:radial-gradient(ellipse 70% 90% at center,#000 35%,transparent 80%);mask-image:radial-gradient(ellipse 70% 90% at center,#000 35%,transparent 80%)}.device-split .pc-art{top:auto;bottom:18px;left:calc(50% - 114px);scale:.82;transform-origin:bottom center}.device-split .app-art{z-index:1;left:calc(50% + 12px);right:auto;bottom:16px;scale:.62;transform-origin:bottom left;box-shadow:0 10px 22px #1e285a4d}.tool-art{position:absolute;bottom:24px;left:10%;width:80%;padding:20px;border-radius:12px;color:#fff;background:#123b47;box-shadow:0 14px 24px #0a5a6e40;font-family:IBM Plex Mono,monospace;transform:perspective(600px) rotateX(3deg);transition:transform .3s var(--ease-smooth)}.project:hover .tool-art{transform:perspective(600px) rotateX(0) translateY(-5px)}.tool-art span{color:#8fe9ff;font-size:23px}.tool-art b{margin-left:8px;font-size:12px}.tool-art i{display:block;margin-top:12px;color:#8addb6;font-size:10px;font-style:normal}.bot-art>div{position:absolute;top:61px;left:calc(50% - 33px);width:66px;height:57px;padding:19px 13px;border-radius:20px;background:#0f9d78;transform:perspective(600px) rotateX(-3deg) rotateY(3deg);transition:transform .3s var(--ease-smooth)}.project:hover .bot-art>div{transform:perspective(600px) rotateX(0) rotateY(0) translateY(-5px)}.bot-art i{display:inline-block;width:9px;height:9px;margin:0 6px 0 1px;border-radius:50%;background:#e0faef}.bot-art b{display:block;width:18px;height:4px;margin:7px auto;border-radius:4px;background:#e0faef}.bot-art span{position:absolute;height:21px;border-radius:9px;background:#fff}.bot-art span:nth-child(2){top:65px;left:calc(50% + 45px);width:50px}.bot-art span:nth-child(3){top:99px;right:calc(50% + 44px);width:40px;background:#91d8c5}.card-content{display:flex;flex:1;flex-direction:column;padding:18px}.card-title{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--line)}.card-title h3{margin:0;font-size:19px;letter-spacing:-1.1px;color:var(--ink)}.card-title span{color:var(--muted);font:600 12px Be Vietnam Pro,sans-serif}.card-content dl{margin:0}.card-content dl div{padding:11px 0;border-bottom:1px solid var(--line)}.card-content dt{display:flex;align-items:center;gap:6px;margin-bottom:5px;color:var(--muted);font:700 10.5px Be Vietnam Pro,sans-serif;letter-spacing:.5px;text-transform:uppercase}.card-content dt svg{width:13px;height:13px;flex-shrink:0;opacity:.55}.card-content dd{margin:0;color:var(--ink);font-size:12.5px;font-weight:500;line-height:1.65}.card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:14px;color:var(--muted);font:600 12px Be Vietnam Pro,sans-serif}.card-footer span{display:inline-flex;align-items:center;gap:6px}.card-footer span svg{width:13px;height:13px;opacity:.55}.card-footer strong{padding:6px 9px;border-radius:999px;font:700 9px Be Vietnam Pro,sans-serif;transition:transform .25s var(--ease-smooth)}.project:hover .card-footer strong{transform:scale(1.05)}.card-footer strong.is-paid{color:#0a76c4;background:#e6f6fb}.card-footer strong.is-free{color:#0f9d5f;background:#e4f8ee}:root[data-theme=dark] .card-footer strong.is-paid{color:#7cd4f5;background:#0a76c42e}:root[data-theme=dark] .card-footer strong.is-free{color:#6be8ab;background:#0f9d5f2e}@keyframes card-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1100px){.project-list{grid-template-columns:repeat(2,minmax(0,1fr))}.card-image{height:210px}}@media(max-width:620px){.project-list{grid-template-columns:1fr;gap:15px}.card-image{height:190px}.card-content{padding:17px}}.card-content dd.card-platforms{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.card-platform{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 7px;border:1px solid var(--line);border-radius:8px;color:var(--blue);background:var(--pill-bg);transition:border-color .25s var(--ease-smooth),transform .25s var(--ease-smooth)}.card-platform svg{width:14px;height:14px}.card-platform small{color:var(--muted);font:600 10px IBM Plex Mono,monospace}.card-platform:hover{border-color:var(--blue);transform:translateY(-1px)}.card-title{align-items:center;gap:10px}.card-title h3{flex:1;min-width:0}.card-title .app-icon.card-app-icon{color:#fff;font:800 15px Be Vietnam Pro,sans-serif;transition:transform .3s var(--ease-smooth)}.card-title .app-icon.card-app-icon:not(.is-fallback){color:inherit}.project:hover .card-title .app-icon{transform:rotate(-4deg) scale(1.06)}.project-list .project[hidden]{display:none}.project-list,.project-list.is-filtered{grid-template-columns:repeat(4,minmax(0,1fr));justify-content:initial}@media(max-width:1100px){.project-list,.project-list.is-filtered{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.project-list,.project-list.is-filtered{grid-template-columns:1fr}}.project-list .project{cursor:pointer}.project-list .project:focus-visible{outline:3px solid var(--blue);outline-offset:3px}