body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-regular);
    margin: 0;
    line-height: 1.6;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

/* "Прорыв" за пределы max-width родительского .container (1200px) — для
   страниц с плотным содержимым (админка, редактирование уроков/задач),
   которым нужно больше места по горизонтали. Работает независимо от
   ширины родителя/вьюпорта: внешний элемент растягивается на всю ширину
   вьюпорта (классический приём для full-bleed), внутренний — центрируется
   и ограничивается своим max-width. Нельзя просто задать max-width на одном
   элементе — он всё равно не превысит ширину содержимого родителя. */
.wide-admin-area {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.wide-admin-area-inner {
    max-width: 1700px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
    box-sizing: border-box;
}

/* Remove arrows/spinners from input type number */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* Крупнее чекбоксы по всему сайту (стандартный размер браузера слишком мелкий) */
input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
}
