.bg-projects-decoration{background:radial-gradient(circle at 15% 10%,#f0b4291f,#0000 18%),radial-gradient(circle at 80% 12%,#7bc6bf1a,#0000 20%),linear-gradient(#07090b 0%,#05080c 60%,#07090b 100%)}.project-filter-bar{flex-wrap:wrap;gap:.5rem;display:flex}.project-filter-btn{color:#8896a0cc;font-family:var(--font-command);cursor:pointer;transition:color var(--motion-fast) var(--ease-standard), border-color var(--motion-fast) var(--ease-standard), background-color var(--motion-fast) var(--ease-standard);letter-spacing:.08em;background:0 0;border:1px solid #c6d6e024;border-left-width:2px;border-radius:0;padding:.42rem 1.05rem;font-size:.8125rem}.project-filter-btn:hover{color:#e6edf2eb;border-color:#c6d6e042}.project-filter-btn.active{color:var(--sea);border-color:#35d6de59;border-left-color:var(--sea);background:#35d6de1a}.project-grid{grid-template-columns:1fr;gap:1rem;display:grid}@media (width>=640px){.project-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.project-grid{grid-template-columns:repeat(3,1fr)}}.project-card{background:var(--panel,#080a0cb8);transition:transform var(--motion-base) var(--ease-standard), border-color var(--motion-base) var(--ease-standard), background-color var(--motion-base) var(--ease-standard);border:1px solid #c6d6e01a;border-left:2px solid #c6d6e024;border-radius:0;flex-direction:column;display:flex;position:relative;overflow:hidden}.project-card:hover{border-color:#35d6de47;border-left-color:var(--sea);box-shadow:none;background:#101519e6;transform:translateY(-3px)}.project-card.hidden{display:none}.project-cover-wrap{aspect-ratio:16/9;background:linear-gradient(135deg,#10161c 0%,#0a0e12 100%);position:relative;overflow:hidden}.project-cover-wrap.cover-fallback{aspect-ratio:16/9;border-bottom:1px solid #c6d6e014;justify-content:center;align-items:center;min-height:0;display:flex}.project-cover-wrap.cover-fallback:before{content:"";pointer-events:none;background-image:radial-gradient(circle at 50% 46%,#35d6de12,#0000 62%),linear-gradient(#c6d6e00b 1px,#0000 1px),linear-gradient(90deg,#c6d6e00b 1px,#0000 1px);background-size:auto,26px 26px,26px 26px;position:absolute;inset:0;mask-image:radial-gradient(82% 82%,#000 28%,#0000 88%)}.project-card:nth-child(3n+2) .project-cover-wrap.cover-fallback:before{background-image:radial-gradient(circle at 72% 30%,#35d6de13,#0000 58%),linear-gradient(#c6d6e00b 1px,#0000 1px),linear-gradient(90deg,#c6d6e00b 1px,#0000 1px)}.project-card:nth-child(3n+3) .project-cover-wrap.cover-fallback:before{background-image:radial-gradient(circle at 28% 68%,#35d6de13,#0000 58%),linear-gradient(#c6d6e00b 1px,#0000 1px),linear-gradient(90deg,#c6d6e00b 1px,#0000 1px)}.project-cover-wrap.cover-fallback:after{content:"";pointer-events:none;--corner:#c6d6e02e;background:linear-gradient(var(--corner), var(--corner)) left top / 14px 1px no-repeat, linear-gradient(var(--corner), var(--corner)) left top / 1px 14px no-repeat, linear-gradient(var(--corner), var(--corner)) right top / 14px 1px no-repeat, linear-gradient(var(--corner), var(--corner)) right top / 1px 14px no-repeat, linear-gradient(var(--corner), var(--corner)) left bottom / 14px 1px no-repeat, linear-gradient(var(--corner), var(--corner)) left bottom / 1px 14px no-repeat, linear-gradient(var(--corner), var(--corner)) right bottom / 14px 1px no-repeat, linear-gradient(var(--corner), var(--corner)) right bottom / 1px 14px no-repeat;position:absolute;inset:12px}.cover-plate{z-index:1;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));width:72px;height:72px;color:var(--cover-signal,#8896a0e6);transition:border-color var(--motion-fast) var(--ease-standard), background-color var(--motion-fast) var(--ease-standard);background:#07090b9e;border:1px solid #c6d6e033;place-items:center;display:grid;position:relative;transform:translateZ(0)}.project-cover-wrap:not(.cover-fallback) .cover-plate{display:none}.project-card:hover .cover-plate{background:#0c1014c7;border-color:#c6d6e052}.project-card[data-category=编程]{--cover-signal:#35d6de}.project-card[data-category=设计]{--cover-signal:#f0b429}.project-card[data-category=自媒体]{--cover-signal:#f07a3c}.project-card[data-category=其他]{--cover-signal:#9fb0bc}.project-cover{object-fit:cover;width:100%;height:100%;transition:transform .4s}.project-card:hover .project-cover{transform:scale(1.05)}.project-cover-icon{color:inherit;opacity:.9;font-size:1.75rem}.project-cover-overlay{z-index:1;background:linear-gradient(#0000 0%,#000000b3 100%);padding:2.5rem 1rem 1rem;position:absolute;bottom:0;left:0;right:0}.project-name{color:#fff;letter-spacing:.01em;font-size:1.02rem;font-weight:800;line-height:1.3}.project-cover-overlay .project-name{font-size:1.08rem}.project-body{flex-direction:column;flex:1;gap:.42rem;padding:.85rem 1rem .95rem;display:flex}.project-name--inline{color:var(--text,var(--text))}.project-meta{letter-spacing:.04em;color:#8896a0d1;align-items:center;gap:.55rem;font-size:.68rem;display:flex}.project-cat{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.18em;color:#35d6decc;font-size:.68rem}.project-year{border-left:1px solid #c6d6e029;padding-left:.6rem}.project-summary{color:#8896a0f2;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.83rem;line-height:1.65;display:-webkit-box;overflow:hidden}.project-desc{color:#8896a09e;-webkit-line-clamp:1;-webkit-box-orient:vertical;font-size:.74rem;line-height:1.55;display:-webkit-box;overflow:hidden}.project-tech{flex-wrap:nowrap;gap:.3rem;min-width:0;display:flex;overflow:hidden}.project-tech-chip:nth-child(n+3){display:none}.project-tech-chip{white-space:nowrap;font-family:var(--font-mono);letter-spacing:.03em;color:var(--muted);background:#c6d6e00d;border:1px solid #c6d6e024;border-left:2px solid #c6d6e038;border-radius:0;flex-shrink:0;padding:.14rem .42rem;font-size:.62rem;display:inline-flex}.project-bottom{justify-content:space-between;align-items:center;gap:.75rem;margin-top:auto;padding-top:.5rem;display:flex}.project-footer{flex-shrink:0}.project-link{font-family:var(--font-mono);letter-spacing:.08em;color:#35d6dee6;white-space:nowrap;transition:color var(--motion-fast) var(--ease-standard);align-items:center;gap:.25rem;padding:0;font-size:.72rem;font-weight:600;text-decoration:none;display:inline-flex}.project-link:hover{color:#6ceef5}.project-no-link{color:#8896a085;font-size:.78rem}.project-empty{text-align:center;color:#8896a09e;margin-top:2rem;font-size:.85rem}