* {
    box-sizing: border-box;
    font-family: var(--font-sans, system-ui, sans-serif);
}

body {
    background: var(--color-bg);
    color: var(--color-text);
    margin: 0;
    padding: 0;
    font-size: var(--font-size-body);
}

.text-muted {
    color: var(--color-text-muted);
}

/* Инлайн-иконки (рисованный набор _Icons.cshtml / svgIcon): в строке текста
   кнопки/заголовка центрируем по вертикали, чтобы не «проваливались» к базовой линии. */
.ic {
    vertical-align: middle;
}

/* ============================================================
   Минималистичные скроллбары в стиле iOS: без трека, тонкий
   полупрозрачный округлый ползунок, чуть темнеет при наведении.
   ============================================================ */

/* Firefox: тонкий скроллбар + цвета (ползунок / трек). */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, 0.35) transparent;
}

/* WebKit (Chrome/Edge/Safari): дорожка 8px, видимая часть ползунка ~4px
   (прозрачная рамка + background-clip создают «воздух» вокруг, как в iOS). */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.35);
    border-radius: 8px;
    border: 2px solid transparent;
    background-clip: content-box;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: rgba(100, 116, 139, 0.55);
    }

::-webkit-scrollbar-corner {
    background: transparent;
}