:root {
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

/* Не трогаем все svg: height:auto + max-width ломает иконки без явных w/h в HTML */
img,
video,
canvas {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

/* Базовый слой сайдбара: работает даже если gray-white-global.css не подгрузился / закэшировался.
   Иначе svg без классов w-5 h-5 раздуваются (viewBox 24×24 → сотни px) и рвут flex-меню. */
aside nav a.sidebar-nav-item,
#mobile-menu a.sidebar-nav-item,
.mobile-menu a.sidebar-nav-item {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.5rem !important;
  box-sizing: border-box !important;
}

aside nav a.sidebar-nav-item > svg,
#mobile-menu a.sidebar-nav-item > svg,
.mobile-menu a.sidebar-nav-item > svg {
  display: block !important;
  flex-shrink: 0 !important;
  width: 1.25rem !important;
  height: 1.25rem !important;
  max-width: 1.25rem !important;
  max-height: 1.25rem !important;
}

aside nav a.sidebar-nav-item:focus:not(:focus-visible),
#mobile-menu a.sidebar-nav-item:focus:not(:focus-visible),
.mobile-menu a.sidebar-nav-item:focus:not(:focus-visible) {
  outline: none !important;
}