/* Базовые стили: шрифт, сброс, типографика, утилиты */

@font-face {
    font-family: 'Inter';
    src: url('../fonts/inter/InterVariable.woff2') format('woff2-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: var(--font);
    font-size: 0.9063rem;
    line-height: 1.5;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, p { margin: 0; }
h1 { font-size: 1.3125rem; font-weight: 600; letter-spacing: -.01em; }
h2 { font-size: 1.0625rem; font-weight: 500; }
h3 { font-size: 0.9375rem; font-weight: 600; }

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

img, svg { vertical-align: middle; }

button { font-family: inherit; }

::placeholder { color: var(--text-faint); }

/* Иконки из SVG-спрайта */
.icon {
    width: 1.25rem;
    height: 1.25rem;
    flex: none;
    stroke: currentColor;
    stroke-width: 1.8;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.icon-sm { width: 1rem; height: 1rem; }
.icon-lg { width: 1.5rem; height: 1.5rem; }

/* Утилиты */
.muted { color: var(--text-muted); }
.faint { color: var(--text-faint); }
.small { font-size: 0.7813rem; }
.strong { font-weight: 600; }
.nowrap { white-space: nowrap; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-success { color: var(--success); }
.text-danger { color: var(--danger); }
.text-warning { color: var(--warning); }
.text-accent { color: var(--accent); }

.flex { display: flex; align-items: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.gap-1 { gap: 0.375rem; }
.gap-2 { gap: 0.75rem; }
.gap-3 { gap: 1.25rem; }
.grow { flex: 1; }
.wrap { flex-wrap: wrap; }

.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }

.hidden { display: none !important; }

/* Скроллбары в стиле системы */
::-webkit-scrollbar { width: 0.625rem; height: 0.625rem; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 0.3125rem; border: 0.125rem solid var(--bg); }
::-webkit-scrollbar-track { background: transparent; }

/* Та же шкала начертаний, что и в системе: 400 — текст, 500 — выделенное,
   600 — заголовок. */
b, strong, .strong { font-weight: 500; }
h1, h2, h3, h4, h5, h6 { font-weight: 600; }