/* Грузовозы · хаб /instrumenty/ (владелец 11.11: «в глаза должны бросаться инструменты, а не куча ненужного текста»).
   Заголовок в одну строку, поиск и группы сверху, сразу сетка. Без полос слева, таблеток, градиентов и размытых теней;
   цвета — только переменные темы (золото --accent). */
.hub-top{padding:18px 0 40px;border-bottom:1px solid var(--line)}
.hub-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 16px;margin:0 0 14px}
.hub-head h1{font-size:30px;line-height:1.15;letter-spacing:-.025em;font-weight:800;max-width:none;margin:0}
.hub-free{font-size:13px;color:var(--muted)}
.hub-bar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin:0 0 6px}
.hub-search{flex:0 1 320px;min-width:220px}
.hub-search input{width:100%;font:15px/1.3 var(--font);color:var(--text);background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;padding:10px 14px;min-height:44px}
.hub-search input:focus{border-color:var(--accent);outline:2px solid color-mix(in srgb,var(--accent) 40%,transparent);outline-offset:0}
.hub-tabs{display:flex;flex-wrap:wrap;gap:6px}
.hub-tab{font:500 14px/1.2 var(--font);color:var(--text);background:transparent;border:1px solid var(--line-strong);border-radius:8px;padding:9px 12px;min-height:44px;cursor:pointer;white-space:nowrap}
.hub-tab:hover{border-color:var(--accent)}
.hub-tab[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.hub-n{font-weight:400;opacity:.7;font-variant-numeric:tabular-nums}
.hub-group{margin:16px 0 0}
.hub-group h2{font-size:15px;line-height:1.3;letter-spacing:0;font-weight:700;max-width:none;margin:0 0 8px;color:var(--text)}
.hub-group h2 .hub-n{color:var(--muted);opacity:1;margin-left:4px}
.hub-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.hub-card{position:relative;margin:0;min-width:0;border:1px solid var(--line);border-radius:10px;background:var(--surface);transition:border-color .15s}
.hub-card:hover,.hub-card:focus-within{border-color:var(--accent)}
.hub-main{display:grid;grid-template-columns:30px minmax(0,1fr);gap:2px 12px;align-items:start;padding:12px 14px;min-height:64px;color:var(--text)}
.hub-ic{grid-row:1 / 3;color:var(--accent-ink)}
.hub-ic svg{width:28px;height:28px;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hub-t{font-size:15px;font-weight:700;line-height:1.25}
.hub-d{font-size:13px;line-height:1.4;color:var(--muted)}
.hub-kz{position:absolute;right:10px;top:10px;font-size:12px;color:var(--accent-ink);text-decoration:underline;text-underline-offset:2px;padding:2px 4px}
.hub-card:has(.hub-kz) .hub-t{padding-right:64px}
.hub-empty{margin:18px 0 0;color:var(--muted)}
.hub-privacy{margin:22px 0 0;font-size:13px;line-height:1.5;color:var(--muted)}
@media(max-width:1100px){.hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
  .hub-top{padding:10px 0 30px}
  .hub-head{margin:0 0 10px}
  .hub-head h1{font-size:22px}
  .hub-free{font-size:12px}
  .hub-bar{gap:8px}
  .hub-search{flex:1 1 100%;min-width:0}
  .hub-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -14px;padding:0 14px}
  .hub-tabs::-webkit-scrollbar{display:none}
  .hub-tab{font-size:13px;padding:8px 10px}
  .hub-group{margin:12px 0 0}
  .hub-grid{grid-template-columns:1fr;gap:6px}
  .hub-main{padding:10px 12px;min-height:0}
  .hub-t{font-size:14.5px}
  .hub-d{font-size:12.5px}
}