.ibar { position: relative; z-index: 4; padding-top: var(--pt, 0); }
.ibar--pull { margin-top: calc(var(--bar-pull, 36px) * -1); }
.ibar__list {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr);
  gap: 1rem; margin: 0; padding: clamp(.9rem, 1.6vw, 1.2rem) clamp(1rem, 3vw, 2.5rem);
  list-style: none;
  background: var(--bar-bg, var(--color-surface));
  border-radius: calc(var(--radius) * .8);
  box-shadow: 0 18px 40px -24px rgba(18, 59, 120, .45);
}
.ibar--flat .ibar__list { box-shadow: none; background: var(--bar-bg, transparent); padding-inline: 0; }
.ibar__item, .ibar__link { display: flex; align-items: center; justify-content: center; gap: .85rem; min-width: 0; color: inherit; text-decoration: none; }
.ibar__icon { flex: none; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; color: var(--bar-icon, var(--color-icon)); }
.ibar__icon .icon { width: 1.75rem; height: 1.75rem; stroke-width: 1.6; }
.ibar__icon img { width: 2rem; height: 2rem; object-fit: contain; }
.ibar__text { display: grid; gap: .1rem; min-width: 0; }
.ibar__title { font-weight: 700; font-size: .98rem; line-height: 1.25; color: var(--bar-title, var(--color-heading)); }
.ibar__sub { font-size: .82rem; line-height: 1.3; color: var(--bar-text, color-mix(in srgb, var(--color-text) 70%, transparent)); }
a.ibar__link:hover .ibar__title { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 989px) { .ibar__item, .ibar__link { justify-content: flex-start; } }
@media (max-width: 749px) {
  .ibar { padding-top: var(--pt-m, 0); }
  .ibar--pull { margin-top: calc(var(--bar-pull, 36px) * -.6); }
  .ibar__list--mobile-grid { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem .75rem; }
  .ibar__list--mobile-stack { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: .85rem; }
  .ibar__list--mobile-scroll { grid-auto-columns: 70%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .ibar__list--mobile-scroll::-webkit-scrollbar { display: none; }
  .ibar__list--mobile-scroll .ibar__item { scroll-snap-align: start; }
  .ibar__icon { width: 1.9rem; height: 1.9rem; }
  .ibar__icon .icon { width: 1.5rem; height: 1.5rem; }
  .ibar__title { font-size: .88rem; }
  .ibar__sub { font-size: .75rem; }
}
