.catalog-page .page-head{padding:clamp(40px, 6vw, 72px) 0 var(--space-6);position:relative;overflow:hidden}.catalog-page .page-head:before{content:"";z-index:-1;pointer-events:none;background-image:radial-gradient(var(--line-strong) 1.2px, transparent 1.2px);opacity:.7;background-size:22px 22px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(60% 80% at 75% 30%,#000 10%,#0000 70%);mask-image:radial-gradient(60% 80% at 75% 30%,#000 10%,#0000 70%)}.catalog-page .head-grid{gap:var(--space-7);grid-template-columns:1.2fr .8fr;align-items:end;display:grid}.catalog-page .page-head h1{letter-spacing:-.035em;font-size:clamp(2.4rem,1.6rem + 3.6vw,4.2rem);font-weight:800;line-height:1.05}.catalog-page .page-head h1 span{color:var(--teal)}.catalog-page .page-head p{color:var(--muted);font-size:var(--fs-lg);max-width:44ch;margin:var(--space-4) 0 0}.catalog-page .how{gap:var(--space-2);display:grid}.catalog-page .how div{gap:var(--space-3);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);font-size:var(--fs-sm);align-items:center;padding:10px 14px;display:flex}.catalog-page .how svg{width:20px;height:20px;color:var(--teal);flex:none}.catalog-page .how b{font-weight:600}.catalog-page .how span{color:var(--muted)}.catalog-page .toolbar{z-index:10;background:color-mix(in srgb, var(--bg) 90%, transparent);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:var(--space-3) 0;position:sticky;top:68px}.catalog-page .toolbar .wrap{gap:var(--space-3);flex-wrap:wrap;align-items:center;display:flex}.catalog-page .search{flex:260px;max-width:380px;position:relative}.catalog-page .search svg{width:18px;height:18px;color:var(--muted);pointer-events:none;position:absolute;top:50%;right:14px;transform:translateY(-50%)}.catalog-page .search input{border:1px solid var(--line);background:var(--surface);width:100%;font-size:var(--fs-sm);transition:border-color .2s var(--ease), box-shadow .2s var(--ease);border-radius:999px;padding:10px 42px 10px 16px}.catalog-page .search input:focus{border-color:var(--teal);box-shadow:0 0 0 4px var(--teal-soft);outline:none}.catalog-page .chips{flex-wrap:wrap;gap:6px;display:flex}.catalog-page .chip{border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:var(--fs-xs);transition:all .2s var(--ease);border-radius:999px;align-items:center;gap:6px;padding:7px 13px;font-weight:500;display:inline-flex}.catalog-page .chip:hover{border-color:var(--line-strong);color:var(--ink)}.catalog-page .chip[aria-pressed=true]{border-color:var(--teal);background:var(--teal-soft);color:var(--teal)}.catalog-page .chip i{border-radius:50%;width:7px;height:7px}.catalog-page .count{font-size:var(--fs-xs);color:var(--muted);margin-inline-start:auto}.catalog-page .catalog{padding:var(--space-6) 0 var(--section)}.catalog-page .jump{gap:var(--space-2);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.catalog-page .jump a{font-size:var(--fs-sm);color:var(--muted);transition:all .2s var(--ease);border-bottom:2px solid #0000;margin-inline-end:var(--space-4);padding:6px 2px;font-weight:500;text-decoration:none}.catalog-page .jump a:hover{color:var(--ink);border-color:var(--line-strong)}.catalog-page .group{margin-bottom:var(--space-7);scroll-margin-top:140px}.catalog-page .group[hidden]{display:none}.catalog-page .group-head{align-items:baseline;gap:var(--space-3);margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--line);display:flex}.catalog-page .group-head h2{font-size:clamp(1.35rem,1.15rem + .8vw,1.75rem)}.catalog-page .group-head span{font-size:var(--fs-xs);color:var(--muted)}.catalog-page .tiles{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(270px,1fr));display:grid}.catalog-page .tile{gap:var(--space-4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);padding:var(--space-4);transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);animation:tile-in .4s var(--ease) both;animation-delay:calc(var(--i,0) * 40ms);grid-template-columns:64px 1fr;align-items:start;text-decoration:none;display:grid;position:relative}@keyframes tile-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.catalog-page .tile:hover{box-shadow:var(--shadow);border-color:var(--line-strong);transform:translateY(-3px)}.catalog-page .tile[hidden]{display:none}.catalog-page .ico{width:64px;height:64px;color:var(--ink);transition:transform .4s var(--ease);border-radius:18px;place-items:center;display:grid}.catalog-page .tile:hover .ico{transform:rotate(-4deg)scale(1.05)}.catalog-page .ico svg{width:38px;height:38px}.catalog-page .t-teal{background:var(--teal-soft)}.t-accent{background:var(--accent-soft)}.t-sand{background:var(--surface-2)}.catalog-page .tile h3{letter-spacing:-.01em;font-size:1.05rem;font-weight:600;line-height:1.3}.catalog-page .tile p{margin:4px 0 var(--space-3);font-size:var(--fs-xs);color:var(--muted);line-height:1.55}.catalog-page .tags{flex-wrap:wrap;gap:4px;display:flex}.catalog-page .tag{background:var(--surface-2);color:var(--muted);white-space:nowrap;border-radius:999px;padding:2px 9px;font-size:.7rem;font-weight:600}.catalog-page .tag.diy{background:var(--teal-soft);color:var(--teal)}.catalog-page .tag.pro{background:var(--accent-soft);color:var(--accent-ink)}.catalog-page .in-plan{color:var(--on-teal);background:var(--teal);border-radius:999px;padding:2px 9px;font-size:.68rem;font-weight:600;position:absolute;top:12px;left:12px}.catalog-page mark{background:color-mix(in srgb, var(--mustard) 35%, transparent);color:inherit;border-radius:3px}.catalog-page .empty{text-align:center;padding:var(--space-8) var(--space-4);border:1px dashed var(--line-strong);border-radius:var(--radius-md);color:var(--muted);display:none}.catalog-page .empty.show{display:block}.catalog-page .empty strong{color:var(--ink);margin-bottom:var(--space-2);font-size:1.15rem;display:block}.catalog-page .teardowns{margin-top:var(--space-8)}.catalog-page .td-grid{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.catalog-page .td{background:var(--inverse-bg);color:var(--inverse-ink);border-radius:var(--radius-md);transition:transform .3s var(--ease), box-shadow .3s var(--ease);grid-template-columns:clamp(96px,32%,150px) minmax(0,1fr);text-decoration:none;display:grid;overflow:hidden}.catalog-page .td:hover{box-shadow:var(--shadow);transform:translateY(-3px)}.catalog-page .td-art{background:color-mix(in srgb, var(--inverse-ink) 8%, transparent);min-width:0;color:var(--inverse-ink);padding:var(--space-4);place-items:center;display:grid}.catalog-page .td-art svg{width:100%;height:auto;overflow:visible}.catalog-page .td-art rect{transition:transform .5s var(--ease);transform-box:fill-box;transform-origin:50%}.catalog-page .td:hover .pa{transform:translate(6px)}.catalog-page .td:hover .pc{transform:translate(-6px)}.catalog-page .td:hover .pb{transform:rotate(12deg)}.catalog-page .td-body{padding:var(--space-5);flex-direction:column;gap:6px;display:flex}.catalog-page .td-body small{font-size:var(--fs-xs);color:var(--mustard);font-weight:600}.catalog-page .td-body strong{font-size:1.1rem;font-weight:600;line-height:1.35}.catalog-page .td-body>span{font-size:var(--fs-xs);color:color-mix(in srgb, var(--inverse-ink) 70%, transparent);line-height:1.6}@media (max-width:860px){.catalog-page .td-grid{grid-template-columns:1fr}}@media (max-width:1100px) and (min-width:861px),(max-width:520px){.catalog-page .td{grid-template-columns:1fr}.catalog-page .td-art{height:110px;overflow:hidden}.catalog-page .td-art svg{width:100%;max-width:220px;height:100%;overflow:hidden}}.catalog-page .bridge{gap:var(--space-3);margin-top:var(--space-6);grid-template-columns:1fr 1fr;display:grid}.catalog-page .bridge a{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-5);border-radius:var(--radius-md);transition:transform .3s var(--ease);text-decoration:none;display:flex}.catalog-page .bridge a:hover{transform:translateY(-2px)}.catalog-page .bridge .b1{background:var(--inverse-bg);color:var(--inverse-ink)}.catalog-page .bridge .b2{background:var(--accent-soft)}.catalog-page .bridge strong{font-size:1.1rem;font-weight:600;display:block}.catalog-page .bridge span span{font-size:var(--fs-xs);opacity:.75}.catalog-page .bridge svg{flex:none;width:22px;height:22px}@media (max-width:860px){.catalog-page .head-grid{gap:var(--space-5);grid-template-columns:1fr}.catalog-page .bridge{grid-template-columns:1fr}}@media (max-width:720px){.catalog-page .toolbar{top:60px}.catalog-page .count{display:none}.catalog-page .tiles{grid-template-columns:1fr}}
