*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #fafafa;--fg: #111;--sub: #444;--muted: #6b6b6b;--border: #ebebeb;--surface: #f3f3f3;--accent: #2563eb;--c-project: #2563eb;--c-research: #7c3aed;--c-tool: #059669;--c-experiment: #d97706}[data-theme=dark]{--bg: #0d0d0d;--fg: #f0f0f0;--sub: #aaa;--muted: #8a8a8a;--border: #1e1e1e;--surface: #161616;--accent: #3b82f6;--c-project: #60a5fa;--c-research: #a78bfa;--c-tool: #34d399;--c-experiment: #fbbf24}html{color-scheme:light dark;scroll-behavior:smooth}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh}.page{max-width:620px;margin:0 auto;padding:0 22px}.site-header{padding:52px 0 0;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.hd-left{display:flex;flex-direction:column;gap:8px}.brand-row{display:flex;flex-direction:column;gap:5px}.hd-right{display:flex;align-items:center;gap:12px;flex-shrink:0;padding-top:2px}.back-link,.nav-link{font:11px/1 ui-monospace,monospace;color:var(--muted);text-decoration:none;letter-spacing:.02em;transition:color .14s}.back-link:hover{color:var(--fg)}.nav-link:hover{color:var(--accent)}.site-name{font:700 17px/1 ui-monospace,Cascadia Code,monospace;letter-spacing:-.04em;color:var(--fg)}.site-name .dot{color:var(--accent)}.site-sub{font-size:12.5px;color:var(--muted);letter-spacing:.01em}.theme-btn{background:none;border:1px solid var(--border);border-radius:6px;padding:5px 8px;cursor:pointer;font-size:12px;line-height:1;transition:color .15s,border-color .15s;flex-shrink:0;margin-top:1px;color:var(--fg);border-color:var(--muted)}.theme-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cat-bar{display:flex;gap:20px;padding:32px 0 16px;border-bottom:1px solid var(--border)}.cat-btn{background:none;border:none;padding:0;font:11px/1 ui-monospace,monospace;color:var(--muted);cursor:pointer;letter-spacing:.03em;transition:color .14s}.cat-btn .n{opacity:.5;margin-left:4px}.cat-btn:hover{color:var(--fg)}.cat-btn.on{color:var(--fg);font-weight:700}.cat-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}.work-list{padding-bottom:80px}.wcard[hidden]{display:none!important}.wcard{position:relative;padding:26px 12px;margin:0 -12px;border-bottom:1px solid var(--border);transition:background .14s,border-radius .14s,box-shadow .24s cubic-bezier(.16,1,.3,1)}.wcard:hover{background:var(--surface);border-radius:10px;border-bottom-color:transparent}.wcard{--c-accent: var(--border)}.wcard[data-cat=project]{--c-accent: var(--c-project)}.wcard[data-cat=research]{--c-accent: var(--c-research)}.wcard[data-cat=tool]{--c-accent: var(--c-tool)}.wcard[data-cat=experiment]{--c-accent: var(--c-experiment)}.wcard:before{content:"";position:absolute;left:0;top:50%;height:0;width:2px;background:var(--c-accent);border-radius:2px;opacity:0;transform:translateY(-50%);transition:height .24s cubic-bezier(.16,1,.3,1),opacity .24s cubic-bezier(.16,1,.3,1)}.wcard:hover:before{height:60%;opacity:.9}.card-cover{position:absolute;inset:0;z-index:1;border-radius:inherit}.card-cover:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:10px}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;position:relative;z-index:2;margin-bottom:9px}.card-title{font-size:15.5px;font-weight:650;color:var(--fg);letter-spacing:-.025em;line-height:1.25}.card-right{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex-shrink:0}.card-year{font:10px/1 ui-monospace,monospace;color:var(--muted);letter-spacing:.04em}.cat-tag{font:700 9px/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.07em;padding:2px 5px;border-radius:4px;border:1px solid currentColor}.cat-tag[data-c=project]{color:var(--c-project)}.cat-tag[data-c=research]{color:var(--c-research)}.cat-tag[data-c=tool]{color:var(--c-tool)}.cat-tag[data-c=experiment]{color:var(--c-experiment)}.card-desc{font-size:13px;color:var(--sub);line-height:1.65;position:relative;z-index:2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;position:relative;z-index:2}.ctag{font:10px/1 ui-monospace,monospace;color:var(--muted)}.ctag:before{content:"#";opacity:.4}.card-links{display:flex;align-items:center;gap:18px;margin-top:16px;position:relative;z-index:2}.link-live{display:inline-flex;align-items:center;gap:5px;font:11px/1 ui-monospace,monospace;color:var(--accent);text-decoration:none;letter-spacing:.01em;transition:opacity .12s}.link-live:hover{opacity:.7}.link-live .ico{font-size:9px}.link-notes{display:inline-flex;align-items:center;gap:5px;font:600 11px/1 ui-monospace,monospace;color:var(--accent);text-decoration:none;letter-spacing:.01em;position:relative;z-index:3;transition:gap .16s cubic-bezier(.16,1,.3,1)}.link-notes .ico{transition:transform .16s cubic-bezier(.16,1,.3,1)}.wcard:hover .link-notes .ico{transform:translate(3px)}.link-notes:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.link-live.real{position:relative;z-index:3;color:var(--muted)}.link-live.real:hover{color:var(--fg);opacity:1}.link-live.real:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.status-tag{font:700 9px/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.07em;padding:2px 5px;border-radius:4px;color:var(--muted);background:var(--surface);border:1px solid var(--border)}.link-gh{display:inline-flex;align-items:center;gap:5px;font:11px/1 ui-monospace,monospace;color:var(--muted);text-decoration:none;position:relative;z-index:3;transition:color .12s}.link-gh:hover{color:var(--fg)}.link-gh:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.wip-tag{font:700 9px/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.07em;color:var(--c-experiment);border:1px solid currentColor;border-radius:4px;padding:2px 5px;opacity:.75}.empty{padding:60px 0;text-align:center;font-size:13px;color:var(--muted);display:none}.empty.show{display:block}.lens{position:fixed;z-index:400;width:288px;border-radius:12px;overflow:hidden;background:var(--bg);border:1px solid var(--border);box-shadow:0 20px 60px #0000002e,0 4px 12px #00000014;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .12s ease,transform .12s ease}.lens.show{opacity:1;transform:translateY(0)}.lens-img{display:block;width:100%;height:162px;object-fit:cover;object-position:top left}.lens--text .lens-img{display:none}.lens--text .lens-bar{padding:14px 12px}.lens-bar{padding:9px 12px;display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-top:1px solid var(--border)}.lens-name{font-size:12px;font-weight:600;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lens-url{font:10px/1 ui-monospace,monospace;color:var(--accent);white-space:nowrap;flex-shrink:0}.site-footer{border-top:1px solid var(--border);padding:16px 0;display:flex;justify-content:space-between;font:10px/1 ui-monospace,monospace;color:var(--muted);letter-spacing:.04em}@media(max-width:500px){.page{padding:0 16px}.site-header{padding-top:36px}.card-tags{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-right:-16px;padding-right:16px}.card-tags::-webkit-scrollbar{display:none}.ctag{flex-shrink:0;white-space:nowrap}}.toolbar{display:flex;align-items:center;gap:14px;padding:14px 0 0;flex-wrap:wrap}.search-wrap{position:relative;flex:1 1 160px;min-width:140px}.search-input{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:6px 26px 6px 9px;font:11px/1.4 ui-monospace,monospace;color:var(--fg);letter-spacing:.02em;transition:border-color .14s,background .14s}.search-input::placeholder{color:var(--muted)}.search-input:focus{outline:none;border-color:var(--accent)}.search-input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.search-kbd{position:absolute;right:7px;top:50%;transform:translateY(-50%);font:10px/1 ui-monospace,monospace;color:var(--muted);border:1px solid var(--border);border-radius:3px;padding:2px 4px;pointer-events:none;transition:opacity .12s}.search-wrap:focus-within .search-kbd{opacity:0}.sort-btn{background:none;border:1px solid var(--border);border-radius:6px;padding:6px 9px;font:11px/1 ui-monospace,monospace;color:var(--muted);cursor:pointer;letter-spacing:.03em;white-space:nowrap;transition:color .14s,border-color .14s}.sort-btn:hover{color:var(--fg);border-color:var(--muted)}.sort-btn[aria-pressed=true]{color:var(--fg)}.sort-btn .arrow{margin-left:4px;opacity:.6}.sort-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.card-thumb{display:none;position:relative;z-index:2;margin-top:14px;border-radius:8px;overflow:hidden;border:1px solid var(--border)}.card-thumb img{display:block;width:100%;height:auto;max-height:180px;object-fit:cover;object-position:top left}@media(pointer:coarse){.card-thumb{display:block}}@media(prefers-reduced-motion:no-preference){.reveal{opacity:0;transform:translateY(10px)}.reveal.in{opacity:1;transform:translateY(0);transition:opacity .42s cubic-bezier(.16,1,.3,1),transform .42s cubic-bezier(.16,1,.3,1)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.astro-route-announcer{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;width:1px;height:1px}