/* БАЗА — верхние вкладки карты навыков */
.skill-tabs-panel{
  position:relative;
  margin:24px 0 14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#f8f9fc;
  padding:13px 14px;
  overflow:hidden;
}
.skill-tabs-panel::after{
  content:"";
  position:absolute;
  top:34px;right:0;bottom:0;
  width:28px;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(248,249,252,0),#f8f9fc 82%);
}
.skill-tabs-label{
  margin:0 0 9px 3px;
  padding:0;
  border:0;
  color:#8a90a5;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.65px;
}
.skill-tabs-scroll{
  overflow-x:auto;
  scrollbar-width:none;
  scroll-snap-type:none;
  overscroll-behavior-inline:contain;
}
.skill-tabs-scroll::-webkit-scrollbar{display:none}
.skill-tabs-panel .skill-filter{
  display:flex;
  flex-wrap:nowrap;
  justify-content:flex-start;
  gap:7px;
  min-width:max-content;
}
.skill-tabs-panel .skill-filter-btn{
  position:relative;
  display:flex;
  align-items:center;
  gap:7px;
  min-height:auto;
  padding:9px 11px;
  border:1px solid #e1e3ec;
  border-radius:13px;
  background:#fff;
  color:#737a92;
  font-size:11px;
  font-weight:850;
  transform:none;
  white-space:nowrap;
  transition:.18s ease;
}
.skill-tabs-panel .skill-filter-btn::after{display:none}
.skill-tabs-panel .skill-filter-btn:hover{
  border-color:#cfc9ff;
  background:#fff;
  color:#5749dd;
  transform:translateY(-1px);
}
.skill-tabs-panel .skill-filter-btn.active{
  background:#5b50dc;
  border-color:#5b50dc;
  color:#fff;
  box-shadow:0 7px 18px rgba(84,72,211,.18);
  transform:none;
}
.skill-tab-icon{
  min-width:19px;
  height:auto;
  padding:0;
  border-radius:0;
  display:block;
  background:transparent;
  color:inherit;
  font-size:11px;
  font-weight:950;
  text-align:center;
}
/* В строке класса/маршрута label уже содержит «5 класс», «ОГЭ» и т. п.;
   отдельный icon дублировал тот же текст и только раздувал кнопки. */
.skill-track .skill-tab-icon{display:none}
.skill-tab.active .skill-tab-icon{background:transparent;color:#fff}
.skill-tab-count{
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  background:rgba(117,123,148,.1);
  color:inherit;
  font-size:9px;
  font-weight:950;
}
.skill-tab.active .skill-tab-count{background:rgba(255,255,255,.17);color:#fff}

.skill-tab-summary{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  margin:14px 0 8px;
  padding:18px 20px;
  border:1px solid #e6e3ff;
  border-radius:20px;
  background:linear-gradient(135deg,#f8f7ff,#fbfcff);
}
.skill-tab-summary-icon{
  min-width:52px;height:52px;padding:0 9px;border-radius:16px;
  display:grid;place-items:center;
  background:#ebe8ff;border:1px solid #dcd6ff;
  color:#594bdd;font-size:17px;font-weight:950;
}
.skill-tab-summary small{display:block;color:#8d93a8;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.65px}
.skill-tab-summary h3{margin:3px 0 4px;font-size:21px;letter-spacing:-.4px}
.skill-tab-summary p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.skill-tab-summary-stats{
  display:grid;grid-template-columns:auto auto;column-gap:7px;row-gap:2px;align-items:baseline;
  padding-left:18px;border-left:1px solid #e2dfff;
}
.skill-tab-summary-stats b{font-size:18px;color:#5b4ddd;text-align:right}.skill-tab-summary-stats span{font-size:10px;color:#8c92a5;font-weight:800}

/* После выноса категорий в отдельную строку инструменты отвечают только за поиск. */
#skill-map .skill-map-tools{justify-content:flex-start;margin-top:8px}
#skill-map .skill-map-tools .skill-search{width:min(620px,100%)}

/* На desktop прокрутка свободная: scroll-snap намеренно выключен, чтобы в конце
   плавного движения лента не делала дополнительный рывок к ближайшей вкладке. */
@media(hover:hover) and (pointer:fine){
  .skill-tabs-panel.is-key-panning,
  .skill-tabs-panel.is-key-panning *,
  .skill-tabs-panel.is-pointer-panning,
  .skill-tabs-panel.is-pointer-panning *{user-select:none}
}

@media(max-width:760px){
  .skill-tabs-panel{border-radius:17px;margin-top:18px;padding:11px 12px}
  .skill-tabs-panel::after{top:32px;width:22px}
  .skill-tabs-panel .skill-filter-btn{padding:8px 10px;gap:6px}
  .skill-tab-icon{min-width:17px;font-size:10px}
  .skill-tab-summary{grid-template-columns:auto 1fr;padding:15px;gap:12px}
  .skill-tab-summary-icon{min-width:44px;height:44px;border-radius:14px}
  .skill-tab-summary-stats{grid-column:1/-1;border-left:0;border-top:1px solid #e2dfff;padding:11px 0 0;display:flex;gap:7px}
  .skill-tab-summary-stats b{text-align:left;font-size:15px}.skill-tab-summary-stats span{margin-right:9px}
}
