/* Browse the Catalog: command-palette overlay + header button */
.cat-btn{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 12px 0 14px;border:1px solid #2a4a5a;border-radius:10px;background:#04141dcc;color:#d5e3ea;font-size:13.5px;font-weight:600;transition:border-color .2s,box-shadow .2s,color .2s}
.cat-btn svg{width:17px;height:17px;color:#65ceff}
.cat-btn kbd,.catalog kbd{font:600 11px/1 Inter,sans-serif;color:#9fb2bf;border:1px solid #2a4a5a;border-bottom-width:2px;border-radius:5px;padding:3px 6px;background:#071a24}
.cat-btn:hover{border-color:#65ceff;color:#fff;box-shadow:0 0 22px #33b5ff33}
html.catalog-open{overflow:hidden}
.catalog{position:fixed;inset:0;z-index:200;display:flex;justify-content:center;align-items:flex-start;padding:4vh 3vw}
.catalog[hidden]{display:none}
.cat-backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,#0b3b5566,transparent 60%),#010810e6;backdrop-filter:blur(14px);opacity:0;transition:opacity .22s}
.cat-shell{position:relative;width:min(1240px,100%);max-height:92vh;display:flex;flex-direction:column;border:1px solid #1f4152;border-radius:18px;background:linear-gradient(180deg,#061923f5,#020c13f7);box-shadow:0 40px 120px #000c,0 0 0 1px #65ceff14,0 0 60px #33b5ff1f;overflow:hidden;transform:translateY(-14px) scale(.985);opacity:0;transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .22s}
.cat-shell:before{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#65ceff,#33b5ff,transparent)}
.catalog.on .cat-backdrop{opacity:1}.catalog.on .cat-shell{transform:none;opacity:1}
.cat-top{display:flex;gap:10px;padding:18px 18px 12px}
.cat-search{flex:1;display:flex;align-items:center;gap:12px;height:58px;padding:0 16px;border:1px solid #2a4a5a;border-radius:12px;background:#020d14;transition:border-color .2s,box-shadow .2s}
.cat-search:focus-within{border-color:#65ceff;box-shadow:0 0 0 4px #33b5ff1f}
.cat-search svg{width:22px;height:22px;color:#65ceff;flex:none}
.cat-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:#fff;font:500 19px Inter,sans-serif}
.cat-search input::placeholder{color:#6f8796}
.cat-x{width:58px;border:1px solid #2a4a5a;border-radius:12px;background:#020d14;font-size:28px;line-height:1;color:#afc3cf}.cat-x:hover{border-color:#ff4462;color:#ff4462}
.cat-filters{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:0 18px 12px;flex-wrap:wrap}
.cat-chips{display:flex;gap:7px;flex-wrap:wrap}
.cat-chips button,.cat-seg button{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;padding:7px 12px;border:1px solid color-mix(in srgb,var(--c,#65ceff) 35%,#1d3a48);border-radius:99px;background:#03111a;color:#c7d6df;transition:.18s}
.cat-chips i{width:7px;height:7px;border-radius:50%;background:var(--c)}
.cat-chips button[aria-pressed=true]{background:var(--c,#65ceff);border-color:var(--c,#65ceff);color:#03121a}
.cat-chips button[aria-pressed=true] i{background:#03121a}
.cat-right{display:flex;gap:10px;align-items:center}
.cat-seg{display:flex;border:1px solid #1d3a48;border-radius:99px;padding:3px;gap:2px}
.cat-seg button{border:0;padding:6px 12px}.cat-seg button[aria-pressed=true]{background:#65ceff;color:#03121a}
.cat-right select{height:36px;border:1px solid #1d3a48;border-radius:99px;background:#03111a;color:#c7d6df;padding:0 12px;font:600 12.5px Inter,sans-serif}
.cat-meta{padding:6px 18px 10px;font-size:12.5px;color:#8ca3b1;border-bottom:1px solid #12303c}.cat-meta b{color:#65ceff}
.cat-results{flex:1;min-height:0;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px;padding:16px 18px 20px;align-content:start;grid-auto-rows:max-content;scrollbar-width:thin;scrollbar-color:#24404d transparent}
.cat-card{flex:none;display:flex;flex-direction:column;border:1px solid #1a3644;border-radius:12px;overflow:hidden;background:#05141d;transition:transform .2s,border-color .2s,box-shadow .2s;animation:ccIn .35s both;animation-delay:calc(var(--i)*18ms)}
@keyframes ccIn{from{opacity:0;transform:translateY(8px)}}
.cat-card:hover,.cat-card[aria-selected=true]{border-color:var(--c);transform:translateY(-3px);box-shadow:0 12px 30px #000a,0 0 22px color-mix(in srgb,var(--c) 28%,transparent)}
.cat-card[aria-selected=true]{outline:2px solid var(--c);outline-offset:2px}
.cc-img{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 30%,#05141d),#05141d)}
.cc-img img{width:100%;height:100%;object-fit:cover;display:block}
.cc-price{position:absolute;right:8px;top:8px;font:700 10.5px/1 Inter,sans-serif;letter-spacing:.08em;font-style:normal;padding:5px 8px;border-radius:6px;background:#020c13d9;color:#fff;border:1px solid #ffffff2a}
.cc-price.free{background:#19df98;color:#03121a;border-color:#19df98}
.cc-body{display:flex;flex-direction:column;gap:5px;padding:11px 13px 13px;flex:1}
.cc-cat{display:flex;align-items:center;gap:6px;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--c);font-weight:650}
.cc-cat i{width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
.cc-t{font-size:14.5px;font-weight:650;line-height:1.3;color:#eef4f7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cc-t mark{background:#65ceff33;color:#9fe0ff;border-radius:3px}
.cc-m{font-size:12px;color:#8ca3b1;margin-top:auto}
.cc-tags{display:flex;gap:6px;flex-wrap:wrap}.cc-tags span{font-size:11px;color:#7f98a6}.cc-tags span:hover{color:var(--c)}
.cat-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:#9fb2bf}
.cat-empty h3{color:#fff;font-size:24px;margin:18px 0 6px}.cat-empty div{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.cat-empty button{padding:7px 13px;border:1px solid #2a4a5a;border-radius:99px;background:#03111a;font-size:13px}.cat-empty button:hover{border-color:#65ceff;color:#65ceff}
.ce-orb{width:74px;height:74px;margin:auto;border-radius:50%;border:2px dashed #65ceff66;box-shadow:0 0 40px #33b5ff33 inset;animation:spin 12s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}
.cat-foot{display:flex;gap:18px;align-items:center;padding:11px 18px;border-top:1px solid #12303c;font-size:12px;color:#7f98a6;flex-wrap:wrap}.cat-foot kbd{margin-right:3px}.cat-foot a{margin-left:auto;color:#65ceff}
@media(max-width:1150px){.cat-btn span,.cat-btn kbd{display:none}.cat-btn{width:44px;padding:0;justify-content:center}}
@media(max-width:700px){.catalog{padding:0}.cat-shell{max-height:none;height:100%;border-radius:0}.cat-top{padding:12px}.cat-search{height:50px}.cat-search input{font-size:16px}.cat-search kbd,.cat-foot{display:none}.cat-x{width:50px}
 .cat-filters{padding:0 12px 10px;flex-direction:column;align-items:stretch}.cat-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -12px;padding:0 12px}.cat-chips button{flex:none}.cat-right{justify-content:space-between}
 .cat-results{grid-template-columns:1fr 1fr;gap:10px;padding:12px}.cc-t{font-size:13px}.cc-tags{display:none}}
@media(prefers-reduced-motion:reduce){.cat-shell,.cat-backdrop,.cat-card{transition:none!important;animation:none!important}.ce-orb{animation:none}}

/* v4: wheel scrolls results, never the page behind */
html.catalog-open,html.catalog-open body{overflow:hidden!important;overscroll-behavior:none}
.cat-results,.cat-shell{overscroll-behavior:contain}
.cat-results{overflow-y:auto;min-height:0}