:root{--paper: #f6f4ef;--surface: #ffffff;--ink: #201c17;--ink-2: #635c51;--ink-3: #756e62;--ink-faint: #a89f92;--line: #e8e3d9;--ok: #15803d;--ok-soft: #e8f5ec;--err: #b91c1c;--err-soft: #fbecec;--radius: 14px;--shadow-card: 0 1px 2px rgb(32 28 23 / .05);--shadow-lift: 0 10px 28px -10px rgb(32 28 23 / .18);--font-ui: "Hanken Grotesk", system-ui, sans-serif;--font-display: "Fraunces", Georgia, serif;--ease-out: cubic-bezier(.23, 1, .32, 1)}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;min-height:100dvh;background:radial-gradient(1200px 500px at 50% -200px,#fdfcf9 0%,transparent 70%),var(--paper);color:var(--ink);font-family:var(--font-ui);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}kbd{font-family:var(--font-ui);font-size:11px;padding:2px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;background:var(--surface);color:var(--ink-2)}.topbar{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:1fr minmax(280px,460px) 1fr;align-items:center;gap:24px;padding:14px 28px;background:color-mix(in srgb,var(--paper) 82%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:baseline;gap:10px}.brand-mark{font-family:var(--font-display);font-style:italic;font-weight:600;font-size:22px;letter-spacing:-.01em}.brand-sub{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-3)}.search{position:relative;display:flex;align-items:center}.search svg{position:absolute;left:14px;width:16px;height:16px;color:var(--ink-faint);pointer-events:none}.search kbd{position:absolute;right:12px;pointer-events:none;transition:opacity .15s ease}.search input{width:100%;padding:10px 40px;font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow-card);outline:none;transition:border-color .15s ease,box-shadow .15s ease}.search input::placeholder{color:var(--ink-faint)}.search input:focus{border-color:var(--ink-2);box-shadow:0 0 0 3px #201c1714}.search input:focus+kbd,.search input:not(:placeholder-shown)+kbd{opacity:0}.meta{display:flex;align-items:center;justify-content:flex-end;gap:14px}.count{font-variant-numeric:tabular-nums;font-size:13px;color:var(--ink-2)}.ghost{font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);background:none;border:none;padding:6px 10px;border-radius:8px;cursor:pointer;transition:color .15s ease,background-color .15s ease,transform .16s var(--ease-out)}.ghost:disabled{opacity:.5;cursor:default}.ghost:active{transform:scale(.97)}@media(hover:hover)and (pointer:fine){.ghost:hover{color:var(--ink);background:#201c170d}}#content{padding:20px 36px 40px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}.catbar{position:sticky;top:63px;z-index:9;display:flex;gap:8px;overflow-x:auto;padding:12px 36px;background:color-mix(in srgb,var(--paper) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);scrollbar-width:none}.catbar::-webkit-scrollbar{display:none}.chip{flex:0 0 auto;font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);cursor:pointer;transition:transform .16s var(--ease-out),background-color .15s ease,color .15s ease,border-color .15s ease}.chip:active{transform:scale(.96)}@media(hover:hover)and (pointer:fine){.chip:hover{border-color:var(--ink-3);color:var(--ink)}}.chip.active{background:var(--ink);border-color:var(--ink);color:#fdfcf9}.chip-count{font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;opacity:.55;margin-left:2px}.card{display:flex;flex-direction:column;padding:0;font:inherit;text-align:left;color:inherit;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card);cursor:pointer;overflow:hidden;transition:transform .18s var(--ease-out),box-shadow .18s var(--ease-out),border-color .18s ease}@media(hover:hover)and (pointer:fine){.card:hover{transform:translateY(-3px);border-color:#ddd6c9;box-shadow:var(--shadow-lift)}}.card:active{transform:translateY(-1px) scale(.98)}.card:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.card-img{position:relative;aspect-ratio:1;background:var(--surface)}.card-img img{position:absolute;top:13%;right:13%;bottom:13%;left:13%;width:74%;height:74%;object-fit:contain;transition:transform .22s var(--ease-out)}@media(hover:hover)and (pointer:fine){.card:hover .card-img img{transform:scale(1.04)}}.card-name{padding:10px 14px 12px;font-size:13.5px;font-weight:600;border-top:1px solid #f2eee6;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reveal{opacity:0;transform:translateY(8px);animation:reveal .26s var(--ease-out) forwards}@keyframes reveal{to{opacity:1;transform:translateY(0)}}.skel{aspect-ratio:1 / 1.22;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(100deg,transparent 40%,rgb(255 255 255 / .9) 50%,transparent 60%) no-repeat,#f0ece4;background-size:200% 100%;animation:shimmer 1.1s linear infinite}@keyframes shimmer{0%{background-position:120% 0}to{background-position:-80% 0}}.status{display:grid;place-items:center;gap:6px;padding:80px 20px;text-align:center}.status-title{margin:0;font-family:var(--font-display);font-size:24px;font-weight:500}.status-note{margin:0 0 14px;color:var(--ink-2)}dialog{border:none;border-radius:20px;padding:0;max-width:min(880px,calc(100vw - 48px));max-height:calc(100dvh - 32px);overflow:hidden;background:var(--surface);box-shadow:0 30px 80px -20px #201c1759;opacity:0;transform:scale(.97);transition:opacity .14s var(--ease-out),transform .14s var(--ease-out),overlay .14s allow-discrete,display .14s allow-discrete}dialog[open]{opacity:1;transform:none;transition-duration:.2s}@starting-style{dialog[open]{opacity:0;transform:scale(.96)}}dialog::backdrop{background:#201c1761;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .14s ease,overlay .14s allow-discrete,display .14s allow-discrete}dialog[open]::backdrop{opacity:1;transition-duration:.2s}@starting-style{dialog[open]::backdrop{opacity:0}}.close{position:absolute;top:12px;right:12px;z-index:1;width:34px;height:34px;display:grid;place-items:center;font-size:20px;line-height:1;color:var(--ink-2);background:var(--paper);border:1px solid var(--line);border-radius:50%;cursor:pointer;transition:color .15s ease,transform .16s var(--ease-out)}.close:active{transform:scale(.94)}@media(hover:hover)and (pointer:fine){.close:hover{color:var(--ink)}}.detail-body{display:grid;grid-template-columns:minmax(300px,440px) 1fr;max-height:calc(100dvh - 32px);overflow-y:auto}.preview{margin:0;position:relative;aspect-ratio:1;background:#fff;border-right:1px solid var(--line);border-radius:20px 0 0 20px}.preview img{position:absolute;top:8%;right:8%;bottom:8%;left:8%;width:84%;height:84%;object-fit:contain}.panel{display:flex;flex-direction:column;justify-content:center;gap:10px;padding:36px 34px}.panel-kicker{margin:0;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3)}.panel h2{margin:0;font-family:var(--font-display);font-size:clamp(24px,3.4vw,32px);font-weight:500;line-height:1.12;letter-spacing:-.01em}.panel-note{margin:0 0 10px;font-size:13.5px;color:var(--ink-2)}.actions{display:flex;flex-wrap:wrap;gap:10px}.btn{font:inherit;font-weight:600;font-size:14px;padding:11px 20px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;transition:transform .16s var(--ease-out),background-color .18s ease,border-color .18s ease,color .18s ease}.btn:active{transform:scale(.97)}@media(hover:hover)and (pointer:fine){.btn:hover{border-color:var(--ink-3)}.btn.primary:hover{background:#38322a}}.btn.primary{background:var(--ink);border-color:var(--ink);color:#fdfcf9}.btn.wa{background:#075e54;border-color:#075e54;color:#fdfcf9}@media(hover:hover)and (pointer:fine){.btn.wa[data-state=idle]:hover{background:#0a6f63;border-color:#0a6f63}}.btn .btn-label{display:inline-block;transition:filter .18s ease,opacity .18s ease}.btn[data-state=busy]{cursor:progress}.btn[data-state=busy] .btn-label{filter:blur(2px);opacity:.7}.btn[data-state=ok],.btn.primary[data-state=ok]{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}.btn[data-state=err],.btn.primary[data-state=err]{background:var(--err-soft);border-color:var(--err);color:var(--err)}.hint{margin:4px 0 0;font-size:12.5px;color:var(--ink-3)}@media(max-width:860px){.topbar{grid-template-columns:1fr;gap:10px;padding:12px 16px}.meta{justify-content:space-between}#content{padding:12px 16px 32px}.catbar{top:0;position:static;padding:10px 16px}.grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.detail-body{grid-template-columns:1fr}.preview{aspect-ratio:auto;height:44dvh;border-right:none;border-bottom:1px solid var(--line);border-radius:20px 20px 0 0}.panel{padding:22px 20px 26px}}@media(prefers-reduced-motion:reduce){.reveal{animation-duration:1ms;animation-delay:0ms!important}.card,.card-img img,.btn,dialog,dialog::backdrop{transition-duration:1ms}.skel{animation:none}}
