.project-filter-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.5rem}.project-filter-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem 1rem;border:1px solid var(--color-border);color:var(--color-text-dim);background:var(--bg-deep);cursor:pointer;transition:color .2s ease,border-color .2s ease,background .2s ease}.project-filter-btn:hover{color:var(--color-text)!important;border-color:var(--color-primary)!important}.project-filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;font-size:.6rem;font-weight:700;background:var(--bg-elevated);color:var(--color-text-muted);border-radius:2px;transition:background .2s ease,color .2s ease}.project-card{position:relative;cursor:pointer;transition:opacity .2s ease}.project-card.project-hidden{display:none}.project-card.project-enter{animation:project-card-enter .38s cubic-bezier(.22,1,.36,1) var(--enter-delay, 0s) both}@keyframes project-card-enter{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.project-float-icon{position:absolute;top:-13px;right:14px;z-index:20;width:42px;height:42px;background:var(--bg-deep);border:1px solid var(--color-border);box-shadow:0 4px 14px #0006;display:flex;align-items:center;justify-content:center;padding:7px;transition:transform .35s cubic-bezier(.34,1.56,.64,1),border-color .3s ease,box-shadow .3s ease}.project-card:hover .project-float-icon{transform:translateY(-4px) scale(1.1);border-color:var(--color-primary);box-shadow:0 8px 24px #0006,0 0 14px rgb(var(--primary-ch) / .18)}.project-icon-img{width:100%;height:100%;object-fit:contain;display:block}.project-icon-github{filter:invert(1) brightness(.85)}html.light-mode .project-icon-github{filter:invert(0) brightness(.5)}.project-inner{position:relative;display:flex;flex-direction:column;height:100%;border:1px solid var(--color-border);background:var(--bg-deep);overflow:hidden;transition:transform .4s cubic-bezier(.25,.46,.45,.94),border-color .3s ease,box-shadow .3s ease}.project-card:hover .project-inner{transform:translateY(-4px);border-color:var(--color-primary);box-shadow:0 16px 44px #00000059,0 0 0 1px rgb(var(--primary-ch) / .12),0 0 20px rgb(var(--primary-ch) / .06)}.project-inner.has-bg-img{background:transparent}.project-bg-img{position:absolute;inset:0;z-index:0;overflow:hidden}.project-bg-img:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(155deg,#0405076b,#040507ad);transition:background .5s ease}.project-card:hover .project-bg-img:after{background:linear-gradient(155deg,#04050747,#0405078a)}.project-bg-img img{position:absolute;inset:-10%;width:120%;height:120%;object-fit:cover;filter:blur(24px) saturate(2) brightness(.42) grayscale(.2);transition:filter .5s ease}.project-card:hover .project-bg-img img{filter:blur(18px) saturate(2.4) brightness(.54) grayscale(.2)}.project-company{font-size:.65rem;font-family:ui-monospace,monospace;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--color-primary);margin-bottom:.5rem}.project-title{color:var(--color-text);transition:color .3s ease}.project-card:hover .project-title{color:var(--color-primary)}.project-desc{color:var(--color-text-dim)}.has-bg .project-desc{color:rgb(var(--text-muted-ch) / .85)}.project-tag{font-size:.65rem;letter-spacing:.03em;color:var(--color-text-dim);background:var(--bg-base);border:1px solid var(--color-border);padding:.2rem .55rem;transition:color .2s ease,border-color .2s ease}.project-card:hover .project-tag,.project-modal-tags .project-tag{color:var(--color-text-muted);border-color:var(--color-border-hover)}.has-bg .project-tag{background:#0405078c;color:#9aa3aed9}.project-footer{border-top:1px solid var(--color-border);padding:.6rem 1.1rem;display:flex;align-items:center;gap:.65rem;background:#0000001f;transition:border-top-color .3s ease,background .3s ease}.project-card:hover .project-footer{border-top-color:rgb(var(--primary-ch) / .25);background:rgb(var(--primary-ch) / .05)}.has-bg .project-footer{background:#00000061;border-top-color:#ffffff14}.has-bg:hover .project-inner .project-footer{background:rgb(var(--primary-ch) / .18);border-top-color:rgb(var(--primary-ch) / .3)}.project-cat-badge{font-size:.55rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-muted);background:rgb(var(--primary-ch) / .04);border:1px solid rgb(var(--primary-ch) / .1);padding:.2rem .6rem;transition:color .3s ease,background .3s ease,border-color .3s ease}.project-card:hover .project-cat-badge{color:var(--color-primary);background:rgb(var(--primary-ch) / .1);border-color:rgb(var(--primary-ch) / .3)}.project-heroicon{color:rgb(var(--primary-ch) / .35);transition:color .3s ease}.project-card:hover .project-heroicon{color:rgb(var(--primary-ch) / .7)}.project-heroicon svg{transition:transform .3s ease,opacity .3s ease}.project-card:hover .project-heroicon svg{transform:translateY(60px);opacity:0}.project-open-hint{display:inline-flex;align-items:center;gap:.3rem;font-size:.65rem;font-family:ui-monospace,monospace;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted);transition:color .3s ease,gap .3s ease;user-select:none}.project-hint-arrow{opacity:.4;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .3s ease}.project-card:hover .project-open-hint{color:var(--color-primary);gap:.5rem}.project-card:hover .project-hint-arrow{transform:translate(2px,-2px);opacity:1}.project-modal-backdrop{position:fixed;inset:0;z-index:9000;display:flex;align-items:flex-start;justify-content:center;padding:5vh 1rem 2rem;background:rgb(var(--bg-base-ch) / .88);overflow-y:auto;opacity:0;pointer-events:none;transition:opacity .26s ease}.project-modal-backdrop[hidden]{display:none!important}.project-modal-backdrop.project-modal-open{opacity:1;pointer-events:auto;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.project-modal-backdrop.project-modal-closing{opacity:0;pointer-events:none}.project-modal-box{position:relative;width:100%;max-width:620px;background:var(--bg-deep);border:1px solid var(--color-border);overflow:hidden;transform:translateY(24px) scale(.97);transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .26s ease;opacity:0;box-shadow:0 32px 80px #0009,0 0 0 1px rgb(var(--primary-ch) / .08)}.project-modal-open .project-modal-box{transform:translateY(0) scale(1);opacity:1}.project-modal-closing .project-modal-box{transform:translateY(14px) scale(.98);opacity:0}.project-modal-close{position:absolute;top:.875rem;right:.875rem;z-index:10;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;background:#00000080;border:1px solid var(--color-border);color:var(--color-text-dim);cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .25s ease}.project-modal-close:hover{background:rgb(var(--primary-ch) / .15);color:var(--color-primary);border-color:var(--color-primary);transform:rotate(90deg)}.project-modal-hero{position:relative;height:210px;background-size:cover;background-position:top center;background-color:var(--bg-base);flex-shrink:0}.project-modal-hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.1) 0%,rgb(var(--bg-base-ch) / .88) 80%,var(--bg-deep) 100%)}.project-modal-hero-content{position:absolute;bottom:0;left:0;right:0;padding:1.25rem 1.5rem 1rem}.project-modal-cat-badge{display:inline-block;font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--color-primary);background:rgb(var(--primary-ch) / .1);border:1px solid rgb(var(--primary-ch) / .25);padding:.18rem .6rem;margin-bottom:.5rem}.project-modal-heading{font-size:1.3rem;font-weight:700;line-height:1.2;color:var(--color-text);margin:0 0 .25rem}.project-modal-company{font-size:.65rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-primary);opacity:.7;margin:0}.project-modal-body{padding:1.25rem 1.5rem 1.5rem}.project-modal-description{font-size:.9rem;line-height:1.6;color:var(--color-text-muted);margin-bottom:1.1rem}.project-modal-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.5rem}.project-modal-cta-wrap{border-top:1px solid var(--color-border);padding-top:1.25rem;text-align:center}.project-modal-cta{display:inline-flex;align-items:center;gap:.65rem;padding:.7rem 1.75rem;font-size:.85rem;text-decoration:none;color:var(--bg-base);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);transition:filter .25s ease,gap .3s ease,box-shadow .25s ease;box-shadow:0 0 rgb(var(--primary-ch) / 0)}.project-modal-cta:hover{filter:brightness(1.1);gap:1rem;box-shadow:0 0 18px rgb(var(--primary-ch) / .3)}.project-modal-no-link{font-size:.8rem;font-style:italic;color:var(--color-text-muted)}html.light-mode .project-inner{background:var(--bg-elevated);border-color:var(--color-border)}html.light-mode .project-card:hover .project-inner{box-shadow:0 16px 40px #0000001a,0 0 0 1px rgb(var(--primary-ch) / .2)}html.light-mode .project-card.has-bg .project-bg-img{filter:invert(.88) saturate(1.4) brightness(1.1)}html.light-mode .project-card.has-bg:hover .project-bg-img{filter:invert(.88) saturate(1.7) brightness(1.2)}html.light-mode .project-card.has-bg .project-bg-img img{filter:blur(24px) saturate(1.8) brightness(.72)}html.light-mode .project-card.has-bg:hover .project-bg-img img{filter:blur(18px) saturate(2.1) brightness(.82)}html.light-mode .project-card.has-bg .project-bg-img:after{display:none}html.light-mode .project-inner.has-bg-img{background:#ffffff85}html.light-mode .project-card.has-bg .project-title{color:#0f172a}html.light-mode .project-card.has-bg:hover .project-title{color:var(--color-primary)}html.light-mode .project-card.has-bg .project-desc{color:#0f172ab8}html.light-mode .project-card.has-bg .project-company{color:var(--color-primary)}html.light-mode .project-card.has-bg .project-tag{background:#ffffff8c;color:#334155;border-color:#0000001a}html.light-mode .project-footer{background:#0000000a;border-top-color:var(--color-border)}html.light-mode .project-card:hover .project-footer{background:rgb(var(--primary-ch) / .05)}html.light-mode .project-card.has-bg .project-footer{background:#ffffff8c;border-top-color:#00000014}html.light-mode .project-card.has-bg:hover .project-footer{background:rgb(var(--primary-ch) / .08)}html.light-mode .project-float-icon{background:var(--bg-elevated);border-color:var(--color-border);box-shadow:0 4px 14px #0000001a}html.light-mode .project-modal-box{background:var(--bg-elevated);border-color:var(--color-border);box-shadow:0 32px 80px #00000026}html.light-mode .project-modal-close{background:#00000014}html.light-mode .project-modal-close:hover{background:rgb(var(--primary-ch) / .12)}html.light-mode .project-modal-cta-wrap{border-top-color:var(--color-border)}html.light-mode .project-modal-cta{color:#fff}
