:root{--bg:#fdfbf8;--bg-2:#faf6f0;--bg-3:#f5efe6;--surface:#fff;--ink:#2e2823;--ink-2:#6b5f54;--ink-3:#7a6e62;--accent:#a9632e;--accent-hover:#8f5226;--accent-soft:#f7eadf;--accent-line:#e9cdb4;--line:#efe7dd;--line-2:#e5dbcd;--tint-1:#f0c9a2;--tint-2:#ebc3b4;--tint-3:#c6d8c2;--tint-4:#c9d2e3;--tint-5:#e3cfdd;--tint-6:#e6d8b4;--color-bg:var(--bg);--color-surface:var(--surface);--color-text:var(--ink);--color-muted:var(--ink-2);--color-faint:var(--ink-3);--color-accent:var(--accent);--color-border:var(--line);--text-xs:11px;--text-sm:13px;--text-md:14px;--text-base:15px;--text-lg:18px;--text-xl:22px;--display:clamp(30px, 4.4vw, 44px);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:20px;--space-5:32px;--space-6:52px;--space-7:80px;--r-sm:8px;--r-md:12px;--r-lg:14px;--r-xl:18px;--r-pill:999px;--shadow-1:0 4px 14px #785a3c0f;--shadow-2:0 10px 28px #785a3c1a;--ease-soft:cubic-bezier(.22, .61, .36, 1);--dur-fast:.18s;--dur-base:.32s;--dur-slow:.46s;--font-display:"Noto Serif SC", "Songti SC", "SimSun", Georgia, serif;--font-body:"Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;--font-mono:"SFMono-Regular", Consolas, monospace;--shell:1080px;--gutter:28px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body,h1,h2,h3,p,ul,li,figure{margin:0;padding:0}ul{list-style:none}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}body{min-height:100vh;font-family:var(--font-body);font-size:var(--text-base);letter-spacing:.01em;color:var(--ink);background-color:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(68rem 42rem at 12% -12%,#f9ebdbe6,#0000 62%);background-repeat:no-repeat;background-attachment:fixed;font-weight:400;line-height:1.75}#root{z-index:1;position:relative}h1,h2,h3{font-family:var(--font-display);letter-spacing:.01em;color:var(--ink);font-weight:400;line-height:1.2}::selection{background:var(--accent-soft);color:var(--accent-hover)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-sm)}.shell{width:100%;max-width:var(--shell);padding:0 var(--gutter);margin:0 auto}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-2)}::-webkit-scrollbar-thumb{border-radius:var(--r-pill);background:#dfd4c6}::-webkit-scrollbar-thumb:hover{background:#cdbfae}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{0%,to{opacity:.5}50%{opacity:.9}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.topbar{justify-content:space-between;align-items:center;gap:var(--space-4);padding-block:var(--space-5) var(--space-4);animation:fade-up var(--dur-slow) var(--ease-soft) both;display:flex}.brand{align-items:center;display:inline-flex}.brand__word{font-size:var(--text-sm);letter-spacing:.12em;color:var(--ink-2);transition:color var(--dur-fast) var(--ease-soft)}.brand:hover .brand__word{color:var(--ink)}.topbar__meta{font-size:var(--text-xs);letter-spacing:.08em;color:var(--ink-3)}.hero{padding-block:var(--space-6);animation:fade-up var(--dur-slow) var(--ease-soft) 60ms both}.hero__eyebrow{font-size:var(--text-xs);letter-spacing:.2em;color:var(--ink-3)}.hero__title{max-width:20ch;margin-top:var(--space-3);font-size:var(--display);letter-spacing:.02em;text-wrap:balance;line-height:1.28}.shelf__head{justify-content:space-between;align-items:baseline;gap:var(--space-3);padding-bottom:var(--space-3);flex-wrap:wrap;display:flex}.shelf__title{font-size:var(--text-xl);letter-spacing:.02em;align-items:baseline;gap:10px;display:flex}.shelf__count{font-size:var(--text-xs);letter-spacing:.08em;color:var(--ink-3)}.filters{flex-wrap:wrap;gap:4px;display:flex}.filter{min-height:40px;font-size:var(--text-sm);letter-spacing:.02em;color:var(--ink-2);border-radius:var(--r-pill);transition:color var(--dur-fast) var(--ease-soft), background-color var(--dur-fast) var(--ease-soft), border-color var(--dur-fast) var(--ease-soft);background:0 0;border:1px solid #0000;padding:0 14px}.filter:hover{color:var(--accent);background:var(--accent-soft)}.filter[aria-pressed=true]{color:var(--accent);background:var(--accent-soft);border-color:var(--accent-line)}.list{border-top:1px solid var(--line)}.row{align-items:center;gap:var(--space-4);padding:var(--space-4) 0;border-bottom:1px solid var(--line);animation:fade-up var(--dur-slow) var(--ease-soft) both;grid-template-columns:50px minmax(0,1fr) auto;display:grid;position:relative}.row:last-child{border-bottom:0}.row:focus-within{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--r-md)}.row__icon{border-radius:var(--r-md);background:var(--tint);width:50px;height:50px;transition:transform var(--dur-base) var(--ease-soft);place-items:center;padding:10px;display:grid}.row__icon img{object-fit:contain;width:100%;height:100%}.row__icon span{font-family:var(--font-display);color:var(--accent);font-size:18px;line-height:1}.row:hover .row__icon{transform:translateY(-3px)}.row__name{font-family:var(--font-display);letter-spacing:.02em;color:var(--ink);transition:color var(--dur-fast) var(--ease-soft);font-size:17px;font-weight:400;line-height:1.5}.row:hover .row__name{color:var(--accent)}.row__desc{font-size:var(--text-sm);color:var(--ink-2);margin-top:2px;line-height:1.7}.row__tags{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.row__tag{font-size:var(--text-xs);letter-spacing:.04em;color:var(--ink-3);background:var(--bg-2);border-radius:var(--r-pill);padding:1px 8px}.row__meta{justify-content:flex-end;align-items:center;gap:var(--space-4);min-width:104px;display:flex}.row__type{font-size:var(--text-xs);letter-spacing:.08em;color:var(--ink-3);white-space:nowrap}.row__action{min-height:44px;font-size:var(--text-sm);letter-spacing:.04em;color:var(--accent);transition:color var(--dur-fast) var(--ease-soft);align-items:center;gap:4px;padding:0 2px;display:inline-flex}.row__action:after{content:"";border-radius:var(--r-md);position:absolute;inset:0}.row__action svg{transition:transform var(--dur-base) var(--ease-soft)}.row:hover .row__action svg{transform:translate(2px,-2px)}.row__action:hover{color:var(--accent-hover)}.skel-row{border-bottom:1px solid var(--line);background:linear-gradient(90deg,#0000 0%,#f5efe6e6 42% 58%,#0000 100%) 0 0/220% 100%;height:92px;animation:1.6s ease-in-out infinite breathe}.empty{padding:var(--space-7) var(--space-4);text-align:center;border:1px dashed var(--line-2);border-radius:var(--r-xl);margin-top:var(--space-4);justify-items:center;gap:10px;display:grid}.empty h3{font-size:var(--text-lg)}.empty p{font-size:var(--text-sm);color:var(--ink-2)}.empty button{min-height:44px;font-size:var(--text-sm);color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:var(--r-pill);transition:background-color var(--dur-fast) var(--ease-soft);margin-top:6px;padding:0 20px}.empty button:hover{background:#f2e0d0}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%)}}.toast{z-index:50;font-size:var(--text-sm);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);box-shadow:var(--shadow-2);animation:toast-in var(--dur-base) var(--ease-soft) both;align-items:center;gap:8px;padding:10px 20px;display:flex;position:fixed;bottom:28px;left:50%}.toast svg{color:var(--accent)}.foot{margin-top:var(--space-7);padding:var(--space-6) 0 var(--space-5);background:var(--bg-2);border-top:1px solid var(--line)}.foot__title{font-size:var(--text-xl);letter-spacing:.02em}.foot__lede{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--ink-2);line-height:1.9}.chips{gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;display:flex}.chip{min-height:44px;font-size:var(--text-sm);letter-spacing:.02em;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);transition:box-shadow var(--dur-fast) var(--ease-soft), transform var(--dur-fast) var(--ease-soft), color var(--dur-fast) var(--ease-soft);align-items:center;gap:8px;padding:0 16px;display:inline-flex}.chip:hover{color:var(--ink);box-shadow:var(--shadow-1);transform:translateY(-1px)}.chip svg{color:var(--accent)}.chip__hint{font-size:var(--text-xs);color:var(--ink-3);border-left:1px solid var(--line-2);padding-left:8px}.foot__meta{margin-top:var(--space-5);padding-top:var(--space-4);font-size:var(--text-xs);letter-spacing:.04em;color:var(--ink-3);border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:10px;display:flex}@media (width<=860px){.row__tags{display:none}}@media (width<=720px){:root{--gutter:20px}.topbar{padding-block:var(--space-4) var(--space-3)}.hero{padding-block:var(--space-5)}.shelf__head{flex-direction:column;align-items:flex-start}.filter{min-height:42px;padding:0 12px}.row{gap:var(--space-3);padding:var(--space-3) 0;grid-template-columns:42px minmax(0,1fr) auto}.row__icon{width:42px;height:42px;padding:8px}.row__type{display:none}.row__meta{min-width:0}.row__name{font-size:16px}.toast{left:var(--gutter);right:var(--gutter);justify-content:center;animation-name:fade-up;transform:none}}
