.skills-container .label { color: #fff !important; }



#skills .skill-section.is-vertical-format{ --skills-thumb-h: 22; }
/* === end sizing === */
/* Scroll hint arrows under each skills block */
.skill-section { position: relative; }

.scroll-hint{
  display:flex;
  gap: 32px;
  align-items:center;
  justify-content:center;
  margin: var(--space-5) 0 0;
  pointer-events: none;
  user-select: none;
  opacity: .4;
}

.scroll-hint .chevrons{
  display:flex;
  align-items:center;
  gap: 0px;

  pointer-events: auto;
  cursor: pointer;
}


.scroll-hint .chevron{
  width: 22px;
  height: 18px;
  fill: none;
  stroke: var(--scroll-hint-color, #fff);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3.5;
  filter: var(--scroll-hint-filter, drop-shadow(0 0 9px rgba(255,255,255,.75)));
  opacity: .75;
}

.scroll-hint .left .chevron{ animation: hint-left 1.6s ease-in-out infinite; }
.scroll-hint .right .chevron{ animation: hint-right 1.6s ease-in-out infinite; }


/*.scroll-hint .chevron:nth-child(2){ animation-delay: .15s; }
.scroll-hint .chevron:nth-child(3){ animation-delay: .3s; }*/

@keyframes hint-left{
  0%{ transform: translateX(0); opacity:.5; }
  50%{ transform: translateX(-8px); opacity:1; }
  100%{ transform: translateX(0); opacity:.5; }
}

@keyframes hint-right{
  0%{ transform: translateX(0); opacity:.5; }
  50%{ transform: translateX(8px); opacity:1; }
  100%{ transform: translateX(0); opacity:.5; }
}

/* Light vs dark appearance */
@media {
  .scroll-hint{
    --scroll-hint-color: #fff;
    --scroll-hint-filter: drop-shadow(0 1px 1px rgba(0,0,0,.45));
  }
}

.skill-section > h3 {
  display: flex;
  justify-content: center;  /* по центру горизонтально */
  align-items: center;      /* выравниваем по базовой линии */
  gap: .5rem;               /* расстояние между текстом и иконкой */
  text-align: center;       /* на случай переноса строк */
}
.skill-section > h3 .skill-icon { flex: 0 0 auto; width: 1.2em; height: 1.2em; }

.skills-container {
  display: flex;            /* один столбец */
  flex-direction: column;
  gap: var(--gap-grid);              /* расстояние между категориями */
}



/* Hide chevrons when at edges */
.scroll-hint .chevrons.is-hidden{ display:none; }

/* === Custom: Вертикальный формат в 2 раза выше остальных === */


/* [TGS] same sizing for animated icons */
tgs-player.skill-icon { flex: 0 0 auto; width: 1.2em; height: 1.2em; display:inline-block; }