:root{--paper:oklch(96.8% .007 85);--paper-2:oklch(94% .009 85);--ink:oklch(19% .012 60);--muted:oklch(46% .012 60);--line:oklch(19% .012 60/.16);--accent:oklch(59% .19 33);--font-display:"Bricolage Grotesque", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.32'/%3E%3C/svg%3E")}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background-color:var(--paper);background-image:var(--grain);min-height:100vh;color:var(--ink);font-family:var(--font-display);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.55}a{color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.wrap{width:min(1440px,100% - 3rem);margin-inline:auto}.bar{z-index:10;backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:oklch(96.8% .007 85/.88);position:sticky;top:0}.bar .wrap{justify-content:space-between;align-items:baseline;gap:1rem;padding-block:1rem;display:flex}.mark{font-family:var(--font-mono);letter-spacing:.02em;white-space:nowrap;font-size:.8rem;font-weight:500;text-decoration:none}.count{font-family:var(--font-mono);color:var(--muted);white-space:nowrap;font-size:.72rem}.hero{padding-block:clamp(3.5rem,9vw,8rem) clamp(2rem,4vw,3.25rem);position:relative}.hero:before{content:"";z-index:-1;background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);opacity:.55;pointer-events:none;background-position:50%;background-size:72px 72px;position:absolute;inset:0 calc(50% - 50vw);-webkit-mask-image:radial-gradient(120% 90% at 20% 0,#000 0%,#0000 72%);mask-image:radial-gradient(120% 90% at 20% 0,#000 0%,#0000 72%)}.hero h1{letter-spacing:-.015em;text-wrap:balance;margin:0;font-size:clamp(2.75rem,8.5vw,6.75rem);font-weight:700;line-height:.98}.lede{max-width:32ch;color:var(--muted);margin:clamp(1.25rem,3vw,2rem) 0 0;font-size:clamp(.95rem,1.4vw,1.05rem);line-height:1.7}.filters{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}.filter{border:1px solid var(--line);color:var(--ink);font-family:var(--font-mono);cursor:pointer;background:0 0;border-radius:0;padding:.5rem .85rem;font-size:.72rem;line-height:1;transition:background-color .15s,color .15s,border-color .15s}.filter:hover{border-color:var(--ink)}.filter.is-active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.grid{border-top:1px solid var(--line);border-left:1px solid var(--line);grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:0;display:grid}.card{border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper);flex-direction:column;padding:.75rem;text-decoration:none;transition:background-color .2s;display:flex;position:relative}.card:after{content:"打开 ↗";background:var(--accent);color:oklch(99% .005 85);font-family:var(--font-mono);opacity:0;pointer-events:none;padding:.35rem .55rem;font-size:.66rem;line-height:1;transition:opacity .2s,transform .2s;position:absolute;top:1.25rem;right:1.25rem;transform:translateY(-4px)}.card:hover:after,.card:focus-visible:after{opacity:1;transform:none}.card[hidden]{display:none}.card:hover{background:var(--paper-2)}.thumb{aspect-ratio:4/3;border:1px solid var(--line);background:var(--paper-2);position:relative;overflow:hidden}.thumb iframe{pointer-events:none;border:0;width:100%;height:100%;transition:transform .5s cubic-bezier(.16,1,.3,1);display:block}.card:hover .thumb iframe{transform:scale(1.04)}.meta{align-items:baseline;gap:.75rem;padding-top:.75rem;display:flex}.idx{font-family:var(--font-mono);color:var(--muted);font-size:.72rem;transition:color .15s}.card:hover .idx{color:var(--accent)}.title{letter-spacing:-.01em;font-size:1.02rem;font-weight:600}.tags{font-family:var(--font-mono);color:var(--muted);white-space:nowrap;gap:.4rem;margin-left:auto;font-size:.66rem;display:flex}.foot{border-top:1px solid var(--line);font-family:var(--font-mono);color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:.75rem 2rem;margin-top:clamp(3rem,6vw,5rem);padding-block:1.5rem 3.5rem;font-size:.7rem;display:flex}.empty{font-family:var(--font-mono);color:var(--muted);text-align:center;padding:3rem 1rem;font-size:.8rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}