@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400..800&display=swap');

/* ============================================================
   dec.mgutm.ru — главная ЭИОС в стиле volgmed.ru

   Что меняется:
   • шапка — прозрачная поверх первого экрана, при прокрутке
     тёмная с размытием; меню «Справочник» / «Сервисы»
     выпадающими панелями, «Расписание» и «Оценки» — прямыми
     ссылками, справа «Версия для слабовидящих» и «Личный кабинет»;
     на телефоне — одна кнопка «Меню» с выезжающей панелью;
   • первый экран во всю ширину окна: крупный заголовок,
     подзаголовок, две главные кнопки;
   • кнопки быстрого доступа — белыми плитками отдельным блоком
     под первым экраном;
   • «Новости» — крупный заголовок, стрелки справа от него,
     карточки с прямыми углами;
   • строго: без теней и без скруглений;
   • прелоадер: экран с логотипом, пока грузится страница (не меньше 2,5 с);
   • внизу — подвал со ссылками вместо одинокого значка «0+».

   Шапку, плитки, разбивку заголовка и подвал собирает
   mgutm-home.js. Здесь их вид, плюс всё, что работает и без
   скрипта. Правила главной начинаются с html:has(#sectionPhoto):
   #sectionPhoto — первый экран, он есть только на главной, так
   что файл можно подключить и на всём сайте. Шапка оформляется
   только при классе html.mg-hdr-on — его ставит скрипт, собрав
   новое меню; без скрипта остаётся шапка из /Plans/table.js.

   На странице есть свой инлайновый <style> с множеством
   !important (a.app_store_btn, .card, .news-tag…). Поэтому здесь
   селекторы с id и тоже !important — иначе не перебить.

   Выкладка: файл в /css/ и последней строкой в <head> мастер-страницы
   <link rel="stylesheet" href="/css/mgutm-home.css?v=2">
   Путь — от корня сайта, с «/» в начале, иначе на внутренних страницах
   (Dek/, Ved/…) файл не найдётся. В <head>, а не в <body>: иначе до
   загрузки файла успевает мелькнуть старая страница, а карусель
   новостей считает ширины без наших стилей.
   ============================================================ */

:root {
    --mg-font: "Golos Text", Golos, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --mg-ink: #141c28;
    --mg-text: #1f2937;
    --mg-muted: #5b6472;
    --mg-line: #e2e6ec;
    --mg-bg: #eef0f2;
    --mg-soft: #eef2f7;
    --mg-navy: #1b2636;
    --mg-accent: #2761af;          /* акцент: кнопки, иконки при наведении, ссылки */
    --mg-accent-hover: #1f5296;
    --mg-hdr-h: 72px;
    /* Левый край содержимого: .body-content — max-width 1300px и поля
       по 15px. --mg-vw — ширина окна без полосы прокрутки (ставит
       скрипт); с 100vw поля первого экрана уезжали на полполосы. */
    --mg-gutter: max(16px, calc((var(--mg-vw, 100vw) - 1300px) / 2 + 15px));
}

/* ------------------------------------------------------------
   ПРЕЛОАДЕР

   Экран загрузки — с первой отрисовки и без разметки: псевдо-
   элементы html (::before — белый фон с логотипом, ::after —
   полоса). Скрипт убирает его классом html.mg-loaded, когда
   загрузилось всё (событие load) и с начала загрузки прошло не
   меньше CONFIG.preloaderMin (2,5 с), — плавно, за 0,6 с. Не дошёл
   скрипт — экран уходит сам через 10 с (анимация mg-pre-out), чтобы
   страница не осталась закрытой.
   ------------------------------------------------------------ */
html::before,
html::after {
    content: '';
    position: fixed;
    z-index: 2147483000;
    animation: mg-pre-out .6s ease 10s forwards;
}
html::before {
    inset: 0;
    background: url('/img/logo/logo.png') center calc(50% - 24px) / auto 64px no-repeat, #fff;
}
/* полоса: заливка — отдельным фоном поверх дорожки; до 90 % растёт
   сама, до конца — когда страница готова */
html::after {
    top: calc(50% + 36px);
    left: 50%;
    width: 180px;
    height: 3px;
    margin-left: -90px;
    background: linear-gradient(var(--mg-accent), var(--mg-accent)) left center / 0 100% no-repeat, var(--mg-line);
    animation: mg-pre-bar 2.4s cubic-bezier(.2, .7, .3, 1) forwards, mg-pre-out .6s ease 10s forwards;
}
html.mg-loaded::before,
html.mg-loaded::after {
    opacity: 0;
    visibility: hidden;
    animation: none;
    transition: opacity .6s ease, visibility 0s linear .6s;
}
html.mg-loaded::after {
    background-size: 100% 100%, auto;
}
@keyframes mg-pre-bar {
    to { background-size: 90% 100%, auto; }
}
@keyframes mg-pre-out {
    to { opacity: 0; visibility: hidden; }
}
@media (prefers-reduced-motion: reduce) {
    html::after {
        background-size: 60% 100%, auto;
        animation: mg-pre-out .6s ease 10s forwards;
    }
}
@media print {
    html::before,
    html::after {
        display: none;
    }
}

/* Строгий вид: без скруглений вообще. Свои правила здесь и так с 0,
   а это — для чужих: индикаторы слайдера сайта, поля и таблицы
   DevExpress, окно «Версия для слабовидящих» из table.js (там
   .dst-settings .btn с !important). :not(#mg-none) — только ради веса
   id, чтобы перебить и такие правила; элемента с этим id нет.
   html.mg-hdr-on ставит скрипт. */
html.mg-hdr-on body *:not(#mg-none),
html.mg-hdr-on body *:not(#mg-none)::before,
html.mg-hdr-on body *:not(#mg-none)::after {
    border-radius: 0 !important;
}

/* общий класс иконок скрипта: контурные, цвет от текста */
.mg-ico {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ------------------------------------------------------------
   ШАПКА

   Высота 72px. По умолчанию — тёмная полупрозрачная с размытием.
   Прозрачная — только при html.mg-hdr-top: скрипт ставит этот
   класс на главной, пока страница не прокручена и меню закрыто.
   Без скрипта класса нет, и белый текст не окажется на светлом.

   Логотип (тёмно-синие буквы + зелёная «U») на тёмном фоне почти
   не виден — кладём его на белую плитку, как эмблему у volgmed.

   Брендовых ссылок две — полная и короткая, сайт сам показывает
   одну из них по ширине окна. Поэтому display у них не трогаем.
   ------------------------------------------------------------ */
html.mg-hdr-on #ctl00_navbarMenu {
    height: var(--mg-hdr-h) !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: rgba(27, 38, 54, .94) !important;
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    backdrop-filter: saturate(160%) blur(14px);
    border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
    transition: background-color .25s, border-color .25s !important;
}
html.mg-hdr-on.mg-hdr-top #ctl00_navbarMenu {
    background: transparent !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-bottom-color: transparent !important;
}
html.mg-hdr-on #ctl00_navbarMenu > .container {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 1300px !important;  /* у Compitations в инлайне .container 1700px !important */
    height: 100%;
    margin: 0 auto;
    padding: 0 15px !important;
}
/* clearfix бутстрапа во flex-контейнере стал бы лишними элементами */
html.mg-hdr-on #ctl00_navbarMenu > .container::before,
html.mg-hdr-on #ctl00_navbarMenu > .container::after {
    display: none !important;
}
/* у сайта здесь padding-left: 25px — логотип стоял правее текста страницы */
html.mg-hdr-on #ctl00_navbarMenu .navbar-header {
    flex: 0 1 auto;
    min-width: 0;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* название — по левому краю: на главной обёртка .navbar-header.page-scroll
   центрирует текст, и на телефоне две строки названия вставали по центру */
html.mg-hdr-on #ctl00_navbarMenu .navbar-header {
    text-align: left !important;
}
html.mg-hdr-on #ctl00_navbarMenu :is(a.navbar-brand, a.navbar-ubr) {
    float: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    font: 600 17px/1.2 var(--mg-font) !important;
    letter-spacing: -.01em;
    color: #fff !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* логотип у названия (его ставит table.js) не показываем — в шапке только
   надпись */
html.mg-hdr-on #ctl00_navbarMenu .dst-logo {
    display: none !important;
}
/* старые элементы шапки: родное меню, бургер бутстрапа, шапка table.js */
html.mg-hdr-on #ctl00_navbarMenu .navbar-collapse,
html.mg-hdr-on button.navbar-toggle,
html.mg-hdr-on .dst-hdr {
    display: none !important;
}

.mg-hdr {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 28px;
    font-family: var(--mg-font);
}
.mg-nav {
    display: flex;
    align-items: center;
    gap: 2px;
}
.mg-nav__item {
    position: relative;
}
.mg-nav__btn,
.mg-nav__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: rgba(255, 255, 255, .86) !important;
    font: 500 15px/1 var(--mg-font);
    text-decoration: none !important;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .15s, color .15s;
}
.mg-nav__btn:hover,
.mg-nav__link:hover,
.mg-nav__item.is-open > .mg-nav__btn {
    background: rgba(255, 255, 255, .1);
    color: #fff !important;
}
.mg-nav__btn:focus-visible,
.mg-nav__link:focus-visible,
.mg-iconbtn:focus-visible,
.mg-lk:focus-visible,
html.mg-hdr-on a.navbar-brand:focus-visible,
.mg-footer a:focus-visible {
    outline: 2px solid rgba(255, 255, 255, .7) !important;
    outline-offset: 2px;
}

/* Обводка фокуса. Bootstrap 3 рисует её на a:focus и .btn:focus — то есть
   и после щелчка мышью (скруглённое кольцо вокруг названия вуза и кнопок).
   Щелчок — без обводки; с клавиатуры (Tab) — остаётся, но прямоугольная,
   акцентом: без неё не видно, где фокус. На тёмной шапке и в подвале —
   белая (правило выше) */
html :focus:not(:focus-visible) {
    outline: none !important;
}
/* вес — чуть больше, чем у a:focus Bootstrap, и меньше наших правил вида
   .класс:focus-visible (у пунктов меню — подсветка фоном, без обводки) */
html a:focus-visible,
html button:focus-visible,
html summary:focus-visible,
html [role="button"]:focus-visible,
html input[type="checkbox"]:focus-visible,
html input[type="radio"]:focus-visible {
    outline: 2px solid var(--mg-accent);
    outline-offset: 2px;
}
.mg-nav__chev {
    width: 16px;
    height: 16px;
    stroke-width: 2;
    opacity: .75;
    transition: transform .2s;
}
.mg-nav__item.is-open .mg-nav__chev {
    transform: rotate(180deg);
}

/* выпадающая панель группы */
.mg-drop {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 10;
    min-width: 300px;
    padding: 8px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .18s, transform .18s, visibility 0s .18s;
}
/* «мостик» над панелью: курсор идёт от кнопки вниз и не теряет пункт */
.mg-drop::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -12px;
    height: 12px;
}
.mg-nav__item.is-open > .mg-drop {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .18s, transform .18s;
}
.mg-drop__link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 0;
    color: var(--mg-text) !important;
    font: 500 15px/1.3 var(--mg-font);
    text-decoration: none !important;
    transition: background-color .15s;
}
.mg-drop__link:hover,
.mg-drop__link:focus-visible {
    outline: none;
    background: #f3f5f8;
}
.mg-drop__ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 0;
    background: var(--mg-soft);
    color: #243a51;
    transition: background-color .15s, color .15s;
}
.mg-drop__link:hover .mg-drop__ico,
.mg-drop__link:focus-visible .mg-drop__ico {
    background: var(--mg-accent);
    color: #fff;
}

/* кнопки справа */
.mg-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}
.mg-iconbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 0;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    cursor: pointer;
    transition: background-color .15s;
}
.mg-iconbtn:hover {
    background: rgba(255, 255, 255, .16);
}
.mg-lk {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px 0 14px;
    border-radius: 0;
    background: var(--mg-accent);
    color: #fff !important;
    font: 600 14px/1 var(--mg-font);
    text-decoration: none !important;
    white-space: nowrap;
    transition: background-color .15s;
}
.mg-lk:hover {
    background: var(--mg-accent-hover);
}
/* После входа — «Перейти в профиль»: под кнопкой меню учётной записи
   (те же пункты, что в родном меню «Личный кабинет»), «Выход» за линией.
   Панель — прижатой к правому краю кнопки: она у края шапки. */
.mg-acc__chev {
    width: 16px;
    height: 16px;
    margin: 0 -4px 0 2px;
    stroke-width: 2;
    opacity: .85;
    transition: transform .2s;
}
.mg-acc.is-open .mg-acc__chev {
    transform: rotate(180deg);
}
.mg-acc.is-open > .mg-acc__btn {
    background: var(--mg-accent-hover);
}
.mg-drop--acc {
    right: 0;
    left: auto;
    min-width: 280px;
}
.mg-drop__sep {
    height: 1px;
    margin: 6px 4px;
    background: var(--mg-line);
}
button.mg-drop__link {
    width: 100%;
    margin: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.mg-drop__link--logout:hover .mg-drop__ico,
.mg-drop__link--logout:focus-visible .mg-drop__ico {
    background: #b42318;
    color: #fff;
}
.mg-burger {
    display: none;
}

/* панель меню на телефоне и планшете */
.mg-sheet {
    position: fixed;
    top: calc(var(--mg-hdr-h) + 8px);
    left: 12px;
    right: 12px;
    z-index: 1040;
    max-height: calc(100vh - var(--mg-hdr-h) - 20px);
    overflow-y: auto;
    padding: 12px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    font-family: var(--mg-font);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .2s, transform .2s, visibility 0s .2s;
}
html.mg-sheet-open .mg-sheet {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity .2s, transform .2s;
}
/* затемнение — ниже шапки, чтобы кнопка закрытия оставалась доступной */
.mg-sheet-backdrop {
    position: fixed;
    inset: var(--mg-hdr-h) 0 0 0;
    z-index: 1035;
    background: rgba(10, 16, 24, .45);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s, visibility 0s .2s;
}
html.mg-sheet-open .mg-sheet-backdrop {
    opacity: 1;
    visibility: visible;
    transition: opacity .2s;
}
html.mg-sheet-open,
html.mg-sheet-open body {
    overflow: hidden !important;
}
.mg-sheet__lk {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    margin-bottom: 6px;
    padding: 0 16px;
    border-radius: 0;
    background: var(--mg-accent);
    color: #fff !important;
    font: 600 16px/1 var(--mg-font);
    text-decoration: none !important;
}
.mg-sheet__arr {
    margin-left: auto;
}
.mg-sheet__group {
    padding: 10px 0 4px;
}
.mg-sheet__group + .mg-sheet__group {
    border-top: 1px solid var(--mg-line);
}
.mg-sheet__title {
    padding: 4px 10px 6px;
    font: 600 12px/16px var(--mg-font);
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8a94a6;
}

@media (max-width: 1180px) {
    .mg-nav__link { display: none; }
}
@media (max-width: 991px) {
    .mg-nav { display: none; }
    .mg-burger { display: inline-flex; }
    .mg-lk { width: 40px; padding: 0; justify-content: center; }
    .mg-lk span,
    .mg-acc__chev { display: none; }
}
@media (max-width: 600px) {
    /* Полное название рядом с тремя кнопками в строку не влезает — две
       строки: «МГУТУ» крупно, «имени К.Г. Разумовского» мельче (span делит
       скрипт, splitBrand). display самой ссылки не трогаем — его
       переключает сайт (полное / короткое название по ширине окна). */
    html.mg-hdr-on #ctl00_navbarMenu :is(a.navbar-brand, a.navbar-ubr) {
        line-height: 1 !important;
    }
    html.mg-hdr-on #ctl00_navbarMenu .mg-brand__main {
        display: block;
        font: 700 17px/1.1 var(--mg-font);
        letter-spacing: .01em;
    }
    html.mg-hdr-on #ctl00_navbarMenu .mg-brand__sub {
        display: block;
        overflow: hidden;
        margin-top: 2px;
        color: rgba(255, 255, 255, .78);
        font: 500 12px/1.25 var(--mg-font);
        letter-spacing: 0;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .mg-hdr { margin-left: 12px; }
}
@media (max-width: 359px) {
    /* самые узкие телефоны (320px) — вторая строка мельче, чтобы влезла */
    html.mg-hdr-on #ctl00_navbarMenu .mg-brand__sub {
        font-size: 10.5px;
    }
}


/* ------------------------------------------------------------
   ПЕРВЫЙ ЭКРАН — во всю ширину окна, под прозрачной шапкой

   Секция внутри .container, поэтому растягиваем отрицательными
   полями. Ширина — --mg-vw из скрипта: это ширина окна без
   полосы прокрутки. Без скрипта — 100vw, а полосу, на которую
   тогда секция заедет, обрезает overflow-x: clip у body.

   Затемнение — градиентом: сверху темнее под шапку, снизу —
   под текст; середина фото остаётся светлой.
   ------------------------------------------------------------ */
html:has(#sectionPhoto) body {
    background: var(--mg-bg) !important;
    overflow-x: clip;
}
/* у обёрток страницы свои светлые фоны (#efefef, #faf9f9) и тень —
   под плитками и новостями торчала белая подложка с краями */
html:has(#sectionPhoto) .contenting,
html:has(#sectionPhoto) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#sectionPhoto) .body-content {
    padding-top: 0 !important;
}
html:has(#sectionPhoto) #sectionPhoto {
    position: relative;
    width: var(--mg-vw, 100vw);
    max-width: none;
    height: clamp(620px, 92vh, 880px);
    margin: 0 calc(50% - var(--mg-vw, 100vw) / 2) !important;
}
/* у слайдера и его фоновых слоёв сайт ставит скругление 20px —
   во всю ширину окна углы не нужны */
html:has(#sectionPhoto) #sectionPhoto .hero-slider {
    height: 100%;
    border-radius: 0 !important;
}
html:has(#sectionPhoto) #sectionPhoto :is(.hero-backgrounds, .hero-bg) {
    border-radius: 0 !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero {
    height: 100%;
    min-height: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero > .rgba-black-strong {
    height: 100%;
    min-height: 0 !important;
    justify-content: flex-start !important;
    align-items: flex-end !important;
    padding: calc(var(--mg-hdr-h) + 32px) var(--mg-gutter) clamp(56px, 9vh, 96px) !important;
    border-radius: 0 !important;
    text-align: left !important;
    background: linear-gradient(180deg,
        rgba(8, 13, 22, .72) 0%,
        rgba(8, 13, 22, .22) 30%,
        rgba(8, 13, 22, .34) 58%,
        rgba(8, 13, 22, .86) 100%) !important;
}
/* блок текста — flex-элемент, без flex-grow сжимался по самому
   узкому содержимому; растягиваем до 980px */
html:has(#sectionPhoto) #ctl00_MainContent_hero > .rgba-black-strong > div:last-child {
    flex: 1 1 auto;
    width: 100%;
    max-width: 980px;
}
/* у сайта h1.text-h1 { max-width: 550px } — крупная строка
   ломалась на четыре строки */
html:has(#sectionPhoto) #ctl00_MainContent_hero h1.text-h1 {
    max-width: none !important;
    margin: 0 !important;
    font: 600 clamp(30px, 3.6vw, 52px)/1.08 var(--mg-font) !important;
    letter-spacing: -.025em !important;
    text-transform: none !important;
    text-shadow: none !important;
    color: #fff !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero h1.text-h1 br {
    display: none;
}
/* заголовок, разделённый скриптом: надзаголовок + крупная строка */
html:has(#sectionPhoto) #ctl00_MainContent_hero .mg-hero-eyebrow {
    display: block;
    max-width: 640px;
    margin: 0 0 18px;
    font: 500 clamp(15px, 1.35vw, 19px)/1.35 var(--mg-font) !important;
    letter-spacing: 0;
    color: rgba(255, 255, 255, .78) !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero .mg-hero-title {
    display: block;
    font: 600 clamp(40px, 5.6vw, 84px)/1 var(--mg-font) !important;
    letter-spacing: -.035em;
    color: #fff !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero p.text {
    max-width: 620px;
    margin: 22px 0 0 !important;
    font: 400 17px/1.55 var(--mg-font) !important;
    text-transform: none !important;
    color: rgba(255, 255, 255, .82) !important;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero p.text:has(> span:empty) {
    display: none !important;
}

/* две главные кнопки первого экрана (ставит скрипт) */
.mg-hero-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}
.mg-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 52px;
    padding: 0 22px 0 18px;
    border-radius: 0;
    font: 600 16px/1 var(--mg-font) !important;
    text-decoration: none !important;
    transition: background-color .15s, transform .15s;
}
.mg-btn .mg-ico {
    width: 20px;
    height: 20px;
}
.mg-btn--accent {
    background: var(--mg-accent);
    color: #fff !important;
}
.mg-btn--accent:hover {
    background: var(--mg-accent-hover);
}
.mg-btn--glass {
    border: 1px solid rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .12);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    color: #fff !important;
}
.mg-btn--glass:hover {
    background: rgba(255, 255, 255, .2);
}

/* полоски слайдера — справа внизу */
html:has(#sectionPhoto) #sectionPhoto .slider-indicators {
    left: auto !important;
    right: var(--mg-gutter) !important;
    bottom: clamp(28px, 5vh, 48px) !important;
    transform: none !important;
    z-index: 3;
}

/* без скрипта кнопки остаются в первом экране — «стеклом» */
html:has(#sectionPhoto) #ctl00_MainContent_hero .block-button {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    width: auto !important;
    margin-top: 28px;
}
html:has(#sectionPhoto) #ctl00_MainContent_hero .block-button a.app_store_btn {
    display: inline-flex !important;
    align-items: center;
    float: none !important;
    width: auto !important;
    height: 44px;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid rgba(255, 255, 255, .2) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .12) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    color: #fff !important;
    font: 500 15px/1 var(--mg-font) !important;
}


/* ------------------------------------------------------------
   БЫСТРЫЙ ДОСТУП — плитки под первым экраном

   Скрипт переносит сюда кнопки первого экрана (те же ссылки,
   с теми же иконками из table.js). Отдельный блок под фото, без
   теней: белая плитка с тонкой рамкой, при наведении рамка
   темнее, значок — зелёный.
   ------------------------------------------------------------ */
html:has(#sectionPhoto) .mg-quick {
    position: relative;
    z-index: 3;
    margin: 32px 0 0;
}
/* у сайта .block-button { width: 1095px } — плитки не доходили до края */
html:has(#sectionPhoto) .mg-quick .block-button {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    width: auto !important;
    margin: 0;
}
html:has(#sectionPhoto) .mg-quick a.app_store_btn {
    position: relative;
    display: flex !important;
    align-items: center;
    gap: 14px;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    height: 80px;
    margin: 0 !important;
    padding: 0 44px 0 16px !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--mg-text) !important;
    font: 600 16px/1.25 var(--mg-font) !important;
    text-align: left;
    text-decoration: none !important;
    transition: border-color .15s !important;
}
html:has(#sectionPhoto) .mg-quick a.app_store_btn:hover {
    border-color: #c9d2de !important;
    background: #fff !important;
    color: var(--mg-ink) !important;
}
/* подпись сжимается и переносится, а не уходит под стрелку (крупный текст) */
html:has(#sectionPhoto) .mg-quick a.app_store_btn > span {
    min-width: 0;
}
/* значок в плитке: SVG из table.js или, без него, родной Font Awesome */
html:has(#sectionPhoto) .mg-quick a.app_store_btn :is(svg.dst-appicon, i.fa) {
    box-sizing: content-box;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    margin: 0 !important;
    padding: 11px;
    border-radius: 0;
    background: var(--mg-soft);
    color: #243a51 !important;
    fill: currentColor;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    transition: background-color .18s, color .18s;
}
html:has(#sectionPhoto) .mg-quick a.app_store_btn:hover :is(svg.dst-appicon, i.fa) {
    background: var(--mg-accent);
    color: #fff !important;
}
.mg-tile__arr {
    position: absolute;
    top: 50%;
    right: 16px;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    fill: none;
    stroke: #9aa3b2;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .18s, stroke .18s;
}
html:has(#sectionPhoto) .mg-quick a.app_store_btn:hover .mg-tile__arr {
    transform: translateX(3px);
    stroke: var(--mg-accent);
}

@media (max-width: 991px) {
    html:has(#sectionPhoto) .mg-quick .block-button {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 480px) {
    html:has(#sectionPhoto) .mg-quick .block-button { gap: 8px; }
    /* в две колонки «Личный кабинет» и «Преподаватели» упирались
       в край — подпись может уйти на вторую строку */
    html:has(#sectionPhoto) .mg-quick a.app_store_btn {
        gap: 8px;
        height: 64px;
        padding: 0 8px !important;
        border-radius: 0 !important;
        font-size: 13.5px !important;
        line-height: 1.2 !important;
    }
    html:has(#sectionPhoto) .mg-quick a.app_store_btn > span {
        min-width: 0;
    }
    html:has(#sectionPhoto) .mg-quick a.app_store_btn :is(svg.dst-appicon, i.fa) {
        width: 20px;
        height: 20px;
        padding: 7px;
        border-radius: 0;
    }
    .mg-tile__arr { display: none; }
}


/* ------------------------------------------------------------
   НОВОСТИ

   Заголовок — крупный, слева; стрелки карусели — справа от него
   (у стрелок свой блок под каруселью, поднимаем его абсолютно).
   Карточки: прямые углы, без теней, фото 16:10, метки плашками,
   «Подробнее» — кнопка со стрелкой. «Подробнее» — кнопка
   DevExpress с постбэком: меняем только вид, не разметку.
   ------------------------------------------------------------ */
html:has(#sectionPhoto) #ctl00_MainContent_app_features11 {
    margin-top: 88px;
}
html:has(#sectionPhoto) section.app_features2 {
    position: relative;
    padding: 0 !important;
    background: none !important;
}
html:has(#sectionPhoto) section.app_features2 > .divider-new {
    display: block !important;
    margin: 0 0 28px !important;
    padding: 0 !important;
    text-align: left !important;
}
html:has(#sectionPhoto) section.app_features2 > .divider-new::before,
html:has(#sectionPhoto) section.app_features2 > .divider-new::after {
    display: none !important;
}
html:has(#sectionPhoto) section.app_features2 > .divider-new h2 {
    margin: 0 !important;
    padding: 0 !important;
    font: 600 clamp(32px, 4vw, 54px)/1.05 var(--mg-font) !important;
    letter-spacing: -.03em !important;
    text-transform: none !important;
    text-align: left !important;
    color: var(--mg-ink) !important;
}
html:has(#sectionPhoto) section.app_features2 > .carousel-multi-item {
    position: absolute;
    top: 4px;
    right: 0;
    margin: 0 !important;
}
html:has(#sectionPhoto) section.app_features2 .controls-top {
    display: flex;
    gap: 8px;
    margin: 0 !important;
}
html:has(#sectionPhoto) section.app_features2 .controls-top a.btn-floating {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 52px !important;
    height: 52px !important;
    margin: 0 !important;
    border: 1px solid #d9dee6 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    transition: background-color .15s, border-color .15s;
}
html:has(#sectionPhoto) section.app_features2 .controls-top a.btn-floating i {
    font-size: 15px !important;
    line-height: 1 !important;
    color: var(--mg-ink) !important;
}
html:has(#sectionPhoto) section.app_features2 .controls-top a.btn-floating:hover {
    border-color: var(--mg-navy) !important;
    background: var(--mg-navy) !important;
}
html:has(#sectionPhoto) section.app_features2 .controls-top a.btn-floating:hover i {
    color: #fff !important;
}

/* Карточки — вровень с заголовком «Новости» и плитками. Owl
   считает ширину пунктов по ширине #owl-demo при запуске, а этот
   файл подключён в <head> и к запуску уже действует, так что
   расчёт совпадает. Поля: контейнер без своих 15px, у карусели
   −8px по бокам, у пункта по 8px — первая карточка встаёт ровно
   на край содержимого, между карточками 16px. */
html:has(#sectionPhoto) section.app_features2 > .container {
    width: auto !important;
    padding: 0 !important;
}
html:has(#sectionPhoto) #owl-demo {
    width: auto !important;
    margin: 0 -8px !important;
}
html:has(#sectionPhoto) #owl-demo .owl-item > div {
    padding: 0 !important;         /* у сайта 0 2px — карточки съезжали на 2px */
}
html:has(#sectionPhoto) #owl-demo .owl-item [class*="col-md-4"] {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 8px !important;
}
/* Карточки одной высоты, «Подробнее» — по нижнему краю. Ряд owl
   собран на float, переводим на flex; листает owl сдвигом всего
   ряда (transform), от раскладки внутри это не зависит. */
html:has(#sectionPhoto) #owl-demo .owl-wrapper {
    display: flex !important;
}
html:has(#sectionPhoto) #owl-demo .owl-item {
    display: flex;
    float: none !important;
}
html:has(#sectionPhoto) #owl-demo .owl-item > div,
html:has(#sectionPhoto) #owl-demo .owl-item [class*="col-md-4"] {
    display: flex;
}
html:has(#sectionPhoto) #owl-demo .owl-item > div {
    width: 100%;
}
html:has(#sectionPhoto) #owl-demo .card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}
html:has(#sectionPhoto) #owl-demo .card-body .dxbButton_MaterialCompact {
    align-self: flex-start;
    margin-top: auto !important;
}
html:has(#sectionPhoto) #owl-demo .card {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    margin-bottom: 0 !important;
    overflow: hidden;
    border: 1px solid transparent !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    transition: border-color .15s;
}
html:has(#sectionPhoto) #owl-demo .card:hover {
    border-color: #c9d2de !important;
}
html:has(#sectionPhoto) #owl-demo .card .view {
    border-radius: 0 !important;
}
html:has(#sectionPhoto) #owl-demo .card .view img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}
html:has(#sectionPhoto) #owl-demo .card-body {
    padding: 18px 20px 20px !important;
}
html:has(#sectionPhoto) #owl-demo .news-tags {
    gap: 6px !important;
    margin: 0 0 12px !important;
}
html:has(#sectionPhoto) #owl-demo .news-tag {
    padding: 5px 10px !important;
    border-radius: 0 !important;
    background: var(--mg-soft) !important;
    color: #243a51 !important;
    font: 500 12px/1.2 var(--mg-font) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;   /* у сайта метки капсом */
}
html:has(#sectionPhoto) #owl-demo .news-tag:hover {
    background: #e3e9f1 !important;
    color: #243a51 !important;
}
/* у сайта заголовок карточки высотой 35px — вторая строка
   обрезалась посередине; теперь до трёх строк с многоточием */
html:has(#sectionPhoto) #owl-demo .card-title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    height: auto !important;
    max-height: none !important;
    margin: 0 0 8px !important;
    font: 600 19px/1.3 var(--mg-font) !important;
    letter-spacing: -.01em;
    color: var(--mg-ink) !important;
}
html:has(#sectionPhoto) #owl-demo .card-text {
    margin: 0 0 16px !important;
    font: 400 14.5px/1.5 var(--mg-font) !important;
    color: var(--mg-muted) !important;
}
/* ширину 96px кнопке задаёт DevExpress — стрелка вылезала за фон */
html:has(#sectionPhoto) #owl-demo .dxbButton_MaterialCompact {
    display: inline-flex !important;
    align-items: center;
    float: none !important;
    width: auto !important;
    height: 38px;
    padding: 0 14px 0 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f1f4f8 !important;
    box-shadow: none !important;
    color: var(--mg-ink) !important;
    font: 600 14px/1 var(--mg-font) !important;
    transition: background-color .15s, color .15s;
}
html:has(#sectionPhoto) #owl-demo .dxbButton_MaterialCompact:hover {
    background: var(--mg-navy) !important;
    color: #fff !important;
}
html:has(#sectionPhoto) #owl-demo .dxbButton_MaterialCompact .dxb {
    display: flex;
    align-items: center;
    width: auto !important;
    padding: 0 !important;
}
html:has(#sectionPhoto) #owl-demo .dxbButton_MaterialCompact .dx-vam {
    font: inherit !important;
    color: inherit !important;
}
html:has(#sectionPhoto) #owl-demo .dxbButton_MaterialCompact .dx-vam::after {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-left: 8px;
    vertical-align: -2px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 767px) {
    html:has(#sectionPhoto) #ctl00_MainContent_app_features11 { margin-top: 56px; }
    html:has(#sectionPhoto) section.app_features2 > .carousel-multi-item { top: -2px; }
    html:has(#sectionPhoto) section.app_features2 .controls-top a.btn-floating {
        width: 44px !important;
        height: 44px !important;
    }
}


/* ------------------------------------------------------------
   ПОДВАЛ (собирает скрипт) — тёмный, во всю ширину

   Колонки — те же группы, что в меню. Логотипа и значка «0+»
   нет — только название. Старый блок главной со значком «0+»
   прячем, только когда подвал уже есть.
   ------------------------------------------------------------ */
html.mg-footer-on:has(#sectionPhoto) section.sub_box,
html.mg-footer-on .body-content > hr {
    display: none !important;
}
.mg-footer {
    width: var(--mg-vw, 100vw);
    margin: 96px calc(50% - var(--mg-vw, 100vw) / 2) 0;
    padding: 56px var(--mg-gutter) 28px;
    background: #141c28;
    color: rgba(255, 255, 255, .7);
    font-family: var(--mg-font);
    text-align: left;              /* иначе наследуется center от обёрток сайта */
}
/* Короткая страница (карточка группы): под подвалом до низа окна была
   светлая полоса. У body на наших страницах свой фон, поэтому фон html
   виден только ниже body — там он того же цвета, что подвал. */
html.mg-footer-on {
    background: #141c28;
}
.mg-footer__top {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr));
    gap: 32px 48px;
}
.mg-footer__brand {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
}
/* название и подпись; плашки ниже оформлены отдельно */
.mg-footer__brand > div:first-child > b {
    display: block;
    font: 600 17px/1.3 var(--mg-font);
    color: #fff;
}
.mg-footer__brand > div:first-child > span {
    display: block;
    max-width: 300px;
    margin-top: 6px;
    font: 400 14px/1.45 var(--mg-font);
    color: rgba(255, 255, 255, .6);
}
/* плашки со ссылками на другие сайты вуза — друг под другом, в тон
   тёмному подвалу (белые слишком выделялись): полупрозрачный фон и
   тонкая светлая рамка, как у кнопок шапки */
.mg-footer__sites {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 420px;               /* «Платформа онлайн-образования «РАЗУМ»» — в одну строку */
}
.mg-site {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .04);
    color: #fff !important;
    text-decoration: none !important;
    transition: background-color .15s, border-color .15s;
}
.mg-site:hover {
    border-color: rgba(255, 255, 255, .24);
    background: rgba(255, 255, 255, .08);
}
.mg-site__ico {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    transition: background-color .15s, color .15s;
}
.mg-site:hover .mg-site__ico {
    background: var(--mg-accent);
    color: #fff;
}
.mg-site__ico .mg-ico {
    width: 18px;
    height: 18px;
}
.mg-site__txt {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.mg-site__txt > b {
    color: #fff;
    font: 600 14px/1.3 var(--mg-font);
}
.mg-site__txt > span {
    color: rgba(255, 255, 255, .55);
    font: 400 12px/1.3 var(--mg-font);
}
.mg-site__ext {
    flex: none;
    width: 16px;
    height: 16px;
    color: rgba(255, 255, 255, .45);
    transition: color .15s;
}
.mg-site:hover .mg-site__ext {
    color: #fff;
}
/* соцсети — под плашками: подпись как у колонок подвала, кнопки 44px */
.mg-footer__social .mg-footer__title {
    margin: 0 0 12px;
}
.mg-footer__social-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.mg-social {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .04);
    color: #fff !important;
    text-decoration: none !important;
    transition: border-color .15s;
}
/* фон при наведении — слоем поверх рамки: градиент (фирменный цвет сети,
   --mg-social-hover из CONFIG.footerSocials) плавно проявляется через
   opacity, а сам background-image анимировать нельзя */
.mg-social::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    background: var(--mg-social-hover, var(--mg-accent));
    opacity: 0;
    transition: opacity .15s;
}
.mg-social:is(:hover, :focus-visible) {
    border-color: transparent;
}
.mg-social:is(:hover, :focus-visible)::before {
    opacity: 1;
}
.mg-social svg {
    width: 22px;
    height: 22px;
}
.mg-footer__title {
    margin: 4px 0 14px;
    font: 600 12px/16px var(--mg-font);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .45);
}
.mg-footer__col a {
    display: block;
    padding: 5px 0;
    font: 400 15px/1.4 var(--mg-font);
    color: rgba(255, 255, 255, .82) !important;
    text-decoration: none !important;
    transition: color .15s;
}
.mg-footer__col a:hover {
    color: #fff !important;
}
.mg-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 20px;
    margin-top: 44px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .1);
    font: 400 14px/1.4 var(--mg-font);
}

/* кнопка «наверх» сайта: была серым «язычком» у нижнего края.
   display не задаём — её показывает и прячет jQuery сайта.
   Здесь и ниже — html.mg-hdr-on: на всех страницах со скриптом. */
html.mg-hdr-on .scrollup {
    right: 24px !important;
    bottom: 24px !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: var(--mg-navy) !important;
    box-shadow: none !important;
    text-align: center;
    line-height: 44px !important;
    transition: background-color .15s;
}
/* Стрелка — своя, точно по центру: глиф Font Awesome стоял по базовой
   линии и был выше середины. Рисуется маской цветом текста кнопки
   (currentColor) — так она видна и в цветовых схемах для слабовидящих. */
html.mg-hdr-on .scrollup {
    color: #fff;
}
html.mg-hdr-on .scrollup i {
    display: none !important;
}
html.mg-hdr-on .scrollup::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E") center / 20px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 15l6-6 6 6'/%3E%3C/svg%3E") center / 20px no-repeat;
}
html.mg-hdr-on .scrollup:hover {
    background: var(--mg-accent) !important;
}

/* нижняя панель сайта на телефоне: серая, с тяжёлой тенью — делаем
   светлой с размытием и тонкой линией сверху, значки navy. Видна она только на узких
   экранах, display не трогаем. */
html.mg-hdr-on footer.footer {
    background: rgba(255, 255, 255, .94) !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--mg-line) !important;
    box-shadow: none !important;
}
html.mg-hdr-on footer.footer .cbutton__icon {
    font-size: 20px !important;
    color: #243a51 !important;
}

/* Нижняя навигация (скрипт ставит footer.mg-tabbar и ссылки .mg-tab).
   У сайта это «шторка» высотой в экран (top: 100%, margin-top: -35px) —
   делаем обычную панель у нижнего края: пять колонок, значок и подпись,
   текущий раздел — акцентом и полосой сверху. Показывает её сайт только
   до 599px — там и оформляем; поле iPhone снизу — env(safe-area-inset-bottom). */
@media (max-width: 599px) {
    html.mg-tabbar-on {
        --mg-tabbar-h: calc(60px + env(safe-area-inset-bottom, 0px));
    }
    html.mg-tabbar-on footer.footer.mg-tabbar {
        top: auto !important;
        bottom: 0 !important;
        z-index: 1020 !important;           /* под меню и панелью настроек */
        height: var(--mg-tabbar-h) !important;
        margin: 0 !important;
        padding: 0 0 env(safe-area-inset-bottom, 0px) !important;
        border-top: 1px solid var(--mg-line) !important;
        background: #fff !important;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        box-shadow: none !important;
    }
    html.mg-tabbar-on footer.footer.mg-tabbar > .footer-content {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        width: auto !important;
        height: 60px;
        margin: 0 !important;
        padding: 0 !important;
        line-height: normal !important;
    }
    html.mg-tabbar-on .mg-tab {
        position: relative;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        min-width: 0;
        width: auto !important;
        margin: 0 !important;               /* у сайта поля по бокам — колонка сжималась до 48px */
        padding: 0 2px !important;
        color: var(--mg-muted) !important;
        font: 500 11px/1.15 var(--mg-font) !important;
        text-decoration: none !important;
        transition: color .15s;
    }
    html.mg-tabbar-on .mg-tab .mg-ico {
        width: 22px;
        height: 22px;
    }
    html.mg-tabbar-on .mg-tab span {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    html.mg-tabbar-on .mg-tab.is-active {
        color: var(--mg-accent) !important;
    }
    html.mg-tabbar-on .mg-tab.is-active::before {
        content: '';
        position: absolute;
        top: -1px;
        right: 22%;
        left: 22%;
        height: 2px;
        background: var(--mg-accent);
    }
    /* круг-«всплеск» сайта при нажатии (.cbutton::after) не нужен */
    html.mg-tabbar-on .mg-tab::after {
        display: none !important;
    }
    /* подвал и «наверх» — над панелью */
    html.mg-tabbar-on .mg-footer {
        padding-bottom: calc(28px + var(--mg-tabbar-h)) !important;
    }
    html.mg-tabbar-on:not(.mg-footer-on) body {
        padding-bottom: var(--mg-tabbar-h) !important;
    }
    html.mg-tabbar-on .scrollup {
        bottom: calc(var(--mg-tabbar-h) + 12px) !important;
    }
}

@media (max-width: 767px) {
    html.mg-hdr-on .scrollup { bottom: 84px !important; right: 16px !important; }
    /* снизу на телефоне висит панель кабинета — не прячем под ней подвал */
    .mg-footer { margin-top: 64px; padding: 40px 16px 96px; }
    .mg-footer__top { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
    .mg-footer__brand { grid-column: 1 / -1; }
}


/* ------------------------------------------------------------
   ТЕЛЕФОН: первый экран

   Заголовок меньше, кнопки на всю ширину. Высота — по
   содержимому, но не меньше почти всего экрана.
   ------------------------------------------------------------ */
@media (max-width: 767px) {
    html:has(#sectionPhoto) #sectionPhoto {
        height: auto;
        min-height: min(88vh, 720px);
    }
    html:has(#sectionPhoto) #sectionPhoto .hero-slider,
    html:has(#sectionPhoto) #ctl00_MainContent_hero,
    html:has(#sectionPhoto) #ctl00_MainContent_hero > .rgba-black-strong {
        min-height: inherit !important;
    }
    /* у сайта на телефоне поля страницы по 5px — плитки и новости
       липли к краю; ставим 16px и так же выравниваем первый экран */
    html:has(#sectionPhoto) .body-content,
    html.mg-hdr-on:has(#sectionPhoto) #ctl00_navbarMenu > .container {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    html:has(#sectionPhoto) #ctl00_MainContent_hero > .rgba-black-strong {
        padding: calc(var(--mg-hdr-h) + 24px) 16px 64px !important;
    }
    html:has(#sectionPhoto) #ctl00_MainContent_hero .mg-hero-title {
        font-size: clamp(34px, 10vw, 44px) !important;
    }
    html:has(#sectionPhoto) #ctl00_MainContent_hero p.text {
        font-size: 15px !important;
    }
    .mg-hero-cta .mg-btn {
        flex: 1 1 100%;
        justify-content: center;
    }
    /* переключатель слайдов — по центру (на компьютере — справа) */
    html:has(#sectionPhoto) #sectionPhoto .slider-indicators {
        left: 50% !important;
        right: auto !important;
        bottom: 24px !important;
        transform: translateX(-50%) !important;
    }
    html:has(#sectionPhoto) .mg-quick {
        margin-top: 20px;
    }
}
/* Фото первого экрана на узком (портретном) экране. Картинки заданы
   инлайн-стилем background: url(…) — положение по умолчанию левый верхний
   угол, и на телефоне виден был только край кабинета без людей. Центр
   кадра — на людях; для других фото, если их сменят, — общее 60 %. */
@media (max-width: 991px) {
    html:has(#sectionPhoto) #sectionPhoto .hero-bg {
        background-position: 60% 20% !important;
    }
    /* трое студентов у монитора: лица на 46–77 % ширины — в кадре девушка
       в очках и парень */
    html:has(#sectionPhoto) #sectionPhoto .hero-bg[style*="pagemain.jpg"] {
        background-position: 64% 0% !important;
    }
    /* девушка с буклетом: лицо на ~44 % ширины */
    html:has(#sectionPhoto) #sectionPhoto .hero-bg[style*="pagemain2.jpg"] {
        background-position: 42% 20% !important;
    }
}


/* ------------------------------------------------------------
   ЯКОРЬ «#news» НА ГЛАВНОЙ

   «Все новости» со страницы новости ведут на /#news. Якорь ставит
   скрипт в начало блока новостей; scroll-margin-top — чтобы
   заголовок «Новости» не уходил под фиксированную шапку.
   ------------------------------------------------------------ */
.mg-anchor {
    display: block;
    height: 0;
    scroll-margin-top: calc(var(--mg-hdr-h) + 24px);
}


/* ------------------------------------------------------------
   СТРАНИЦА НОВОСТИ (News/NewsViewer.aspx)

   Опознаём по #ctl00_MainContent_NewsLB — это текст новости.
   Статья — белой карточкой во всю ширину сетки сайта (те же края,
   что у шапки): рамка 1px, прямые углы, без теней. Сверху вниз:
   «← Все новости», заголовок, метки, строка «дата · автор», обложка,
   текст; внизу, за линией, — кнопки «Все новости» и «Поделиться
   новостью» (в меню — только «Скопировать ссылку»).

   Всё, кроме самой карточки и текста, ставит скрипт; без него
   остаётся та же широкая карточка.

   Текст приходит из редактора с инлайновым Verdana 14pt —
   перебиваем шрифт и кегль с !important (инлайн без !important
   слабее). Заголовки внутри текста не трогаем.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_NewsLB) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_NewsLB) .contenting,
html:has(#ctl00_MainContent_NewsLB) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
/* у страницы инлайновый padding-top: 100px — отступ под нашу шапку 72px */
html:has(#ctl00_MainContent_NewsLB) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
}
html:has(#ctl00_MainContent_NewsLB) .body-content > hr {
    display: none;
}
html:has(#ctl00_MainContent_NewsLB) .body-content > .card {
    max-width: none;
    margin: 0 !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_NewsLB) .body-content > .card > .card-body {
    padding: 40px 48px 48px !important;
}

.mg-news-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 20px;
    font: 500 14px/1 var(--mg-font);
    color: var(--mg-muted) !important;
    text-decoration: none !important;
    transition: color .15s;
}
.mg-news-back:hover {
    color: var(--mg-ink) !important;
}
.mg-news-back .mg-ico {
    width: 16px;
    height: 16px;
}

/* заголовок: у сайта .card-title { height: 35px } — длинный обрезался */
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_h4title {
    height: auto !important;
    max-width: 1040px;
    margin: 0 0 16px !important;
    font: 600 clamp(30px, 3.4vw, 46px)/1.12 var(--mg-font) !important;
    letter-spacing: -.025em;
    color: var(--mg-ink) !important;
}
/* метки: у сайта капсом, скругление 24px */
html:has(#ctl00_MainContent_NewsLB) .news-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 12px !important;
}
html:has(#ctl00_MainContent_NewsLB) .news-detail-tags .news-tag {
    padding: 5px 10px !important;
    border-radius: 0 !important;
    background: var(--mg-soft) !important;
    color: #243a51 !important;
    font: 500 12px/1.2 var(--mg-font) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* строка под заголовком: дата · автор */
.mg-news-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
    font: 400 14px/1.4 var(--mg-font);
    color: var(--mg-muted);
}
.mg-news-meta__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.mg-news-meta__item .mg-ico {
    width: 16px;
    height: 16px;
    color: #8a94a6;
}

/* внизу статьи, за линией: «Все новости», «Поделиться новостью» */
.mg-news-actions {
    clear: both;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--mg-line);
}

/* «Поделиться новостью»: меню с «Скопировать ссылку». Кнопка стоит
   в самом конце статьи — меню открывается вверх, иначе вылезало бы
   за нижний край карточки. */
.mg-share {
    position: relative;
}
.mg-share__menu {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    z-index: 20;
    min-width: 100%;
    padding: 6px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
}
.mg-share__menu[hidden] {
    display: none;
}
.mg-share__item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 38px;
    margin: 0;
    padding: 0 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--mg-text) !important;
    font: 500 14px/1 var(--mg-font);
    white-space: nowrap;
    text-align: left;
    cursor: pointer;
    transition: background-color .15s;
}
.mg-share__item:hover {
    background: #f3f5f8;
}
.mg-share__item .mg-ico {
    width: 16px;
    height: 16px;
    color: var(--mg-muted);
}

/* обложка — та же картинка, что на карточке главной */
html:has(#ctl00_MainContent_NewsLB) .view.mg-news-cover {
    display: block !important;
    margin: 24px 0;
    overflow: hidden;
    border: 1px solid var(--mg-line);
    border-radius: 0;
}
html:has(#ctl00_MainContent_NewsLB) .view.mg-news-cover img {
    display: block;
    width: 100% !important;
    height: auto;
    margin: 0 !important;
    aspect-ratio: 21 / 9;          /* во всю ширину 2:1 выходило выше экрана */
    object-fit: cover;
}
html:has(#ctl00_MainContent_NewsLB) .view.mg-news-cover .mask {
    display: none !important;
}

/* текст новости */
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_visiblep {
    margin: 24px 0 0 !important;
}
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB,
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB :is(span, p, div, li, font, td) {
    font-family: var(--mg-font) !important;
    font-size: 17px !important;
    line-height: 1.7 !important;
    letter-spacing: 0 !important;
    color: #1f2937 !important;
}
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB a {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}
/* у сайта картинки со скруглением 24px; по клику скрипт открывает крупно */
html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB img {
    display: block;
    max-width: 100% !important;
    height: auto !important;
    margin: 20px 0 !important;
    border: 1px solid var(--mg-line);
    border-radius: 0 !important;
    cursor: zoom-in;
}
/* «Автор: … / Дата: …» и линия над ними — скрипт перенёс их под заголовок */
html.mg-news-on .card-body > hr,
html.mg-news-on #ctl00_MainContent_lbAuthor,
html.mg-news-on #ctl00_MainContent_lbDate {
    display: none !important;
}

.mg-btn2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font);
    text-decoration: none !important;
    cursor: pointer;
    transition: border-color .15s, background-color .15s;
}
.mg-btn2:hover {
    border-color: #c9d2de;
    background: #f7f9fc;
}
.mg-btn2 .mg-ico {
    width: 16px;
    height: 16px;
}

@media (max-width: 767px) {
    html:has(#ctl00_MainContent_NewsLB) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    html:has(#ctl00_MainContent_NewsLB) .body-content > .card {
        border-radius: 0 !important;
    }
    html:has(#ctl00_MainContent_NewsLB) .body-content > .card > .card-body {
        padding: 24px 16px !important;
    }
    html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB,
    html:has(#ctl00_MainContent_NewsLB) #ctl00_MainContent_NewsLB :is(span, p, div, li, font, td) {
        font-size: 16px !important;
    }
    /* кнопки — во всю ширину, одна под другой; width — ещё и кнопке
       внутри .mg-share: та не flex-контейнер */
    .mg-news-actions .mg-share,
    .mg-news-actions .mg-btn2 {
        flex: 1 1 100%;
        width: 100%;
    }
    .mg-news-actions .mg-btn2 {
        justify-content: center;
    }
    html:has(#ctl00_MainContent_NewsLB) .view.mg-news-cover img {
        aspect-ratio: 16 / 9;
    }
}


/* ------------------------------------------------------------
   ФАКУЛЬТЕТЫ (Dek/Default.aspx)

   Опознаём по гриду #ctl00_MainContent_ucFacultets_ASPxGridView1.
   Скрипт строит справочник: крошки, заголовок, поиск, переключатели
   разделов и карточки по трём разделам (факультеты, филиалы ВО,
   филиалы СПО). Сам грид и прежний заголовок-таблица прячутся,
   только когда справочник уже собран (html.mg-dir-on), — без
   скрипта таблица остаётся как была.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_ucFacultets_ASPxGridView1) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_ucFacultets_ASPxGridView1) .contenting,
html:has(#ctl00_MainContent_ucFacultets_ASPxGridView1) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucFacultets_ASPxGridView1) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
}
html.mg-dir-on #ctl00_MainContent_ucFacultets_ASPxGridView1,
html.mg-dir-on .body-content > h3.dst-section,
html.mg-dir-on .body-content > hr {
    display: none !important;
}

.mg-crumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px;
    font: 400 14px/1.4 var(--mg-font);
    color: var(--mg-muted);
}
.mg-crumbs > * + *::before {
    content: '/';
    margin-right: 6px;
    color: #b8c1cd;
}
.mg-crumbs a {
    color: var(--mg-muted) !important;
    text-decoration: none !important;
}
.mg-crumbs a:hover {
    color: var(--mg-ink) !important;
}
.mg-crumbs > span:last-child {
    color: var(--mg-ink);
}

.mg-dir__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px 24px;
    margin: 0 0 20px;
}
.mg-dir__title {
    margin: 0 !important;
    font: 600 clamp(30px, 3.4vw, 44px)/1.12 var(--mg-font) !important;
    letter-spacing: -.025em;
    color: var(--mg-ink) !important;
}

/* поиск */
.mg-search {
    position: relative;
    display: block;
    flex: 0 1 380px;
    margin: 0;
}
.mg-search .mg-ico {
    position: absolute;
    top: 50%;
    left: 14px;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    color: #8a94a6;
    pointer-events: none;
}
.mg-search input {
    box-sizing: border-box;
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 14px 0 42px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    color: var(--mg-ink);
    font: 400 15px/1 var(--mg-font);
    outline: none;
    transition: border-color .15s;
}
.mg-search input::placeholder {
    color: #8a94a6;
}
.mg-search input:hover {
    border-color: #c9d2de;
}
.mg-search input:focus {
    border-color: #243a51;
}

/* переключатели разделов */
.mg-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 8px;
}
.mg-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    color: var(--mg-ink);
    font: 500 14px/1 var(--mg-font);
    cursor: pointer;
    transition: border-color .15s, background-color .15s, color .15s;
}
.mg-chip b {
    font-weight: 500;
    color: #8a94a6;
}
.mg-chip:hover {
    border-color: #c9d2de;
}
.mg-chip.is-active {
    border-color: var(--mg-navy);
    background: var(--mg-navy);
    color: #fff;
}
.mg-chip.is-active b {
    color: rgba(255, 255, 255, .7);
}

/* разделы и карточки */
.mg-dir__sec {
    margin-top: 32px;
}
.mg-dir__sec[hidden],
.mg-fac[hidden] {
    display: none !important;
}
.mg-dir__h2 {
    margin: 0 0 14px !important;
    font: 600 22px/1.25 var(--mg-font) !important;
    letter-spacing: -.01em;
    color: var(--mg-ink) !important;
}
.mg-dir__h2 span {
    margin-left: 6px;
    font-weight: 500;
    color: #8a94a6;
}
.mg-dir__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.mg-fac {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 20px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    transition: border-color .15s;
}
.mg-fac:hover {
    border-color: #c9d2de;
}
.mg-fac__abbr {
    padding: 4px 8px;
    border-radius: 0;
    background: var(--mg-soft);
    color: #243a51;
    font: 600 12px/1.2 var(--mg-font);
    letter-spacing: .02em;
}
.mg-fac__name {
    margin: 0 !important;
    font: 600 17px/1.3 var(--mg-font) !important;
    letter-spacing: -.01em;
    color: var(--mg-ink) !important;
}
.mg-fac__name a {
    color: inherit !important;
    text-decoration: none !important;
}
/* вся карточка — ссылка на группы (растянутая ссылка) */
.mg-fac__name a::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 0;
}
.mg-fac__facts {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    font: 400 14px/1.4 var(--mg-font);
    color: var(--mg-muted);
}
.mg-fac__facts li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
}
.mg-fac__facts .mg-ico {
    width: 16px;
    height: 16px;
    margin-top: 2px;
    color: #8a94a6;
}
.mg-fac__facts em {
    font-style: normal;
    color: #8a94a6;
}
/* телефон кликается поверх растянутой ссылки карточки */
.mg-fac__facts a {
    position: relative;
    z-index: 1;
    color: var(--mg-text) !important;
    text-decoration: none !important;
}
.mg-fac__facts a:hover {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
}
.mg-fac__more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-top: 4px;
    font: 500 14px/1 var(--mg-font);
    color: #243a51;
}
.mg-fac__more .mg-ico {
    width: 16px;
    height: 16px;
    transition: transform .15s;
}
.mg-fac:hover .mg-fac__more {
    color: var(--mg-accent-hover);
}
.mg-fac:hover .mg-fac__more .mg-ico {
    transform: translateX(3px);
}
.mg-dir__empty {
    margin: 32px 0 0 !important;
    padding: 32px;
    border: 1px dashed #c9d2de;
    border-radius: 0;
    background: #fff;
    font: 400 15px/1.5 var(--mg-font);
    color: var(--mg-muted);
    text-align: center;
}

@media (max-width: 1100px) {
    .mg-dir__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    html:has(#ctl00_MainContent_ucFacultets_ASPxGridView1) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .mg-search { flex: 1 1 100%; }
    .mg-dir__grid { grid-template-columns: 1fr; }
    .mg-fac { padding: 16px; }
}

/* ------------------------------------------------------------
   ГРУППЫ ФАКУЛЬТЕТА (Dek/Default.aspx?mode=group&f=facultet&id=N)

   Опознаём по гриду #ctl00_MainContent_ucGroups_ASPxGridView1.
   Таблицу не заменяем — листание, сортировка и фильтры у неё
   серверные. Скрипт ставит сверху крошки, заголовок и число групп,
   в строках — метки формы обучения (.mg-form), плашки направлений
   (.mg-code), бледные нули (.mg-zero). Здесь — вид: таблица белой
   карточкой без тени, строка фильтров и пейджер в тон, курсы
   старого скрипта (.dst-chip) — нашими переключателями.
   Селекторы с id грида: у table.js правила с !important.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .contenting,
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
}
html.mg-grp-on .body-content > h3,
html.mg-grp-on .body-content > hr {
    display: none !important;
}
.mg-grp-head .mg-dir__head {
    margin-bottom: 16px;
}
.mg-grp-sub {
    margin: 8px 0 0 !important;
    font: 400 15px/1.4 var(--mg-font);
    color: var(--mg-muted);
}

/* курсы — кнопки table.js */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-listfilters {
    margin: 0 0 16px !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-fgroup {
    gap: 8px !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-flabel {
    margin-right: 4px !important;
    font: 500 14px/1 var(--mg-font) !important;
    color: var(--mg-muted) !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-chip {
    min-width: 40px;
    height: 36px !important;
    padding: 0 14px !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
    transition: border-color .15s, background-color .15s, color .15s;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-chip:hover {
    border-color: #c9d2de !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .dst-chip.is-active {
    border-color: var(--mg-navy) !important;
    background: var(--mg-navy) !important;
    color: #fff !important;
}

/* таблица — белой карточкой */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 {
    margin: 0 !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}
/* у темы MaterialCompact тени и рамки ещё у самой таблицы и у панели пейджера */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 :is(.dxgvTable_MaterialCompact, .dxgvPagerBottomPanel_MaterialCompact) {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxgvPagerBottomPanel_MaterialCompact {
    padding: 0 !important;
}
/* шапка без заливки — только линия снизу */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXHeadersRow"] > td {
    height: 44px !important;
    padding: 0 14px !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: transparent !important;
    color: var(--mg-muted) !important;
    font: 600 12px/1.3 var(--mg-font) !important;
}
/* длинный заголовок («Направление/специальность») — в две строки, а не «…» */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXHeadersRow"] td.dx-ellipsis {
    white-space: normal !important;
}

/* Ширины колонок. У таблицы table-layout: fixed и ни одной ширины с
   сервера: DevExpress делил место поровну и, где жирное название группы
   не влезало в свою долю, прятал крайние колонки (СН, ОП, план).
   Ширины — строке-«линейке» dxgvArm: по ней fixed-таблица считает
   колонки, и CSS срабатывает раньше, чем DevExpress их меряет. Порядок
   серверный: Группа, Курс, Форма, Направление, Всего, ОО, ЦН, СН, ОП,
   Учебный план. План без ширины — забирает остаток; когда места нет
   и так, DevExpress по-прежнему прячет колонки справа.
   «Группа» — 240px: названиям набора 2026 года («05.03.06ЭКОЛвэд-26/1»
   плашкой и жирным) нужно ~214px, в прежние 210px они не влезали, и
   DevExpress на всех страницах прятал «Учебный план». */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(1) {
    width: 240px !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(3) {
    width: 140px !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(4) {
    width: 150px !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(2),
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(n+5):nth-child(-n+9) {
    width: 72px !important;
}
/* текст — влево, числа — по центру, как было */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr:is([id*="DXHeadersRow"], [id*="DXDataRow"]) > td:is(:nth-child(1), :nth-child(3), :nth-child(4), :nth-child(10)),
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXHeadersRow"] > td:is(:nth-child(1), :nth-child(3), :nth-child(4), :nth-child(10)) td {
    text-align: left !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXHeadersRow"] > td:is(:nth-child(1), :nth-child(3), :nth-child(4), :nth-child(10)) table {
    margin-left: 0 !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr:is([id*="DXHeadersRow"], [id*="DXFilterRow"], [id*="DXDataRow"]) > td:first-child {
    padding-left: 20px !important;
}
/* план — имя файла, второстепенное. Переносится где угодно: иначе одно
   длинное имя («…_КолесниковаПА(переносГИА).plx») не влезало, и DevExpress
   прятал всю колонку уже на 1280px */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(10) {
    color: var(--mg-muted) !important;
    font-size: 13px !important;
    overflow-wrap: anywhere;
}
/* строка фильтров */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] > td {
    padding: 8px 10px !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: #fbfcfd !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] input {
    box-sizing: border-box !important;
    height: 34px !important;
    padding: 0 10px !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--mg-ink) !important;
    font: 400 13px/1 var(--mg-font) !important;
    outline: none !important;
    transition: border-color .15s;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] input:hover {
    border-color: #c9d2de !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] input:focus {
    border-color: #243a51 !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] input::placeholder {
    color: #8a94a6;
}
/* строки */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td {
    height: 52px !important;
    padding: 8px 14px !important;
    border-bottom: 1px solid #eef1f6 !important;
    color: var(--mg-text) !important;
    font: 400 14px/1.35 var(--mg-font) !important;
    font-variant-numeric: tabular-nums;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]:hover > td {
    background: #f7f9fc !important;
}
/* под последней строкой — линия пейджера или рамка карточки; dst-lastvis —
   последняя видимая, когда table.js прячет строки фильтром по курсу */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]:is(:last-child, .dst-lastvis) > td {
    border-bottom: 0 !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 a.mg-grp-link {
    color: var(--mg-ink) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    white-space: nowrap;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 a.mg-grp-link:hover {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 a.mg-code {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 0;
    background: var(--mg-soft);
    color: #243a51 !important;
    font: 500 13px/1.2 var(--mg-font) !important;
    text-decoration: none !important;
    transition: background-color .15s;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 a.mg-code:hover {
    background: #e2e9f2;
}
.mg-form {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 0;
    font: 500 12px/1.3 var(--mg-font);
    white-space: nowrap;
}
.mg-form--full { background: #e7f6ee; color: #15803d; }
.mg-form--mix  { background: #fff4e5; color: #b54708; }
.mg-form--ext  { background: #eaf1fd; color: #1d4ed8; }
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td.mg-zero {
    color: #b8c1cd !important;
}

/* Уже 1200px — плотнее, а план прячем сами: сжатый до пары букв он
   бесполезен, а DevExpress его, переносимый, прятать уже не станет.
   Без этого на планшете пропадали ЦН, СН и ОП. Селекторы той же
   специфичности, что выше, — побеждают порядком. */
@media (max-width: 1199px) {
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr > td:nth-child(10) {
        display: none !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXHeadersRow"] > td,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] > td {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr:is([id*="DXHeadersRow"], [id*="DXFilterRow"], [id*="DXDataRow"]) > td:first-child {
        padding-left: 16px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(1) {
        width: 180px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(2) {
        width: 56px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(3) {
        width: 140px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(4) {
        width: 112px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(n+5):nth-child(-n+5) {
        width: 56px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr.dxgvArm > td:nth-child(n+6):nth-child(-n+9) {
        width: 42px !important;
    }
}

/* пейджер */
/* подпись «Страница 1 из 2 (Всего элементов: 47)» слева, кнопки справа */
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxpLite_MaterialCompact {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    width: 100%;
    padding: 12px 16px 12px 20px !important;
    border-top: 1px solid var(--mg-line) !important;
    font-family: var(--mg-font) !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxp-summary {
    margin: 0 auto 0 0 !important;
    padding: 0 12px 0 0 !important;
    color: var(--mg-muted) !important;
    font: 400 13px/1 var(--mg-font) !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 :is(.dxp-num, .dxp-button) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    margin: 0 !important;
    padding: 0 8px !important;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--mg-ink) !important;
    font: 500 13px/1 var(--mg-font) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: border-color .15s;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 :is(.dxp-num, .dxp-button):hover {
    border-color: #c9d2de !important;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxp-num.dxp-current {
    border-color: var(--mg-navy) !important;
    background: var(--mg-navy) !important;
    color: #fff !important;
    cursor: default;
}
html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxp-disabledButton {
    opacity: .4;
    cursor: default;
}

/* Телефон: строки — карточками. На узком экране DevExpress прячет
   колонки справа (dxgvAH), а table.js — кнопку, которая их раскрывает,
   и из десяти колонок оставались «Группа» и «Курс». Здесь таблица
   становится списком: группа и курс, под ними метки формы и
   направления, дальше цифры с подписями и файл плана. Шапку прячем —
   у цифр свои подписи; из строки фильтров остаётся поиск по группе.
   Порядок колонок тот же, серверный (см. ширины выше). */
@media (max-width: 767px) {
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 {
        border-radius: 0 !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 > tbody,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 > tbody > tr,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 > tbody > tr > td,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxgvTable_MaterialCompact,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxgvTable_MaterialCompact > tbody {
        display: block !important;
        width: auto !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
        display: none !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] {
        display: block !important;
        border-bottom: 1px solid var(--mg-line);
        background: #fbfcfd;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] > td {
        display: none !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] > td:first-child {
        display: block !important;
        padding: 12px 16px !important;
        border: 0 !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] input {
        height: 40px !important;
        font-size: 15px !important;
    }

    /* карточка: ::before и ::after — переносы строк между «этажами» */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        column-gap: 14px;
        padding: 14px 16px;
        border-bottom: 1px solid #eef1f6;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]:is(:last-child, .dst-lastvis) {
        border-bottom: 0;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]::before,
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]::after {
        content: '';
        flex-basis: 100%;
        height: 0;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]::before {
        order: 3;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"]::after {
        order: 6;
    }
    /* dxgvAIC — служебная ячейка, её прячет table.js, не показываем */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:not(.dxgvAIC) {
        display: block !important;
        width: auto !important;
        height: auto !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(1) {
        order: 1;
        flex: 1 1 auto;
        font-size: 15px !important;
    }
    /* «1» → «1 курс» */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(2) {
        order: 2;
        color: var(--mg-muted) !important;
        font-size: 13px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(2)::after {
        content: '\00a0\043A\0443\0440\0441';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:is(:nth-child(3), :nth-child(4)) {
        order: 4;
        margin-top: 8px;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(n+5):nth-child(-n+9) {
        order: 7;
        margin-top: 10px;
        font-size: 13px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(n+5):nth-child(-n+9)::before {
        color: var(--mg-muted);
    }
    /* подписи: Всего, ОО, ЦН, СН, ОП */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(5)::before {
        content: '\0412\0441\0435\0433\043E\00a0';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(6)::before {
        content: '\041E\041E\00a0';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(7)::before {
        content: '\0426\041D\00a0';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(8)::before {
        content: '\0421\041D\00a0';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(9)::before {
        content: '\041E\041F\00a0';
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td:nth-child(10) {
        order: 8;
        flex-basis: 100%;
        margin-top: 6px;
        font-size: 12px !important;
        overflow-wrap: anywhere;
    }
    /* у части групп плана нет — пустую строку не оставляем */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXDataRow"] > td.mg-empty {
        display: none !important;
    }

    /* пейджер: подпись над кнопками */
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxpLite_MaterialCompact {
        padding: 12px 16px !important;
    }
    html:has(#ctl00_MainContent_ucGroups_ASPxGridView1) #ctl00_MainContent_ucGroups_ASPxGridView1 .dxp-summary {
        flex-basis: 100%;
        margin: 0 0 6px !important;
    }
}

/* карточка одной группы (?mode=group&f=group): строка фильтров
   над единственной строкой ни к чему */
html.mg-grp-single #ctl00_MainContent_ucGroups_ASPxGridView1 tr[id*="DXFilterRow"] {
    display: none !important;
}

/* ------------------------------------------------------------
   СТУДЕНТЫ ГРУППЫ (Dek/Default.aspx?mode=stud&f=group&id=N)

   Опознаём по меню группы #ctl00_MainContent_ucStud_ASPxGroupMenu —
   оно есть только здесь (у грида зачёток тот же id и на других
   страницах). Скрипт ставит шапку группы и карточки «График /
   Ведомости / Расписание» с обоими семестрами, а меню прячет
   (html.mg-stud-on). Грид остаётся: CSS делает из его строк
   нумерованные плитки — вся плитка ссылка на зачётную книжку;
   колонку «Группа» (во всех строках одна и та же) прячет.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) .contenting,
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
}
html.mg-stud-on .body-content > h3,
html.mg-stud-on .body-content > hr,
html.mg-stud-on .body-content > .dxmLite_MaterialCompact {
    display: none !important;
}

/* карточки «График / Ведомости / Расписание» */
.mg-acts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 4px 0 32px;
}
.mg-act {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 18px 20px 20px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
}
.mg-act__head {
    display: flex;
    align-items: center;
    gap: 12px;
    font: 600 16px/1.3 var(--mg-font);
    color: var(--mg-ink);
}
.mg-act__ico {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 0;
    background: var(--mg-soft);
    color: #243a51;
}
.mg-act__ico .mg-ico {
    width: 20px;
    height: 20px;
}
.mg-seg {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 8px;
    margin-top: auto;
}
.mg-seg a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font);
    text-decoration: none !important;
    white-space: nowrap;
    transition: border-color .15s, background-color .15s;
}
.mg-seg a:hover {
    border-color: #c9d2de;
    background: #f7f9fc;
}
/* is-active — выбранный (тёмная кнопка), is-now — текущий по календарю
   (точка). У студентов группы текущий семестр и выбран; на графике
   выбран тот, что показан, а точка остаётся у текущего. */
.mg-seg a.is-active {
    border-color: var(--mg-navy);
    background: var(--mg-navy);
    color: #fff !important;
}
.mg-seg a.is-active:hover {
    border-color: #243a51;
    background: #243a51;
}
.mg-seg a.is-now::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 0;
    background: var(--mg-accent);
}
.mg-seg a.is-now.is-active::before {
    background: #7fb4f5;
}

/* плитки зачёток */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1,
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 > tbody,
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 > tbody > tr,
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 > tbody > tr > td,
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 .dxgvTable_MaterialCompact {
    display: block !important;
    width: auto !important;
    max-width: none !important;    /* table.js ограничивает гриды 1100px */
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 .dxgvTable_MaterialCompact > tbody {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    counter-reset: mg-stud;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
    display: none !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] {
    position: relative;
    display: flex !important;
    align-items: center;
    gap: 14px;
    min-height: 60px;
    padding: 12px 16px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    counter-increment: mg-stud;
    transition: border-color .15s;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"]:hover {
    border-color: #c9d2de;
}
/* номер по порядку */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"]::before {
    content: counter(mg-stud, decimal-leading-zero);
    flex: none;
    min-width: 22px;
    color: #8a94a6;
    font: 600 13px/1 var(--mg-font);
    font-variant-numeric: tabular-nums;
}
/* стрелка справа */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"]::after {
    content: '';
    flex: none;
    width: 18px;
    height: 18px;
    margin-left: auto;
    background: #b8c1cd;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / 18px no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / 18px no-repeat;
    transition: background-color .15s;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"]:hover::after {
    background: var(--mg-ink);
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] > td {
    display: block !important;
    min-width: 0;
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
}
/* «Группа» и служебная ячейка DevExpress */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] > td:not(:first-child) {
    display: none !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] > td:first-child a {
    color: var(--mg-ink) !important;
    font: 600 15px/1.3 var(--mg-font) !important;
    text-decoration: none !important;
    overflow-wrap: anywhere;
    outline: none;
}
/* ссылка растянута на всю плитку */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] > td:first-child a::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 0;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr[id*="DXDataRow"] > td:first-child a:focus-visible::after {
    outline: 2px solid #243a51;
    outline-offset: 2px;
}
/* группа без студентов — «Нет данных» DevExpress на всю ширину */
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr.dxgvEmptyDataRow {
    display: block !important;
    grid-column: 1 / -1;
    padding: 24px;
    border: 1px dashed var(--mg-line);
    border-radius: 0;
    color: var(--mg-muted);
    font: 400 15px/1.4 var(--mg-font);
    text-align: center;
}
html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 tr.dxgvEmptyDataRow > td {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
}

@media (max-width: 991px) {
    .mg-acts {
        grid-template-columns: minmax(0, 1fr);
    }
    .mg-act {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 12px 16px;
    }
    .mg-seg {
        flex: 0 1 280px;
        margin-top: 0;
    }
    html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 .dxgvTable_MaterialCompact > tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .mg-stud-head .mg-dir__head .mg-btn2 {
        width: 100%;
        justify-content: center;
    }
    .mg-act {
        padding: 16px;
    }
    .mg-seg {
        flex-basis: 100%;
    }
    html:has(#ctl00_MainContent_ucStud_ASPxGroupMenu) #ctl00_MainContent_ucStud_ASPxGridView1 .dxgvTable_MaterialCompact > tbody {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }
}

/* название группы в заголовке — одним куском */
.mg-nowrap {
    white-space: nowrap;
}

/* ------------------------------------------------------------
   ГРАФИК УЧЕБНОГО ПРОЦЕССА (Graph/Graph.aspx?obj=N&param=0|1)

   Опознаём по гриду #ctl00_MainContent_ucGraph_Graph (тема DevExpress
   здесь своя, не MaterialCompact). Скрипт ставит шапку с фактами о
   группе и переключателем семестра, строку «Сейчас N-я неделя — …»
   и легенду метками; прежние заголовки, таблицу-шапку и легенду
   прячет (html.mg-graph-on). Календарь — тот же грид: белая карточка,
   на узком экране прокручивается вбок, подписи слева стоят на месте
   (sticky — поэтому border-collapse: separate: при collapse рамки у
   прилипших ячеек уезжают). Цвета кодов — по классам mg-g--вид,
   одни и те же у ячеек и у меток легенды.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_ucGraph_Graph) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) .contenting,
html:has(#ctl00_MainContent_ucGraph_Graph) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
    text-align: left;
}
html.mg-graph-on #ctl00_MainContent_UpdatePanel1 > :is(a.back, h3, hr),
html.mg-graph-on #ctl00_MainContent_TitleTable,
html.mg-graph-on #ctl00_MainContent_ucGraph_UpdatePanel1 > hr,
html.mg-graph-on #ctl00_MainContent_UpdatePanel1 .description {
    display: none !important;
}

/* факты о группе */
.mg-facts {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    margin: 0 0 32px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
}
.mg-fact {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    padding: 16px 24px;
    border-right: 1px solid var(--mg-line);
}
.mg-fact > span {
    font: 400 13px/1.2 var(--mg-font);
    color: var(--mg-muted);
}
.mg-fact > b {
    font: 600 15px/1.3 var(--mg-font);
    color: var(--mg-ink);
    overflow-wrap: anywhere;
}
.mg-fact a {
    color: var(--mg-accent) !important;
    text-decoration: none !important;
}
.mg-fact a:hover {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
}
/* семестр — справа */
.mg-fact--sem {
    margin-left: auto;
    border-right: 0;
}
.mg-fact--sem .mg-seg {
    display: flex;
    gap: 6px;
    margin: 0;
}
.mg-fact--sem .mg-seg a {
    height: 34px;
    padding: 0 14px;
}

/* заголовок календаря (серверный h3) и строка «сейчас» */
html.mg-graph-on #ctl00_MainContent_ucGraph_UpdatePanel1 > h3 {
    margin: 0 0 14px !important;
    font: 600 22px/1.25 var(--mg-font) !important;
    letter-spacing: -.01em;
    color: var(--mg-ink) !important;
    text-align: left !important;
}
.mg-now {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px !important;
    padding: 9px 14px;
    border-radius: 0;
    background: #eaf1fd;
    color: #1f3f73;
    font: 500 14px/1.3 var(--mg-font);
}
.mg-now__dot {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 0;
    background: var(--mg-accent);
}

/* календарь */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph {
    display: block !important;
    width: 100% !important;
    overflow-x: auto;
    border: 1px solid var(--mg-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph > tbody,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph > tbody > tr,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph > tbody > tr > td {
    display: block;
    padding: 0 !important;
    border: 0 !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph_DXMainTable {
    min-width: 1180px;
    overflow: visible !important;  /* у DevExpress hidden — sticky-подписи липли бы к самой таблице */
    border: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph_DXMainTable > tbody > tr > td {
    height: 24px;
    padding: 0 2px !important;
    border: 0 !important;
    border-right: 1px solid #eef1f6 !important;
    border-bottom: 1px solid #eef1f6 !important;
    background: #fff !important;
    color: var(--mg-text) !important;
    font: 400 12px/1 var(--mg-font) !important;
    font-variant-numeric: tabular-nums;
    text-align: center !important;
    opacity: 1 !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph_DXMainTable > tbody > tr > td:last-child {
    border-right: 0 !important;
}
/* у шапки DevExpress внутри ячейки своя таблица */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.dxgvHeader table {
    width: 100%;
    border: 0 !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.dxgvHeader td {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    color: inherit !important;
    font: inherit !important;
    text-align: center !important;
}
/* месяцы */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow0"] > td {
    height: 34px;
    background: #f7f9fc !important;
    color: var(--mg-ink) !important;
    font-weight: 600 !important;
}
/* числа: воскресенье — красным */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id*="_DXHeadersRow"]:not([id$="Row0"], [id$="Row8"]) > td {
    height: 22px;
    color: var(--mg-muted) !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow7"] > td {
    color: #dc2626 !important;
}
/* номера недель — граница между календарём и кодами */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow8"] > td {
    background: #f7f9fc !important;
    color: #8a94a6 !important;
    font-size: 11px !important;
    border-bottom-color: var(--mg-line) !important;
}
/* подписи слева — прилипают при прокрутке */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph_DXMainTable > tbody > tr > td:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 46px;
    padding: 0 10px !important;
    border-right-color: var(--mg-line) !important;
    color: var(--mg-muted) !important;
    font-weight: 600 !important;
    text-align: left !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr:is([id$="_DXHeadersRow0"], [id$="_DXHeadersRow8"]) > td:first-child {
    background: #f7f9fc !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow7"] > td:first-child {
    color: #dc2626 !important;
}
/* строки с кодами */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id*="DXDataRow"] > td {
    height: 28px;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* виды занятий: метки легенды и ячейки календаря */
.mg-g {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    padding: 0 6px;
    border: 1px solid transparent;
    border-radius: 0;
    font: 600 12px/1 var(--mg-font);
}
.mg-g--t {
    border-color: var(--mg-line);
    background: #fff;
}
.mg-g--e,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--e {
    background: #fff4e5 !important;
    color: #b54708 !important;
}
.mg-g--k,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--k {
    background: #e7f6ee !important;
    color: #15803d !important;
}
.mg-g--p,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--p {
    background: #f3e8ff !important;
    color: #7e22ce !important;
}
.mg-g--d,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--d {
    background: #eaf1fd !important;
    color: #1d4ed8 !important;
}
.mg-g--g,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--g {
    background: #ffe4e6 !important;
    color: #be123c !important;
}
.mg-g--kt,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--kt {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}
.mg-g--h,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--h {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}
.mg-g--x,
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g--x {
    background: #f3f4f6 !important;
    color: #9ca3af !important;
}

/* неделя, где сегодня: рамка по колонке, номер недели залит */
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g-now {
    border-right: 2px solid var(--mg-accent) !important;
    border-left: 2px solid var(--mg-accent) !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id*="_DXHeadersRow"] > td.mg-g-now {
    background: #eaf1fd !important;
    color: var(--mg-accent) !important;
    font-weight: 600 !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow1"] > td.mg-g-now {
    border-top: 2px solid var(--mg-accent) !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id$="_DXHeadersRow8"] > td.mg-g-now {
    background: var(--mg-accent) !important;
    color: #fff !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph tr[id*="DXDataRow"] > td.mg-g-now:not([class*="mg-g--"]) {
    background: #f5f8fe !important;
}
html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph td.mg-g-now--end {
    border-bottom: 2px solid var(--mg-accent) !important;
}

/* легенда */
.mg-legend {
    margin: 24px 0 0;
    padding: 20px 24px 22px;
    border: 1px solid var(--mg-line);
    border-radius: 0;
    background: #fff;
    text-align: left;
}
.mg-legend__title {
    margin: 0 0 14px !important;
    font: 600 16px/1.3 var(--mg-font) !important;
    color: var(--mg-ink) !important;
}
.mg-legend ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 24px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.mg-legend li {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    font: 400 14px/1.3 var(--mg-font);
    color: var(--mg-text);
}
/* обозначения, которых в графике этой группы нет */
.mg-legend li.is-unused {
    color: #8a94a6;
}
.mg-legend li.is-unused .mg-g {
    opacity: .55;
}

@media (max-width: 991px) {
    .mg-facts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .mg-fact {
        border-right: 0;
        border-bottom: 1px solid var(--mg-line);
    }
    .mg-fact:nth-child(odd):not(.mg-fact--sem) {
        border-right: 1px solid var(--mg-line);
    }
    .mg-fact--sem {
        grid-column: 1 / -1;
        margin-left: 0;
        border-bottom: 0;
    }
    .mg-legend ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    html:has(#ctl00_MainContent_ucGraph_Graph) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .mg-graph-head .mg-dir__head .mg-btn2 {
        width: 100%;
        justify-content: center;
    }
    /* факты — списком «подпись … значение», семестр — кнопками во всю ширину */
    .mg-facts {
        display: block;
    }
    .mg-facts > .mg-fact:nth-child(n) {
        flex-direction: row;
        justify-content: space-between;
        align-items: baseline;
        gap: 16px;
        padding: 12px 16px;
        border-right: 0;
        border-bottom: 1px solid var(--mg-line);
    }
    .mg-fact > span {
        flex: none;
    }
    .mg-fact > b {
        min-width: 0;
        text-align: right;
    }
    /* длинный номер зачётки на узком экране переносится, а не вылезает за край */
    .mg-fact > b .mg-nowrap {
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .mg-facts > .mg-fact--sem:nth-child(n) {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        border-bottom: 0;
    }
    .mg-fact--sem .mg-seg a {
        flex: 1 1 0;
    }
    .mg-now {
        display: flex;
    }
    html:has(#ctl00_MainContent_ucGraph_Graph) #ctl00_MainContent_ucGraph_Graph {
        border-radius: 0 !important;
    }
    .mg-legend {
        padding: 16px;
    }
    .mg-legend ul {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ------------------------------------------------------------
   КАРТОЧКИ-ССЫЛКИ (карточка студента и др.)
   Белая плитка: значок, заголовок, пояснение, стрелка; вся — ссылка.
   ------------------------------------------------------------ */
.mg-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 32px;
}
.mg-card {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 18px 20px;
    border: 1px solid var(--mg-line);
    background: #fff;
    color: var(--mg-ink) !important;
    text-decoration: none !important;
    transition: border-color .15s;
}
.mg-card:hover {
    border-color: #c9d2de;
}
.mg-card__ico {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--mg-soft);
    color: #243a51;
    transition: background-color .15s, color .15s;
}
.mg-card__ico .mg-ico {
    width: 22px;
    height: 22px;
}
.mg-card:hover .mg-card__ico {
    background: var(--mg-accent);
    color: #fff;
}
.mg-card__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.mg-card__body b {
    font: 600 16px/1.3 var(--mg-font);
}
.mg-card__body small {
    font: 400 13px/1.3 var(--mg-font);
    color: var(--mg-muted);
}
.mg-card__arr {
    flex: none;
    color: #b8c1cd;
    transition: color .15s, transform .15s;
}
.mg-card:hover .mg-card__arr {
    color: var(--mg-accent);
    transform: translateX(2px);
}

/* ------------------------------------------------------------
   КАРТОЧКА СТУДЕНТА (Dek/Default.aspx?mode=stud&f=stud&id=N)
   Шапку, факты и карточки ставит скрипт; меню DevExpress и строку
   грида (зачётка — группа) прячем при html.mg-student-on.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_ucStud_ASPxStudentMenu) body {
    background: var(--mg-bg) !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxStudentMenu) .contenting,
html:has(#ctl00_MainContent_ucStud_ASPxStudentMenu) .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html:has(#ctl00_MainContent_ucStud_ASPxStudentMenu) .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
    text-align: left;
}
html.mg-student-on .body-content > :is(h3, hr, .dxmLite_MaterialCompact),
html.mg-student-on #ctl00_MainContent_ucStud_ASPxGridView1 {
    display: none !important;
}
.mg-student-head .mg-facts {
    margin-bottom: 24px;
}

/* ------------------------------------------------------------
   ОСТАЛЬНЫЕ СТРАНИЦЫ — ОБЩИЙ СЛОЙ (html.mg-gen-on)

   Класс ставит скрипт там, где нет своей обработки, собрав шапку
   с крошками. Здесь — оболочка страницы и вид всего, что на таких
   страницах повторяется: таблицы DevExpress (MaterialCompact),
   строка фильтров, пейджер, поиск, выпадающие списки и чипсы
   table.js, кнопки. Селекторы по классам — где у страницы своя
   обработка с id, её правила сильнее.
   ------------------------------------------------------------ */
html.mg-gen-on body {
    background: var(--mg-bg) !important;
}
html.mg-gen-on .contenting,
html.mg-gen-on .body-content {
    background: transparent !important;
    box-shadow: none !important;
}
html.mg-gen-on .body-content {
    padding-top: calc(var(--mg-hdr-h) + 32px) !important;
    text-align: left;
}
html.mg-gen-on .mg-gen-src {
    display: none !important;
}
/* серверные отступы br и пустые div между блоками — отступы задаём сами */
html.mg-gen-on .body-content > br,
html.mg-gen-on .body-content > div:empty {
    display: none !important;
}

/* таблица — белой карточкой на всю ширину колонки. Кроме половин
   разрезанной ведомости (.dst-grid--split): у левой ширина 20% и float,
   правую прокручивает iScroll — карточка у них общая, .dst-split */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none):not(.dst-grid--split) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 8px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) :is(.dxgvTable_MaterialCompact, .dxgvPagerBottomPanel_MaterialCompact, .dxgvPagerTopPanel_MaterialCompact, .dxgvSearchPanel_MaterialCompact, .dxgvGroupPanel_MaterialCompact) {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXHeadersRow"] > td {
    height: 44px;
    padding: 0 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: transparent !important;
    color: var(--mg-muted) !important;
    font: 600 12px/1.3 var(--mg-font) !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXHeadersRow"] td.dx-ellipsis {
    white-space: normal !important;
}
/* У части гридов (группы) текст заголовка DevExpress кладёт во вложенную
   table.dxgvHCEC, а table.js ставит значок сортировки ПОСЛЕ неё — таблица
   блочная, и значок уезжал второй строкой под текст (шапка «в два
   яруса»). Значок — вне потока, у правого края ячейки посередине (в поле
   отступа): текст занимает всю ширину, в узких колонках («Курс», «Всего»)
   не обрезается. Длинное название переносится по «/» (<wbr> ставит скрипт) */
html.mg-hdr-on .dxgvControl_MaterialCompact tr[id*="DXHeadersRow"] > td:has(table.dxgvHCEC) {
    position: relative;
}
html.mg-hdr-on .dxgvControl_MaterialCompact tr[id*="DXHeadersRow"] td:has(> table.dxgvHCEC) > svg.dst-sort {
    position: absolute;
    top: 50%;
    right: 2px;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 !important;
}
/* строка фильтров */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] > td {
    padding: 8px 10px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: #fbfcfd !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] input {
    box-sizing: border-box !important;
    height: 34px !important;
    padding: 0 10px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--mg-ink) !important;
    font: 400 13px/1 var(--mg-font) !important;
    outline: none !important;
    transition: border-color .15s;
}
/* у поля DevExpress своя рамка-обёртка (table.dxeTextBoxSys) — рамка одна, у input */
html.mg-hdr-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] table.dxeTextBoxSys {
    border: 0 !important;
    background: none !important;
}
html.mg-hdr-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] table.dxeTextBoxSys td.dxic {
    padding: 0 !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] input:hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXFilterRow"] input:focus {
    border-color: var(--mg-accent) !important;
}
/* строки */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXDataRow"] > td {
    padding: 11px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid #eef1f6 !important;
    color: var(--mg-text) !important;
    font: 400 14px/1.4 var(--mg-font) !important;
    font-variant-numeric: tabular-nums;
}
/* подсветка строки — кроме ячеек со своим цветом от сервера */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXDataRow"]:hover > td:not([style*="background"]) {
    background-color: #f7f9fc !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXDataRow"]:is(:last-child, .dst-lastvis) > td {
    border-bottom: 0 !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXDataRow"] a:not(.dxgvADSB) {
    color: var(--mg-accent) !important;
    text-decoration: none !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXDataRow"] a:not(.dxgvADSB):hover {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
}
/* строки-группы («Компетенция: …») */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[id*="DXGroupRow"] > td {
    padding: 12px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: #f7f9fc !important;
    color: var(--mg-ink) !important;
    font: 600 14px/1.4 var(--mg-font) !important;
}
/* «Нет данных» */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr[class*="dxgvEmptyDataRow"] > td {
    padding: 28px 16px !important;
    border-bottom: 0 !important;                 /* снизу и так рамка карточки — была двойная линия */
    color: var(--mg-muted) !important;
    font: 400 15px/1.4 var(--mg-font) !important;
    text-align: center !important;
}
/* коды направлений — плашки table.js */
html.mg-gen-on .dst-code {
    display: inline-block;
    padding: 3px 8px !important;
    background: var(--mg-soft) !important;
    color: #243a51 !important;
    font: 500 12px/1.3 var(--mg-font) !important;
}

/* Таблица из одной колонки (класс mg-grid--list ставит скрипт) — плитками
   в три колонки: шапку прячем, строка фильтров и пейджер — на всю ширину,
   ссылка растянута на всю плитку. */
html.mg-gen-on .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact,
html.mg-gen-on .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
    display: block !important;
    width: auto !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 16px;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
    display: none !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXFilterRow"] {
    display: block;
    grid-column: 1 / -1;
    margin: -16px -16px 8px;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXFilterRow"] > td {
    display: block;
    padding: 12px 16px !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXFilterRow"] > td.dxgvAIC {
    display: none !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXFilterRow"] input {
    height: 42px !important;
    padding-left: 40px !important;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a94a6' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 13px center / 18px no-repeat !important;
    font-size: 15px !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact tr[id*="DXFilterRow"] input::placeholder {
    color: #8a94a6;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"] {
    position: relative;
    display: flex !important;
    align-items: center;
    min-height: 52px;
    border: 1px solid var(--mg-line);
    background: #fff;
    transition: border-color .15s;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"]:hover {
    border-color: #c9d2de;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"] > td {
    display: block;
    flex: 1 1 auto;
    padding: 12px 16px !important;
    border: 0 !important;
    background: none !important;
    text-align: left !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"] > td.dxgvAIC {
    display: none !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"] a:not(.dxgvADSB) {
    color: var(--mg-ink) !important;
    font-weight: 500;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"] a:not(.dxgvADSB)::after {
    content: '';
    position: absolute;
    inset: 0;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[id*="DXDataRow"]:hover a:not(.dxgvADSB) {
    color: var(--mg-accent) !important;
    text-decoration: none !important;
}
html.mg-gen-on .mg-grid--list:not(#mg-none) tr[class*="dxgvEmptyDataRow"] {
    display: block;
    grid-column: 1 / -1;
}
@media (max-width: 991px) {
    html.mg-gen-on .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 575px) {
    html.mg-gen-on .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Форма «Статистика» (StatVed: строки div.row-add-student «подпись —
   список») — поля по четыре в ряд, подпись над списком. Обёртки у полей
   нет, поэтому они обтекаемые блоки (float — без зазоров от пробелов,
   как у строчных), кнопка после них — с новой строки. */
html.mg-gen-on .body-content > div.row-add-student:not(#mg-none) {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    float: left;
    box-sizing: border-box;
    width: calc(25% - 12px);
    margin: 0 12px 16px 0 !important;
}
html.mg-gen-on .body-content > div.row-add-student:not(#mg-none) > .left-label {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    color: var(--mg-muted) !important;
    font: 500 13px/1.3 var(--mg-font) !important;
    text-align: left !important;
}
html.mg-gen-on .body-content > div.row-add-student:not(#mg-none) :is(.dst-select, .dst-select__btn) {
    width: 100%;
    min-width: 0;
}
@media (max-width: 991px) {
    html.mg-gen-on .body-content > div.row-add-student:not(#mg-none) {
        width: calc(50% - 12px);
    }
}
@media (max-width: 575px) {
    html.mg-gen-on .body-content > div.row-add-student:not(#mg-none) {
        width: 100%;
        margin-right: 0 !important;
    }
}
html.mg-gen-on .body-content > div.row-add-student ~ .dxbButton_MaterialCompact:not(#mg-none) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    clear: both;
    width: auto !important;
    min-width: 140px;
    margin: 8px 0 24px;
}
html.mg-gen-on .body-content > div.row-add-student ~ .dxbButton_MaterialCompact .dxb {
    padding: 0 !important;
}

/* «← Назад» над крошками (из a.back сайта) */
.mg-back {
    display: flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    margin: 0 0 12px;
    color: var(--mg-muted) !important;
    font: 500 14px/1 var(--mg-font);
    text-decoration: none !important;
    transition: color .15s;
}
.mg-back:hover {
    color: var(--mg-ink) !important;
}
.mg-back .mg-ico {
    width: 16px;
    height: 16px;
}

/* строки итогов («Всего по 1 курсу») */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) tr.mg-total-row > td {
    background: #f7f9fc !important;
    color: var(--mg-ink) !important;
    font-weight: 600 !important;
}

/* Блоки фильтров со значками (Stat/Debtors: #iconsrows) — у сайта тёмная
   плашка-значок во всю высоту, подпись 24px и тень; здесь плоско и
   компактно: значок в мягкой плашке, подпись мелко, список на всю ширину. */
html.mg-gen-on #iconsrows {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -6px 4px !important;
}
/* четыре в ряд явно: встроенный Bootstrap 4 ставит .col-* width: 100% */
html.mg-gen-on #iconsrows > [class*="col-"] {
    flex: 0 0 25%;
    width: auto !important;
    max-width: 25%;
    margin-bottom: 12px;
    padding: 0 6px !important;
    float: none !important;
}
@media (max-width: 1199px) {
    html.mg-gen-on #iconsrows > [class*="col-"] {
        flex-basis: 50%;
        max-width: 50%;
    }
}
@media (max-width: 575px) {
    html.mg-gen-on #iconsrows > [class*="col-"] {
        flex-basis: 100%;
        max-width: 100%;
    }
}
html.mg-gen-on #iconsrows .card {
    height: 100%;
    margin: 0 !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
}
html.mg-gen-on #iconsrows .card > .d-flex {
    align-items: center;
    gap: 14px;
    height: 100%;
    padding: 14px 16px;
}
html.mg-gen-on #iconsrows .bg-inverse {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0 !important;
    background: var(--mg-soft) !important;
}
html.mg-gen-on #iconsrows .bg-inverse h3 {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}
html.mg-gen-on #iconsrows .bg-inverse i {
    color: #243a51 !important;
    font-size: 18px !important;
}
html.mg-gen-on #iconsrows .align-self-center {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
}
html.mg-gen-on #iconsrows .align-self-center > h3 {
    margin: 0 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    color: var(--mg-muted) !important;
    font: 500 13px/1.2 var(--mg-font) !important;
    text-align: left !important;
}
html.mg-gen-on #iconsrows .align-self-center > div {
    margin: 0 !important;
}
html.mg-gen-on #iconsrows :is(.dst-select, .dst-select__btn) {
    width: 100%;
    min-width: 0;
}

/* совпадение поиска DevExpress: не белым по синему, а мягкой подсветкой */
html.mg-gen-on em.dxgvHL {
    padding: 0 1px;
    background: #fff1b8 !important;
    color: inherit !important;
    font-style: normal;
}
/* пустая ячейка — бледный прочерк (класс ставит скрипт) */
html.mg-gen-on td.mg-empty-cell::after {
    content: '\2014';
    color: #c3cad5;
}
/* «Сокращение» — плашкой */
.mg-tag {
    display: inline-block;
    padding: 3px 8px;
    background: var(--mg-soft);
    color: #243a51;
    font: 600 12px/1.3 var(--mg-font);
    letter-spacing: .02em;
    white-space: nowrap;
}
html.mg-gen-on .dst-badge {
    background: var(--mg-soft) !important;
}
html.mg-gen-on .dst-badge__code {
    color: #243a51 !important;
}

/* пейджер: подпись слева, кнопки справа */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxpLite_MaterialCompact {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
    width: 100%;
    padding: 12px 16px !important;
    border-top: 1px solid var(--mg-line) !important;
    font-family: var(--mg-font) !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxp-summary {
    margin: 0 auto 0 0 !important;
    padding: 0 12px 0 0 !important;
    color: var(--mg-muted) !important;
    font: 400 13px/1 var(--mg-font) !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) :is(.dxp-num, .dxp-button) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    margin: 0 !important;
    padding: 0 8px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    color: var(--mg-ink) !important;
    font: 500 13px/1 var(--mg-font) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: border-color .15s;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) :is(.dxp-num, .dxp-button):hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxp-num.dxp-current {
    border-color: var(--mg-navy) !important;
    background: var(--mg-navy) !important;
    color: #fff !important;
    cursor: default;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxp-disabledButton {
    opacity: .4;
    cursor: default;
}
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxp-ellip {
    color: var(--mg-muted) !important;
}

/* поиск DevExpress над таблицей */
html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none) .dxgvSearchPanel_MaterialCompact {
    padding: 16px !important;
    border-bottom: 1px solid var(--mg-line) !important;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact table.dxeButtonEditSys {
    box-sizing: border-box;
    height: 44px;
    border: 1px solid var(--mg-line) !important;
    box-shadow: none !important;                 /* тень темы MaterialCompact — где нет table.js, она видна */
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a94a6' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 14px center / 18px no-repeat !important;
    transition: border-color .15s;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact table.dxeButtonEditSys:hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact table.dxeButtonEditSys.dxeFocused_MaterialCompact {
    border-color: var(--mg-accent) !important;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact table.dxeButtonEditSys td {
    border: 0 !important;
    background: none !important;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact input.dxeEditAreaSys {
    height: 42px !important;
    padding: 0 12px 0 42px !important;
    border: 0 !important;
    background: none !important;
    color: var(--mg-ink) !important;
    font: 400 15px/1 var(--mg-font) !important;
}
html.mg-gen-on .dxgvSearchPanel_MaterialCompact .dxeNullText_MaterialCompact input.dxeEditAreaSys {
    color: #8a94a6 !important;
}

/* выпадающие списки table.js (заменяют комбобоксы DevExpress и select) */
html.mg-gen-on .dst-select__btn {
    box-sizing: border-box;
    min-width: 180px;
    height: 40px !important;
    padding: 0 12px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
    text-align: left;
    transition: border-color .15s;
}
html.mg-gen-on .dst-select__btn:hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on :is(.dst-select.is-open .dst-select__btn, .dst-select__btn:focus-visible) {
    border-color: var(--mg-accent) !important;
    box-shadow: none !important;
}
html.mg-gen-on .dst-select__arrow {
    fill: var(--mg-muted) !important;
}
html.mg-gen-on .dst-select__panel {
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
}
/* Ширина панели у table.js — по самому длинному пункту, а пункты не
   переносятся: одно длинное название кафедры («Нагрузка», «По
   преподавателю») растягивало панель за край окна. Теперь панель по
   содержимому, но не шире 440px (и не уже самого списка), названия
   переносятся */
html.mg-gen-on .dst-select__panel {
    width: max-content;
    min-width: 100%;
    max-width: min(440px, calc(100vw - 32px));
}
html.mg-gen-on .dst-select__opt {
    white-space: normal !important;
    overflow-wrap: anywhere;
}
/* Выбранное длинное название не растягивает кнопку: многоточие, полное —
   в подсказке (title ставит table.js). Ограничение — длиной, не в %:
   проценты не ограничивают ширину по содержимому, и обёртка списка (а за
   ней и панель с min-width: 100%) всё равно растягивалась */
html.mg-gen-on .dst-select__btn {
    max-width: calc(100vw - 32px);
}
@media (min-width: 768px) {
    html.mg-gen-on .dst-select__btn {
        max-width: 340px;
    }
}
/* На телефоне список — всю строку, подпись над ним. Иначе короткое
   выбранное значение («Академических дисциплин») стояло рядом с подписью,
   панель (шире самого списка — по длинным названиям) начиналась от него
   и уезжала за край, а фокус в поле поиска прокручивал страницу вбок */
@media (max-width: 767px) {
    /* обёртки фильтров — тоже на всю строку: они подстраивались под
       содержимое, и список внутри не растягивался */
    html.mg-gen-on .body-content :is(.dst-filters, .dst-filter) {
        flex: 1 1 100%;
        flex-wrap: wrap;
        width: 100%;
        max-width: 100%;
    }
    html.mg-gen-on .body-content .dst-select {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }
    html.mg-gen-on .body-content .dst-select__btn {
        width: 100%;
        max-width: 100%;                /* а не calc(100vw − 32px): у страниц поля по 12px */
    }
    /* панель — ровно по списку: не шире и не сдвинута */
    html.mg-gen-on .body-content .dst-select__panel {
        right: 0;
        left: 0 !important;
        box-sizing: border-box;
        width: auto;
        min-width: 0;
        max-width: none;
    }
}
html.mg-gen-on .dst-select__search {
    border: 1px solid var(--mg-line) !important;
    font: 400 14px/1 var(--mg-font) !important;
}
html.mg-gen-on .dst-select__opt {
    font: 400 14px/1.3 var(--mg-font) !important;
    color: var(--mg-text) !important;
}
html.mg-gen-on .dst-select__opt.is-selected {
    background: #eaf1fd !important;
    color: var(--mg-accent) !important;
}

/* чипсы table.js («Курс: 1 2 3 … Все») */
html.mg-gen-on .dst-listfilters {
    max-width: none !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    justify-content: flex-start;
}
html.mg-gen-on .dst-fgroup {
    gap: 8px !important;
}
html.mg-gen-on .dst-flabel {
    margin-right: 4px !important;
    color: var(--mg-muted) !important;
    font: 500 14px/1 var(--mg-font) !important;
}
html.mg-gen-on .dst-chip {
    min-width: 40px;
    height: 36px !important;
    padding: 0 14px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
    transition: border-color .15s, background-color .15s, color .15s;
}
html.mg-gen-on .dst-chip:hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on .dst-chip.is-active {
    border-color: var(--mg-navy) !important;
    background: var(--mg-navy) !important;
    color: #fff !important;
}

/* Фильтры над таблицей. У сервера они по центру и столбиком (обёртки
   text-center, br); здесь — по левому краю, в строку. Контейнер — любой
   блок, где прямо лежат выпадающий список table.js, его фильтр или
   переключатель из радиокнопок. Наша шапка, если она в том же блоке, —
   на всю строку. */
html.mg-gen-on .body-content :is(div, span):has(> .dst-select, > .dst-filter, > .dst-filters, > table > tbody > tr > td > input[type="radio"]) {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin: 0 0 16px;
    text-align: left !important;
}
html.mg-gen-on .body-content :is(div, span):has(> .dst-select, > .dst-filter, > .dst-filters) > .mg-gen-head {
    flex: 1 1 100%;
}
html.mg-gen-on .body-content :is(div, span):has(> .dst-select, > .dst-filter, > .dst-filters, > table > tbody > tr > td > input[type="radio"]) > br {
    display: none;
}
html.mg-gen-on .body-content :is(.dst-filters, .dst-filter) {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
}
html.mg-gen-on .body-content .dst-filters {
    margin-bottom: 0 !important;
}
html.mg-gen-on .dst-flabel {
    color: var(--mg-muted) !important;
    font: 500 14px/1 var(--mg-font) !important;
    white-space: nowrap;
}
/* переключатель из радиокнопок (RadioButtonList: «По группе / По преподавателю») */
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) {
    display: inline-flex;
    margin: 0 !important;
    border-collapse: collapse;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) :is(tbody, tr) {
    display: flex;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) td {
    display: block;
    padding: 0 !important;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) input[type="radio"] + label {
    display: inline-flex;
    align-items: center;
    height: 40px;
    margin: 0 -1px 0 0 !important;
    padding: 0 16px !important;
    border: 1px solid var(--mg-line);
    background: #fff;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .15s, background-color .15s, color .15s;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) input[type="radio"] + label:hover {
    background: #f7f9fc;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) input[type="radio"]:checked + label {
    position: relative;
    border-color: var(--mg-navy);
    background: var(--mg-navy);
    color: #fff !important;
}
html.mg-gen-on .body-content table:has(> tbody > tr > td > input[type="radio"]) input[type="radio"]:focus-visible + label {
    outline: 2px solid var(--mg-accent);
    outline-offset: 2px;
}

/* кнопки DevExpress («Показать» и т. п.), кроме кнопок внутри таблиц
   (у «Показать» тоже есть класс dxbButtonSys, поэтому исключаем по месту) */
html.mg-gen-on .body-content .dxbButton_MaterialCompact:not(.dxgvADSB):not(.dxgvControl_MaterialCompact *) {
    height: 40px;
    padding: 0 20px !important;
    border: 0 !important;
    background: var(--mg-accent) !important;
    box-shadow: none !important;
    color: #fff !important;
    font: 500 14px/1 var(--mg-font) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    transition: background-color .15s;
}
html.mg-gen-on .body-content .dxbButton_MaterialCompact:not(.dxgvADSB):not(.dxgvControl_MaterialCompact *):hover {
    background: var(--mg-accent-hover) !important;
}
html.mg-gen-on .body-content .dxbButton_MaterialCompact:not(.dxgvADSB):not(.dxgvControl_MaterialCompact *) .dx-vam {
    color: #fff !important;
    font: inherit !important;
    text-transform: none !important;
}

@media (max-width: 991px) {
    .mg-cards {
        grid-template-columns: minmax(0, 1fr);
    }
}
@media (max-width: 767px) {
    html:is(.mg-gen-on, .mg-student-on) .body-content {
        padding-top: calc(var(--mg-hdr-h) + 16px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    /* широкие таблицы — прокрутка вбок внутри карточки; узкие — на всю
       ширину карточки (иначе содержимое сжимается по тексту, справа пусто) */
    html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none):not(.dst-grid--split) {
        display: block !important;
        overflow-x: auto;
    }
    html.mg-gen-on .dxgvControl_MaterialCompact:not(#mg-none):not(.dst-grid--split) > tbody {
        display: table;
        width: 100%;
    }
    .mg-card {
        padding: 14px 16px;
    }
}

/* у части страниц без table.js (Compitations) контейнер шириной 1700px —
   страница уезжала вправо; ширина — как у остальных */
html.mg-gen-on .body-content.container {
    width: auto !important;
    max-width: 1300px !important;
}

/* переключатели-ссылки (семестры зачётки и т. п.) */
a.mg-chip {
    color: var(--mg-ink) !important;
    text-decoration: none !important;
}
a.mg-chip.is-active {
    color: #fff !important;
}
.mg-chips__label {
    align-self: center;
    margin-right: 4px;
    color: var(--mg-muted);
    font: 500 14px/1 var(--mg-font);
}

/* ------------------------------------------------------------
   РЕЗУЛЬТАТЫ ОСВОЕНИЯ ОП (Dek/Compitations.aspx?stud_id=N)
   Уровни — метками (mg-lvl--…) вместо яркой заливки ячеек, легенда
   сервера — сводкой над таблицей, строки компетенций — заголовками
   разделов с кодом на тёмной плашке. Классы ставит скрипт.
   ------------------------------------------------------------ */
.mg-lvl {
    display: inline-block;
    padding: 3px 8px;
    border: 1px solid transparent;
    background: #f2f4f7;
    color: #475467;
    font: 500 12px/1.3 var(--mg-font);
    white-space: nowrap;
}
.mg-lvl--pass { background: #eaf1fd; color: #1d4ed8; }
.mg-lvl--high { background: #e7f6ee; color: #15803d; }
.mg-lvl--adv  { background: #eef7e0; color: #4d7c0f; }
.mg-lvl--thr  { background: #fff4e5; color: #b54708; }
.mg-lvl--none { background: #fdecec; color: #b42318; }
.mg-lvl--todo { border-color: var(--mg-line); background: #fff; color: #8a94a6; }
html.mg-comp-on #ctl00_MainContent_grid:not(#mg-none) td.mg-lvl-cell {
    background: none !important;
}
.mg-legend--levels {
    margin: 0 0 16px;
}
.mg-legend--levels li {
    align-items: flex-start;
}
.mg-legend--levels li > span:nth-child(2) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.mg-legend--levels li b {
    font-weight: 500;
    color: var(--mg-ink);
}
.mg-legend--levels li small {
    color: var(--mg-muted);
    font-size: 12px;
}
.mg-legend--levels li em {
    flex: none;
    margin-left: auto;
    color: var(--mg-ink);
    font: 600 15px/1.3 var(--mg-font);
    font-style: normal;
}
.mg-legend--levels .mg-lvl {
    min-width: 118px;
    text-align: center;
}
/* строка компетенции: «ОПК-1.1» на тёмной плашке и текст */
.mg-comp {
    display: inline-flex;
    align-items: baseline;
    gap: 10px;
    white-space: normal;
}
.mg-comp > b {
    flex: none;
    padding: 2px 8px;
    background: var(--mg-navy);
    color: #fff;
    font: 600 12px/1.4 var(--mg-font);
}
.mg-comp > span {
    font-weight: 500;
}
html.mg-comp-on #ctl00_MainContent_grid:not(#mg-none) tr[id*="DXGroupRow"] > td {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}
/* колонки: после служебной — дисциплина (остаток), курс, семестр, уровень */
html.mg-comp-on #ctl00_MainContent_grid:not(#mg-none) tr.dxgvArm > td:nth-last-child(3) {
    width: 80px !important;
}
html.mg-comp-on #ctl00_MainContent_grid:not(#mg-none) tr.dxgvArm > td:nth-last-child(2) {
    width: 110px !important;
}
html.mg-comp-on #ctl00_MainContent_grid:not(#mg-none) tr.dxgvArm > td:nth-last-child(1) {
    width: 190px !important;
}

/* ------------------------------------------------------------
   ЗАЧЁТНАЯ КНИЖКА (Ved/ZachBooks.aspx?id=N[&sem=K])
   Оценки — метками (mg-grade--…), сводка оценок в фактах, семестры —
   переключателем, между семестрами — линия (mg-sem-start).
   ------------------------------------------------------------ */
.mg-grade {
    display: inline-block;
    padding: 3px 8px;
    background: #f2f4f7;
    color: #475467;
    font: 500 12px/1.3 var(--mg-font);
    white-space: nowrap;
}
.mg-grade--a { background: #e7f6ee; color: #15803d; }
.mg-grade--b { background: #eaf1fd; color: #1d4ed8; }
.mg-grade--c { background: #fff4e5; color: #b54708; }
.mg-grade--f { background: #fdecec; color: #b42318; }
.mg-grade--p { background: #e6f4f1; color: #0f766e; }
.mg-grade--n,
.mg-grade--d { background: #f2f4f7; color: #475467; }
.mg-grades {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.mg-grades .mg-grade {
    padding: 5px 9px;
    font-size: 13px;
}
.mg-grades .mg-grade b {
    margin-left: 3px;
    font-weight: 700;
}
.mg-fact--grades {
    flex: 1 1 320px;
}
.mg-zach-sems {
    margin: 0 0 16px;
}
html.mg-zach-on #ctl00_MainContent_ZachBookTable:not(#mg-none) tr.mg-sem-start > td {
    border-top: 2px solid var(--mg-line) !important;
}
html.mg-zach-on #ctl00_MainContent_ZachBookTable:not(#mg-none) tr[id*="DXDataRow"] > td:first-child a {
    font-weight: 600;
}

/* ------------------------------------------------------------
   ВЫПАДАЮЩИЕ СПИСКИ DEVEXPRESS там, где нет table.js (он заменяет
   их своими .dst-select): рамка 1px, без тени, шрифт сайта.
   Поле поиска над таблицей оформлено отдельно — его не задеваем.
   ------------------------------------------------------------ */
html.mg-gen-on .body-content table.dxeButtonEditSys:not(.dxgvSearchPanel_MaterialCompact *, .dst-select > *) {
    box-sizing: border-box;
    height: 38px;
    min-width: 160px;
    font-size: 14px !important;                  /* у части страниц инлайн 12pt — ячейка кнопки росла до 49px */
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
    transition: border-color .15s;
}
html.mg-gen-on .body-content table.dxeButtonEditSys:not(.dxgvSearchPanel_MaterialCompact *, .dst-select > *):hover {
    border-color: #c9d2de !important;
}
html.mg-gen-on .body-content table.dxeButtonEditSys.dxeFocused_MaterialCompact:not(.dxgvSearchPanel_MaterialCompact *) {
    border-color: var(--mg-accent) !important;
}
/* отступы ячеек темы (7px/6px) плюс поле 36px давали список высотой 51px */
html.mg-gen-on .body-content table.dxeButtonEditSys:not(.dxgvSearchPanel_MaterialCompact *, .dst-select > *) td {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    vertical-align: middle !important;
}
html.mg-gen-on .body-content table.dxeButtonEditSys:not(.dxgvSearchPanel_MaterialCompact *, .dst-select > *) td.dxeButton {
    padding: 0 10px !important;
}
html.mg-gen-on .body-content table.dxeButtonEditSys:not(.dxgvSearchPanel_MaterialCompact *, .dst-select > *) input.dxeEditAreaSys {
    height: 36px !important;
    padding: 0 10px !important;
    border: 0 !important;
    background: none !important;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
}
/* раскрытый список: рамка вместо тени */
html.mg-gen-on .dxpcDropDown_MaterialCompact .dxpc-mainDiv {
    border: 1px solid var(--mg-line) !important;
    box-shadow: none !important;
}
html.mg-gen-on .dxpcDropDown_MaterialCompact .dxeListBoxItem_MaterialCompact {
    font: 400 14px/1.3 var(--mg-font) !important;
}
/* выбранный и наведённый пункт — мягко, как у списков table.js, а не белым по синему */
html.mg-gen-on .dxpcDropDown_MaterialCompact .dxeListBoxItemHover_MaterialCompact {
    background: #f3f5f8 !important;
    color: var(--mg-ink) !important;
}
html.mg-gen-on .dxpcDropDown_MaterialCompact .dxeListBoxItemSelected_MaterialCompact {
    background: #eaf1fd !important;
    color: var(--mg-accent) !important;
    font-weight: 500 !important;
}

/* ------------------------------------------------------------
   СТАРЫЕ СТРАНИЦЫ НА ТАБЛИЦЕ-РАСКЛАДКЕ (Graph/ и др.)

   Заголовок и фильтры у них — строки шапки table.table, таблица с
   данными — в строке тела. Стили страницы (css/Graph/DefaultGraph.css)
   центрируют все th/td и дают им ширину 33%. Скрипт ставит нашу шапку
   перед таблицей, строку заголовка прячет, таблице даёт класс
   .mg-legacy. Здесь раскладку снимаем: фильтры — слева в ряд, как на
   других страницах, данные — на всю ширину и по левому краю.
   ------------------------------------------------------------ */
html.mg-gen-on .body-content table.mg-legacy {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
html.mg-gen-on .body-content table.mg-legacy > :is(thead, tbody) > tr > :is(th, td) {
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
    white-space: normal !important;
}
/* строка фильтров: article.art — «подпись + список», в ряд с переносом */
html.mg-gen-on .body-content table.mg-legacy > thead > tr > th {
    padding-bottom: 20px !important;
}
html.mg-gen-on .body-content table.mg-legacy .art1 {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 24px;
    width: 100%;
}
/* фильтры разложены по двум .art2 внутри .art1 — обёртку убираем из
   раскладки, чтобы все фильтры встали в один ряд */
html.mg-gen-on .body-content table.mg-legacy .art2 {
    display: contents !important;
}
/* display без !important: скрытый фильтр («Факультет») сервер прячет
   инлайном style="display:none" — он должен остаться скрытым */
html.mg-gen-on .body-content table.mg-legacy article.art {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}
html.mg-gen-on .body-content table.mg-legacy .mg-flabel font {
    font-size: inherit;
}
/* строка-обёртка таблицы данных: без подсветки bootstrap .table-hover */
html.mg-gen-on .body-content table.mg-legacy > tbody > tr:hover > td {
    background: transparent !important;
}
/* в таблице данных — без центровки и 33% от стилей страницы; своё
   выравнивание колонки DevExpress задаёт инлайном, оно сильнее */
html.mg-gen-on .body-content table.mg-legacy .dxgvControl_MaterialCompact td {
    width: auto;
    text-align: left;
}
/* bootstrap сайта (старая версия) даёт рамку сверху ЛЮБОЙ ячейке внутри
   .table — селектор «.table tbody > tr > td» через пробел, — то есть и
   ячейкам таблицы данных, вложенной в раскладку: лишние линии над
   поиском и над шапкой. Внутри раскладки её снимаем */
html.mg-gen-on .body-content table.mg-legacy table td {
    border-top: 0;
}
/* …и отступ 6px главной ячейке грида: всё содержимое карточки отъезжало
   от её рамки, линии под поиском и шапкой не доходили до краёв */
html.mg-gen-on .body-content table.mg-legacy table.dxgvControl_MaterialCompact > tbody > tr > td {
    padding: 0 !important;
}

/* ------------------------------------------------------------
   РАСПИСАНИЕ ГРУППЫ (Rasp/Rasp.aspx?group=N&sem=K)

   Опознаём по списку «Вид расписания» (#…cmbTypeView). Таблица
   сведений (#…Table1) — карточкой фактов в строку: ячейки становятся
   блоками «подпись — значение», пустые (класс mg-hide) скрыты.
   Расписание — на всю ширину (у сайта обёртка .blockDay 800px по
   центру). Классы дат, времени, видов занятий и аудиторий ставит
   скрипт; выравнивание ячеек — здесь, до скрипта.
   ------------------------------------------------------------ */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 {
    display: block !important;
    width: 100% !important;
    max-width: none !important;          /* у сервера инлайном 800px по центру */
    margin: 0 0 24px !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody {
    display: flex;
    flex-wrap: wrap;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr {
    display: contents;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr > td {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 6px;
    flex: 1 1 auto;
    width: auto !important;              /* у сервера инлайном width: 25% */
    min-height: 76px;
    box-sizing: border-box;
    padding: 14px 22px !important;
    border: 0 !important;
    border-right: 1px solid var(--mg-line) !important;
    background: none !important;
    color: var(--mg-muted) !important;
    font: 400 13px/1.3 var(--mg-font) !important;
    text-align: left !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr > td.mg-hide {
    display: none !important;
}
/* дата обновления — справа, без разделителя */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr:last-child > td:last-child {
    margin-left: auto;
    border-right: 0 !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr > td br {
    display: none;
}
/* блок недели — такой же столбик «подпись — значение»; выбор недели
   (#changeWeekBlock) сервер прячет инлайном, его не трогаем */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 :is(#curWeekBlock, #changeWeekBlock:not([style*="none"])) {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 table.dxeButtonEditSys {
    margin: 0 !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 :is(#ctl00_MainContent_lbCurYear, #ctl00_MainContent_lbDateLoadRasp, #ctl00_MainContent_lbCurWeek, #ctl00_MainContent_hpGroup) {
    color: var(--mg-ink) !important;
    font: 600 15px/1.3 var(--mg-font) !important;
    text-decoration: none !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 #ctl00_MainContent_hpGroup {
    color: var(--mg-accent) !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 #ctl00_MainContent_hpGroup:hover {
    text-decoration: underline !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 #ctl00_MainContent_lbType {
    color: var(--mg-muted) !important;
    font: 400 13px/1.3 var(--mg-font) !important;
}

/* расписание — на всю ширину */
html:has(#ctl00_MainContent_cmbTypeView) .body-content .blockDay {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;               /* у сайта 5px — карточка была уже сведений */
}
/* панель с «Скачать в XLS» */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1 .dxctToolbar_MaterialCompact {
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--mg-line) !important;
    background: none !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1 .dxctToolbar_MaterialCompact .dxm-item {
    min-width: 0 !important;
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    transition: border-color .15s;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1 .dxctToolbar_MaterialCompact .dxm-item:hover {
    border-color: #c9d2de !important;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1 .dxctToolbar_MaterialCompact .dxm-content {
    padding: 8px 14px !important;
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
}
/* строки: время узко, дисциплина и преподаватель — влево */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1:not(#mg-none) tr[id*="DXDataRow"] > td {
    text-align: left !important;
    vertical-align: middle;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1:not(#mg-none) tr[id*="DXDataRow"] > td:has(.mg-time) {
    width: 96px;
    white-space: nowrap !important;
}
.mg-time,
.mg-time-end {
    display: block;
    font-variant-numeric: tabular-nums;
}
.mg-time {
    color: var(--mg-ink);
    font: 600 15px/1.3 var(--mg-font);
}
.mg-time-end {
    color: var(--mg-muted);
    font: 400 13px/1.3 var(--mg-font);
}
.mg-kind {
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 3px 8px;
    background: #f2f4f7;
    color: #475467;
    font: 500 12px/1.3 var(--mg-font);
    vertical-align: middle;
    white-space: nowrap;
}
.mg-kind--lec    { background: #eaf1fd; color: #1d4ed8; }
.mg-kind--pr     { background: #e6f4f1; color: #0f766e; }
.mg-kind--lab    { background: #f3e8ff; color: #7e22ce; }
.mg-kind--exam   { background: #fdecec; color: #b42318; }
.mg-kind--credit { background: #fff4e5; color: #b54708; }
.mg-rasp-disc {
    color: var(--mg-ink);
    font-weight: 500;
    vertical-align: middle;
}
.mg-who {
    display: block;
    color: var(--mg-text);
}
.mg-room {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 8px;
    background: var(--mg-soft);
    color: #243a51;
    font: 500 12px/1.4 var(--mg-font);
}
/* дата — заголовок дня */
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1:not(#mg-none) tr[id*="DXGroupRow"] > td {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    text-align: left !important;
}
.mg-day {
    display: inline-flex;
    align-items: baseline;
    gap: 10px;
}
.mg-day b {
    color: var(--mg-ink);
    font: 600 15px/1.3 var(--mg-font);
}
.mg-day > span {
    color: var(--mg-muted);
    font: 400 14px/1.3 var(--mg-font);
}
.mg-day em {
    align-self: center;
    padding: 2px 8px;
    background: var(--mg-accent);
    color: #fff;
    font: 600 12px/1.4 var(--mg-font);
    font-style: normal;
}
.mg-day em.is-soon {
    background: var(--mg-soft);
    color: #243a51;
}
html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_ASPxGridView1:not(#mg-none) tr.mg-day--today > td {
    background: #eaf1fd !important;
}

@media (max-width: 767px) {
    html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr > td {
        flex: 1 1 50%;
        min-height: 0;
        padding: 12px 14px !important;
        border-bottom: 1px solid var(--mg-line) !important;
    }
    html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 > tbody > tr:last-child > td:last-child {
        margin-left: 0;
    }
    html:has(#ctl00_MainContent_cmbTypeView) #ctl00_MainContent_Table1 table.dxeButtonEditSys {
        width: 100% !important;
    }
}

/* ------------------------------------------------------------
   ВЕДОМОСТИ (Ved/ и Ved/Default.aspx?group=N)

   Шапку сервера (.ved-header-row: «Деканат», заголовок, справа
   фильтры) собирает скрипт самой страницы. Наша шапка стоит перед
   ней, от серверной остаётся строка фильтров. На странице группы
   фильтр семестра переезжает в факты (mg-ved-sem), а шапка сервера
   скрыта целиком. Тип ведомости — меткой (mg-kind), «Закрыта» —
   статусом с квадратиком (mg-state).
   ------------------------------------------------------------ */
html.mg-gen-on .ved-eyebrow {
    display: none !important;
}
html.mg-gen-on .ved-header-row {
    justify-content: flex-start !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    border: 0 !important;
}
/* от левой части остались только скрытые «Деканат» и исходный заголовок */
html.mg-gen-on .ved-title:not(:has(> :not(.ved-eyebrow, .mg-gen-src))) {
    display: none !important;
}
html.mg-ved-on .ved-header-row {
    display: none !important;
}
/* строка фильтров списка групп: подписи — как у остальных фильтров, по левому краю */
html.mg-gen-on .ved-filters-wrap td {
    padding: 0 16px 0 0 !important;
    border: 0 !important;
    text-align: left !important;
}
html.mg-gen-on .ved-filters-wrap #ctl00_MainContent_Table1 {
    border: 0 !important;
}
html.mg-gen-on .ved-flabel {
    display: block !important;
    margin: 0 0 6px !important;
    color: var(--mg-muted) !important;
    font: 400 13px/1.2 var(--mg-font) !important;
    letter-spacing: 0 !important;
    text-transform: lowercase !important;   /* скрипт сервера пишет «ФАКУЛЬТЕТ» капсом */
}
html.mg-gen-on .ved-flabel::first-letter {
    text-transform: uppercase;
}
/* список групп: группа — по левому краю (у сервера по центру широкой колонки);
   заголовок скрипт выравнивает так же, как ячейки */
html.mg-gen-on #ctl00_MainContent_ucListGroupBox_ListGroupTable:not(#mg-none) tr[id*="DXDataRow"] > td:first-child {
    text-align: left !important;
}

/* факты: типы ведомостей занимают остаток строки, семестр — справа */
.mg-facts .mg-fact--kinds {
    flex: 1 1 320px;
}
.mg-grades .mg-kind {
    margin: 0;
    padding: 5px 9px;
    font-size: 13px;
}
.mg-grades .mg-kind b {
    margin-left: 3px;
    font-weight: 700;
}
/* блок со списком table.js общий слой делает строкой фильтров — здесь
   это факт: подпись над списком, без внешних отступов */
html.mg-gen-on .body-content .mg-facts > .mg-fact.mg-ved-sem {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: center;
    gap: 6px;
    margin: 0 0 0 auto;
    padding: 12px 24px;
}
.mg-ved-sem .dst-select {
    display: block;
}

.mg-kind--graded { background: #eaf1fd; color: #1d4ed8; }
.mg-state {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--mg-ink);
    font: 500 13px/1.3 var(--mg-font);
    white-space: nowrap;
}
.mg-state::before {
    content: '';
    flex: none;
    width: 8px;
    height: 8px;
    background: var(--mg-accent);
}
.mg-state--closed::before {
    background: #15803d;
}
html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td {
    vertical-align: middle;
}
html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td:first-child a {
    font-weight: 500;
}
html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td.mg-ved-date {
    color: var(--mg-muted) !important;
    white-space: nowrap;
}

@media (max-width: 991px) {
    .mg-facts .mg-fact--kinds {
        grid-column: 1 / -1;
        border-right: 0 !important;
    }
    /* семестр — своей строкой, от левого края, как остальные факты */
    html.mg-gen-on .body-content .mg-facts > .mg-fact.mg-ved-sem {
        margin: 0;
        padding: 16px 24px;
    }
}
@media (max-width: 767px) {
    /* фильтры списка групп — друг под другом, во всю ширину */
    html.mg-gen-on .ved-header-row,
    html.mg-gen-on .ved-filters-wrap,
    html.mg-gen-on .ved-filters-wrap #ctl00_MainContent_Table1,
    html.mg-gen-on .ved-filters-wrap #ctl00_MainContent_Table1 > tbody,
    html.mg-gen-on .ved-filters-wrap #ctl00_MainContent_Table1 > tbody > tr {
        display: block !important;
        width: auto !important;
    }
    html.mg-gen-on .ved-filters-wrap #ctl00_MainContent_Table1 > tbody > tr > td {
        display: block !important;
        width: auto !important;
        padding: 0 0 12px !important;
    }
    html.mg-gen-on .ved-filters-wrap .dst-select {
        display: block;
    }
    html.mg-gen-on .ved-filters-wrap .dst-select__btn {
        width: 100%;
    }
    /* факты списком; семестр — список во всю ширину */
    html.mg-gen-on .body-content .mg-facts > .mg-fact.mg-ved-sem {
        align-items: stretch;
        margin: 0;
        padding: 12px 16px;
    }
    .mg-ved-sem .dst-select__btn {
        width: 100%;
    }
    /* типы — под подписью, в строку с переносом */
    .mg-facts > .mg-fact--kinds:nth-child(n) {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    /* таблица — карточками: дисциплина сверху, под ней тип, статус и дата */
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable,
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable > tbody,
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable > tbody > tr,
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable > tbody > tr > td,
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable .dxgvTable_MaterialCompact,
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable .dxgvTable_MaterialCompact > tbody {
        display: block !important;
        width: auto !important;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
        display: none !important;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 14px;
        padding: 14px 16px;
        border-bottom: 1px solid #eef1f6;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"]:is(:last-child, .dst-lastvis) {
        border-bottom: 0;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td {
        display: block !important;
        width: auto !important;
        height: auto !important;        /* у ячеек сайта высота 48px */
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        text-align: left !important;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td:first-child {
        flex: 1 1 100%;
        font-size: 15px !important;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable:not(#mg-none) tr[id*="DXDataRow"] > td.mg-ved-date {
        margin-left: auto;
        font-size: 13px !important;
    }
    html.mg-ved-on #ctl00_MainContent_ucListVedBox_ListVedTable .mg-kind {
        margin: 0;
    }
    .mg-marks {
        width: 100%;
        justify-content: center;
    }
}

/* ------------------------------------------------------------
   ВЕДОМОСТЬ (Ved/Ved.aspx?id=N)

   Заголовок — дисциплина, под ним тип, статус и название с номером
   (mg-vs-sub). Сведения — сеткой 4×3 (mg-vs-info). Разрезанную
   таблицу table.js (.dst-split: слева «№ / ФИО» с float и шириной
   20%, справа iScroll) оформляем общей карточкой; половины ровняет
   по высоте table.js. На телефоне вместо таблицы — карточки студентов
   (mg-vs-cards), их собирает скрипт из обеих половин.
   ------------------------------------------------------------ */
.mg-vs-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin: 14px 0 0 !important;
}
.mg-vs-sub .mg-kind {
    margin: 0;
}
.mg-vs-sub__name {
    color: var(--mg-muted);
    font: 400 14px/1.4 var(--mg-font);
}

/* сведения: линии ячеек заходят на рамку сетки — пустой хвост строки не рвёт рамку */
.mg-vs-info {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    margin: 0 0 32px;
    border: 1px solid var(--mg-line);
    background: #fff;
}
.mg-vs-info__item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    margin: 0 -1px -1px 0;
    padding: 14px 20px;
    border-right: 1px solid var(--mg-line);
    border-bottom: 1px solid var(--mg-line);
}
.mg-vs-info__item > span {
    color: var(--mg-muted);
    font: 400 13px/1.2 var(--mg-font);
}
.mg-vs-info__item > b {
    color: var(--mg-ink);
    font: 500 15px/1.35 var(--mg-font);
    overflow-wrap: anywhere;
}
/* перенесённые подписи сервера (span.TitleVedInf, у статуса инлайн bold) */
.mg-vs-info__item > b * {
    font: inherit !important;
}
.mg-vs-info__item a {
    color: var(--mg-accent) !important;
    text-decoration: none !important;
}
.mg-vs-info__item a:hover {
    color: var(--mg-accent-hover) !important;
    text-decoration: underline !important;
}
.mg-vs-info .mg-none,
.mg-vs-card .mg-none {
    color: #b8c0cc;
    font-style: normal;
}

/* «Студенты N» и сводка оценок */
.mg-vs-sum {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 24px;
    margin: 0 0 14px;
}
.mg-vs-sum .mg-dir__h2 {
    margin: 0 !important;
}
.mg-vs-sum__none {
    color: var(--mg-muted);
    font: 400 14px/1.4 var(--mg-font);
}

/* разрезанная таблица — одной карточкой, шов между половинами — линией */
html.mg-gen-on .body-content .dst-split {
    margin: 0 0 8px !important;
    border: 1px solid var(--mg-line);
    background: #fff !important;
    box-shadow: none !important;
}
html.mg-gen-on .dst-split table.fixed-scroll {
    border-right: 1px solid var(--mg-line) !important;
}
/* подсветка строки — сразу в обеих половинах (класс dst-hover ставит table.js) */
html.mg-gen-on .dst-split td.dst-hover {
    background-color: #f7f9fc !important;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVedFixed:not(#mg-none) tr[id*="DXDataRow"] > td:first-child {
    color: var(--mg-muted) !important;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVedFixed:not(#mg-none) tr[id*="DXDataRow"] > td:last-child {
    color: var(--mg-ink) !important;
    font-weight: 500 !important;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr[id*="DXDataRow"] > td {
    vertical-align: middle;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr[id*="DXDataRow"] > td:is(.mg-vs-book, .mg-ved-date) {
    color: var(--mg-muted) !important;
    white-space: nowrap !important;     /* table.js разрешает переносы всем ячейкам */
}
/* Колонки правой половины (раскладка fixed, ширины — по строке dxgvArm,
   у сервера по 150px, то есть поровну): зачётка — по длинному номеру
   «БИТУ-з-05.03.06-25/105683», дата — по дате, оценка — остаток */
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr.dxgvArm > td:nth-child(1) {
    width: 240px !important;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr.dxgvArm > td:nth-child(2) {
    width: 140px !important;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr.dxgvArm > td:nth-child(3) {
    width: auto !important;
}
/* шапка — в одну строку, как у остальных таблиц: у сайта (StyleVed.css)
   левая шапка 71px и перенос в «Номер зачетной <br>книжки». Без !important:
   высоты половин table.js выравнивает инлайном, это должно работать */
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVedFixed_DXHeadersRow0,
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed td.height72 {
    height: auto;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed tr[id*="DXHeadersRow"] br {
    display: none;
}
html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVed:not(#mg-none) tr[id*="DXDataRow"] > td.mg-vs-book {
    font-size: 13px !important;
}
.mg-vs-cards {
    display: none;
}

@media (max-width: 1199px) {
    /* ФИО в 20% узкой страницы переносится — левую половину шире */
    html.mg-vs-on #ctl00_MainContent_ucVedBox_TableVedFixed {
        width: 30% !important;
    }
}
@media (max-width: 991px) {
    .mg-vs-info {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    /* сведения — строками «подпись … значение» */
    .mg-vs-info {
        display: block;
    }
    .mg-vs-info__item {
        flex-direction: row;
        justify-content: space-between;
        align-items: baseline;
        gap: 16px;
        margin: 0;
        padding: 11px 16px;
        border-right: 0;
    }
    .mg-vs-info__item:last-child {
        border-bottom: 0;
    }
    .mg-vs-info__item > span {
        flex: none;
    }
    .mg-vs-info__item > b {
        min-width: 0;
        text-align: right;
    }
    /* таблица → карточки студентов */
    html.mg-vs-on .body-content .dst-split {
        display: none !important;
    }
    .mg-vs-cards {
        display: block;
        margin: 0 0 8px;
        border: 1px solid var(--mg-line);
        background: #fff;
    }
    .mg-vs-card {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 12px 16px;
        border-bottom: 1px solid #eef1f6;
    }
    .mg-vs-card:last-child {
        border-bottom: 0;
    }
    .mg-vs-card__n {
        flex: none;
        min-width: 22px;
        color: var(--mg-muted);
        font: 500 13px/1.3 var(--mg-font);
        font-variant-numeric: tabular-nums;
    }
    .mg-vs-card__main {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        gap: 3px;
        min-width: 0;
    }
    .mg-vs-card__main b {
        color: var(--mg-ink);
        font: 500 15px/1.3 var(--mg-font);
    }
    .mg-vs-card__main small {
        color: var(--mg-muted);
        font: 400 12px/1.35 var(--mg-font);
        overflow-wrap: anywhere;
    }
    .mg-vs-card > :is(.mg-grade, .mg-none) {
        flex: none;
    }
}

/* ------------------------------------------------------------
   УЧЕБНАЯ НАГРУЗКА ГРУППЫ (Nagr/Nagr.aspx?group=N)

   Всё содержимое у сервера в обёртке, которой table.js дал класс
   .dst-filters (центрирование, max-width 1100px) — на всю ширину.
   Строки одной дисциплины — блок (mg-blk-start / mg-blk-end ставит
   скрипт): внутри блока строки плотнее и без линий, между блоками —
   линия; повторы (mg-rep) скрыты цветом, на телефоне — убраны.
   ------------------------------------------------------------ */
html.mg-nagr-on .body-content > div.dst-filters {
    display: block !important;
    max-width: none !important;
    margin: 0 !important;
    text-align: left !important;
}
html.mg-nagr-on .body-content > div.dst-filters > br {
    display: none;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td {
    height: auto !important;            /* у ячеек сайта 48px — блоки вышли бы рыхлыми */
    vertical-align: middle;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"]:not(.mg-blk-end) > td {
    padding-bottom: 5px !important;
    border-bottom-color: transparent !important;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"]:not(.mg-blk-start) > td {
    padding-top: 5px !important;
}
/* в блоке сменилась сессия (зимняя → летняя) — отбивка */
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"].mg-sess-start > td {
    padding-top: 14px !important;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"].mg-blk-end > td {
    border-bottom: 1px solid #eef1f6 !important;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"]:is(:last-child, .dst-lastvis) > td {
    border-bottom: 0 !important;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td:first-child {
    color: var(--mg-ink) !important;
    font-weight: 500 !important;
}
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td.mg-rep {
    color: transparent !important;
}
/* вид занятий — квадратик цвета и подпись (виды контроля рядом — метками) */
.mg-lesson {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.mg-lesson::before {
    content: '';
    flex: none;
    width: 8px;
    height: 8px;
    background: #98a2b3;
}
.mg-lesson--lec::before { background: #1d4ed8; }
.mg-lesson--pr::before  { background: #0f766e; }
.mg-lesson--lab::before { background: #7e22ce; }
html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) .mg-kind {
    margin: 0;
}

@media (max-width: 767px) {
    /* таблица — списком: название дисциплины заголовком блока, под ним
       строки «сессия · преподаватель · вид занятий · контроль» */
    html.mg-nagr-on #ctl00_MainContent_Grid,
    html.mg-nagr-on #ctl00_MainContent_Grid > tbody,
    html.mg-nagr-on #ctl00_MainContent_Grid > tbody > tr,
    html.mg-nagr-on #ctl00_MainContent_Grid > tbody > tr > td,
    html.mg-nagr-on #ctl00_MainContent_Grid .dxgvTable_MaterialCompact,
    html.mg-nagr-on #ctl00_MainContent_Grid .dxgvTable_MaterialCompact > tbody {
        display: block !important;
        width: auto !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
        display: none !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px 12px;
        padding: 4px 16px;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"].mg-blk-start {
        padding-top: 14px;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"].mg-blk-end {
        padding-bottom: 14px;
        border-bottom: 1px solid #eef1f6;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td {
        display: block !important;
        width: auto !important;
        height: auto !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        text-align: left !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td:first-child {
        flex: 1 1 100%;
        font-size: 15px !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td:is(.mg-rep, .mg-empty-cell, .dxgvAIC) {
        display: none !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(2),
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(3) {
        color: var(--mg-muted) !important;
        font-size: 13px !important;
    }
    html.mg-nagr-on #ctl00_MainContent_Grid:not(#mg-none) tr[id*="DXDataRow"].mg-sess-start {
        padding-top: 10px;
    }
    /* фильтры: подписи одной ширины, списки ровно под друг другом во всю ширину */
    html.mg-nagr-on .mg-nagr-filters .dst-filter {
        display: grid !important;
        grid-template-columns: 76px minmax(0, 1fr);
        width: 100%;
    }
    html.mg-nagr-on .mg-nagr-filters :is(.dst-select, .dst-select__btn) {
        width: 100%;
    }
}

/* ------------------------------------------------------------
   УПРАВЛЕНИЕ НОВОСТЯМИ (admin/NewsManager.aspx)

   Список (html.mg-news-list): «Добавить новость» — в шапке справа,
   в таблице миниатюра картинки, метка «Полная» / «Анонс», заголовок
   жирным, краткий текст приглушённо, «Изменить» — кнопкой.
   Форма (html.mg-news-form): белая карточка, подписи слева 220px, поля
   на всю ширину, редактор текста во всю ширину, кнопки — панелью внизу
   (скрипт переносит их туда; «Удалить» — справа, красная).
   ------------------------------------------------------------ */
.mg-btn2--sm {
    gap: 6px;
    height: 34px;
    padding: 0 12px;
    font-size: 13px;
    white-space: nowrap;
}
.mg-btn2--sm .mg-ico {
    width: 14px;
    height: 14px;
}
/* список */
html.mg-news-list #ctl00_MainContent_AllNewsBlock > br {
    display: none;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr:is([id*="DXHeadersRow"], [id*="DXDataRow"]) > td,
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXHeadersRow"] > td td {
    text-align: left !important;
    vertical-align: middle;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXHeadersRow"] > td table {
    margin-left: 0 !important;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
/* колонки по порядку сервера: вид, картинка, заголовок, краткий текст, кнопка */
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(1) {
    width: 110px;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(2) {
    width: 124px;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(3) {
    width: 32%;
    color: var(--mg-ink) !important;
    font-weight: 600 !important;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(4) {
    color: var(--mg-muted) !important;
}
html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:last-child {
    width: 130px;
    text-align: right !important;
}
.mg-news-thumb {
    display: block;
    width: 96px;
    height: 60px;
    border: 1px solid var(--mg-line);
    background: #f3f5f8;
    object-fit: cover;
}
.mg-tag--on {
    background: #eaf1fd !important;
    color: var(--mg-accent) !important;
}
/* «Добавить новость» в шапке — кнопка DevExpress, как кнопки нашего стиля */
html.mg-news-list .mg-dir__head .dxbButton_MaterialCompact.mg-act--primary {
    height: 42px;
    margin: 0;
}
html.mg-news-list .mg-dir__head .dxbButton_MaterialCompact .dx-vam {
    display: inline-flex !important;    /* у DevExpress inline-block — значок вставал по базовой линии */
    align-items: center;
    gap: 8px;
}
html.mg-news-list .mg-dir__head .dxbButton_MaterialCompact .mg-ico {
    width: 16px;
    height: 16px;
}

/* форма */
html.mg-news-form #ctl00_MainContent_AddNewsBlock {
    padding: 24px 28px;
    border: 1px solid var(--mg-line);
    background: #fff;
}
html.mg-news-form #ctl00_MainContent_tb1 {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: collapse;
}
html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr > td {
    padding: 8px 0;
    vertical-align: top;
    text-align: left;
}
/* подписи — колонка слева */
html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr > td:first-child:not([colspan]) {
    width: 260px;                   /* «Только для зарегистрированных пользователей» — в две строки */
    padding-top: 18px;
    padding-right: 24px;
}
html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr > td:first-child:not([colspan]) .dxeBase_MaterialCompact,
html.mg-news-form #ctl00_MainContent_tb1 .mg-news-label {
    color: var(--mg-text) !important;
    font: 500 14px/1.35 var(--mg-font) !important;
}
html.mg-news-form #ctl00_MainContent_tb1 .mg-news-label {
    padding-top: 22px !important;
    padding-bottom: 6px !important;
}
/* превью картинки */
html.mg-news-form #uploadedImage {
    display: block;
    width: auto;
    max-width: min(360px, 100%);
    height: auto;
    border: 1px solid var(--mg-line);
    background: #f3f5f8;
}
/* поля DevExpress: во всю ширину, рамка 1px, фокус — акцентом */
html.mg-news-form #ctl00_MainContent_tb1 :is(table.dxeTextBoxSys, table.dxeMemoSys, table.dxucControl_MaterialCompact) {
    width: 100% !important;
}
html.mg-news-form #ctl00_MainContent_tb1 :is(table.dxeTextBoxSys, table.dxeMemoSys) {
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
    box-shadow: none !important;
    transition: border-color .15s;
}
html.mg-news-form #ctl00_MainContent_tb1 :is(table.dxeTextBoxSys, table.dxeMemoSys):hover {
    border-color: #c9d2de !important;
}
html.mg-news-form #ctl00_MainContent_tb1 :is(table.dxeTextBoxSys, table.dxeMemoSys)[class*="dxeFocused"] {
    border-color: var(--mg-accent) !important;
}
html.mg-news-form #ctl00_MainContent_tb1 :is(table.dxeTextBoxSys, table.dxeMemoSys) td {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}
html.mg-news-form #ctl00_MainContent_tb1 table.dxeTextBoxSys input {
    box-sizing: border-box;
    height: 42px !important;
    padding: 0 12px !important;
    border: 0 !important;
    background: none !important;
    color: var(--mg-ink) !important;
    font: 400 15px/1 var(--mg-font) !important;
    outline: none !important;
}
html.mg-news-form #ctl00_MainContent_tb1 table.dxeMemoSys textarea {
    box-sizing: border-box;
    min-height: 88px;
    padding: 10px 12px !important;
    border: 0 !important;
    background: none !important;
    color: var(--mg-ink) !important;
    font: 400 15px/1.45 var(--mg-font) !important;
    outline: none !important;
    resize: vertical;
}
/* загрузка картинки: поле, крестик и «Обзор…» — как остальные поля */
html.mg-news-form #ctl00_MainContent_UploadControl td:is(.dxucTextBox_MaterialCompact, .dxucBrowseButton_MaterialCompact) {
    height: 42px;
    border-color: var(--mg-line) !important;
}
html.mg-news-form #ctl00_MainContent_UploadControl input.dxucEditArea_MaterialCompact {
    padding-left: 4px !important;
    color: var(--mg-ink) !important;
    font: 400 15px/1 var(--mg-font) !important;
}
/* файл не выбран — подсказка «Добавить файл» бледная, как у других полей */
html.mg-news-form #ctl00_MainContent_UploadControl td.dxucNullText_MaterialCompact input.dxucEditArea_MaterialCompact {
    color: #8a94a6 !important;
}
html.mg-news-form #ctl00_MainContent_UploadControl td.dxucBrowseButton_MaterialCompact {
    padding: 0 18px !important;
    background: #fff !important;
    cursor: pointer;
    transition: background-color .15s;
}
html.mg-news-form #ctl00_MainContent_UploadControl td.dxucBrowseButton_MaterialCompact:hover {
    background: #f7f9fc !important;
}
html.mg-news-form #ctl00_MainContent_UploadControl td.dxucBrowseButton_MaterialCompact a {
    color: var(--mg-ink) !important;
    font: 500 14px/1 var(--mg-font) !important;
    text-decoration: none !important;
}
/* редактор текста — во всю ширину, рамка как у полей. Ширину 738px
   DevExpress пишет при загрузке инлайном внутренней таблице — перекрываем,
   панель инструментов и область текста (iframe) тянутся за ней */
html.mg-news-form #ctl00_MainContent_HtmlEditor {
    width: 100% !important;
    border: 1px solid var(--mg-line) !important;
}
html.mg-news-form #ctl00_MainContent_HtmlEditor_MainCell > table {
    width: 100% !important;
}
/* кнопки — панель внизу карточки */
.mg-news-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--mg-line);
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact:not(#mg-none) {
    width: auto !important;
    min-width: 140px;
    height: 42px;
    margin: 0;
}
/* «Отмена» — белая с рамкой, «Удалить» — справа, красная */
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact:not(.mg-act--primary):not(#mg-none) {
    border: 1px solid var(--mg-line) !important;
    background: #fff !important;
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact:not(.mg-act--primary):not(#mg-none):hover {
    border-color: #c9d2de !important;
    background: #f7f9fc !important;
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact:not(.mg-act--primary):not(#mg-none) .dx-vam {
    color: var(--mg-ink) !important;
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact.mg-act--danger:not(#mg-none) {
    margin-left: auto;
    border-color: #f1c4c0 !important;
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact.mg-act--danger:not(#mg-none):hover {
    border-color: #b42318 !important;
    background: #fdecec !important;
}
html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact.mg-act--danger:not(#mg-none) .dx-vam {
    color: #b42318 !important;
}

@media (max-width: 767px) {
    /* список — карточками: миниатюра слева, заголовок и текст справа */
    html.mg-news-list #ctl00_MainContent_gvNews,
    html.mg-news-list #ctl00_MainContent_gvNews > tbody,
    html.mg-news-list #ctl00_MainContent_gvNews > tbody > tr,
    html.mg-news-list #ctl00_MainContent_gvNews > tbody > tr > td,
    html.mg-news-list #ctl00_MainContent_gvNews .dxgvTable_MaterialCompact,
    html.mg-news-list #ctl00_MainContent_gvNews .dxgvTable_MaterialCompact > tbody {
        display: block !important;
        width: auto !important;
    }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) :is(tr.dxgvArm, tr[id*="DXHeadersRow"]) {
        display: none !important;
    }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] {
        display: grid !important;
        grid-template-columns: 96px minmax(0, 1fr);
        grid-template-areas: "img title" "img text" "img meta";
        gap: 4px 14px;
        padding: 14px 16px;
        border-bottom: 1px solid #eef1f6;
    }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"]:last-child {
        border-bottom: 0;
    }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td {
        display: block !important;
        width: auto !important;
        height: auto !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        text-align: left !important;
    }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(1) { grid-area: meta; }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(2) { grid-area: img; }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(3) { grid-area: title; }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:nth-child(4) { grid-area: text; font-size: 13px !important; }
    html.mg-news-list #ctl00_MainContent_gvNews:not(#mg-none) tr[id*="DXDataRow"] > td:last-child {
        grid-column: 1 / -1;
        margin-top: 8px;
        text-align: left !important;
    }
    html.mg-news-list .mg-news-thumb {
        width: 96px;
        height: 64px;
    }
    /* форма — подписи над полями */
    html.mg-news-form #ctl00_MainContent_AddNewsBlock {
        padding: 16px;
    }
    html.mg-news-form #ctl00_MainContent_tb1,
    html.mg-news-form #ctl00_MainContent_tb1 > tbody,
    html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr:not([style*="display:none"]),
    html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr > td {
        display: block !important;
        width: auto !important;
    }
    html.mg-news-form #ctl00_MainContent_tb1 > tbody > tr > td:first-child:not([colspan]) {
        width: auto;
        padding: 12px 0 6px;
    }
    .mg-news-actions .dxbButton_MaterialCompact {
        flex: 1 1 100%;
    }
    html.mg-news-form .mg-news-actions .dxbButton_MaterialCompact.mg-act--danger:not(#mg-none) {
        margin-left: 0;
    }
}

/* ------------------------------------------------------------
   ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ — панель справа

   Глаз в шапке открывает панель (html.mg-a11y-open). Настройки
   скрипт ставит атрибутами на <html>: data-mg-fs, -c, -font, -ls,
   -lh, -img, -cursor, -links, -still — правила ниже.

   Отмеченный вариант — рамкой-outline и галочкой из рамок
   (currentColor): в цветовых схемах фоны и цвета у всех элементов
   принудительно свои, а outline и псевдоэлементы остаются видны.
   ------------------------------------------------------------ */
.mg-eye {
    position: relative;
}
/* глаз помечен, пока включена хоть одна настройка */
.mg-eye.is-on::after {
    content: '';
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    background: #7fb2f5;
}
.mg-a11y-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1055;
    background: rgba(10, 16, 24, .45);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, visibility 0s .25s;
}
.mg-a11y {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1060;
    display: flex;
    flex-direction: column;
    width: min(440px, 100%);
    border-left: 1px solid var(--mg-line);
    background: #fff;
    color: var(--mg-ink);
    font-family: var(--mg-font);
    text-align: left;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform .3s cubic-bezier(.2, .7, .3, 1), visibility 0s .3s;
}
html.mg-a11y-open .mg-a11y {
    transform: none;
    visibility: visible;
    transition: transform .3s cubic-bezier(.2, .7, .3, 1);
}
html.mg-a11y-open .mg-a11y-backdrop {
    opacity: 1;
    visibility: visible;
    transition: opacity .25s;
}
html.mg-a11y-open,
html.mg-a11y-open body {
    overflow: hidden !important;
}
.mg-a11y__head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 22px 24px 18px;
    border-bottom: 1px solid var(--mg-line);
}
.mg-a11y__titles {
    flex: 1 1 auto;
    min-width: 0;
}
.mg-a11y__titles h2 {
    margin: 0 0 4px !important;
    color: var(--mg-ink);
    font: 600 20px/1.25 var(--mg-font) !important;
    letter-spacing: -.01em;
}
.mg-a11y__titles p {
    margin: 0 !important;
    color: var(--mg-muted);
    font: 400 13px/1.4 var(--mg-font);
}
.mg-a11y__close {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: -4px -8px 0 0;
    padding: 0;
    border: 1px solid var(--mg-line);
    background: #fff;
    color: var(--mg-ink);
    cursor: pointer;
    transition: border-color .15s;
}
.mg-a11y__close:hover {
    border-color: #c9d2de;
}
.mg-a11y__close .mg-ico {
    width: 18px;
    height: 18px;
}
.mg-a11y__body {
    flex: 1 1 auto;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 4px 24px 24px;
}
.mg-a11y__sec {
    padding: 20px 0;
    border-bottom: 1px solid var(--mg-line);
}
.mg-a11y__sec:last-child {
    border-bottom: 0;
}
.mg-a11y__sec h3 {
    margin: 0 0 12px !important;
    color: var(--mg-muted);
    font: 600 13px/1.3 var(--mg-font) !important;
    letter-spacing: 0;
}

/* размер текста: «А−  125 %  А+» */
.mg-a11y__step {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--mg-line);
}
.mg-a11y__step button {
    flex: 0 0 72px;
    height: 52px;
    margin: 0;
    padding: 0;
    border: 0;
    background: #fff;
    color: var(--mg-ink);
    font: 600 18px/1 var(--mg-font);
    cursor: pointer;
    transition: background-color .15s;
}
.mg-a11y__step button[data-step="1"] {
    font-size: 22px;
}
.mg-a11y__step button:hover:not(:disabled) {
    background: #f3f5f8;
}
.mg-a11y__step button:disabled {
    color: #b8c0cc;
    cursor: default;
}
.mg-a11y__step output {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    border-right: 1px solid var(--mg-line);
    border-left: 1px solid var(--mg-line);
    color: var(--mg-ink);
    font: 600 17px/1 var(--mg-font);
    font-variant-numeric: tabular-nums;
}

/* варианты: карточки (цвет, шрифт) и сегменты (интервалы, изображения) */
.mg-a11y__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.mg-a11y__seg {
    display: grid;
    grid-auto-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    gap: 8px;
}
.mg-a11y__opt {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid var(--mg-line);
    background: #fff;
    color: var(--mg-ink);
    font: 500 14px/1.25 var(--mg-font);
    text-align: center;
    cursor: pointer;
    transition: border-color .15s, background-color .15s;
}
.mg-a11y__opt:hover {
    border-color: #c9d2de;
}
.mg-a11y__opt[aria-pressed="true"] {
    background: #eaf1fd;
    color: var(--mg-accent);
    outline: 2px solid var(--mg-accent);
    outline-offset: -2px;
}
/* галочка в углу — из двух рамок, цвет текста кнопки */
.mg-a11y__opt[aria-pressed="true"]::after {
    content: '';
    position: absolute;
    top: 8px;
    right: 8px;
    width: 9px;
    height: 5px;
    border: solid currentColor;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
}
.mg-a11y__seg .mg-a11y__opt[aria-pressed="true"]::after {
    content: none;
}
.mg-a11y__card {
    flex-direction: column;
    gap: 8px;
    min-height: 104px;
    padding: 12px 8px 10px;
}
.mg-a11y__sw {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 40px;
    border: 1px solid transparent;
    font: 600 20px/1 var(--mg-font);
}
.mg-a11y__sw--font {
    border: 0;
    background: none;
    color: inherit;
    font-size: 26px;
    font-weight: 400;
}
.mg-a11y__lbl {
    font: 500 12px/1.25 var(--mg-font);
}
.mg-a11y__opt:focus-visible,
.mg-a11y__step button:focus-visible,
.mg-a11y__switch:focus-visible,
.mg-a11y__close:focus-visible,
.mg-a11y .mg-btn2:focus-visible {
    outline: 2px solid var(--mg-accent);
    outline-offset: 2px;
}

/* переключатели «Дополнительно»: дорожка — рамка, ползунок — currentColor */
.mg-a11y__switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--mg-ink);
    font: 500 15px/1.3 var(--mg-font);
    text-align: left;
    cursor: pointer;
}
.mg-a11y__switch i {
    position: relative;
    flex: none;
    width: 44px;
    height: 24px;
    border: 2px solid #c9d2de;
    background: #fff;
    color: #c9d2de;
    transition: background-color .15s, border-color .15s;
}
.mg-a11y__switch i::before {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    background: currentColor;
    transition: transform .15s;
}
.mg-a11y__switch[aria-checked="true"] i {
    border-color: var(--mg-accent);
    background: var(--mg-accent);
    color: #fff;
}
.mg-a11y__switch[aria-checked="true"] i::before {
    transform: translateX(20px);
}
.mg-a11y__speak {
    justify-content: center;
    width: 100%;
    margin-top: 12px;
}
.mg-a11y__hint {
    margin: 8px 0 0 !important;
    color: var(--mg-muted);
    font: 400 13px/1.4 var(--mg-font);
}
.mg-a11y__foot {
    padding: 16px 24px;
    border-top: 1px solid var(--mg-line);
}
.mg-a11y__reset {
    justify-content: center;
    width: 100%;
}
.mg-a11y__reset:disabled {
    color: #b8c0cc !important;
    cursor: default;
}
.mg-a11y__reset:disabled:hover {
    border-color: var(--mg-line);
    background: #fff;
}
@media (max-width: 480px) {
    .mg-a11y {
        border-left: 0;
    }
    .mg-a11y__head,
    .mg-a11y__foot {
        padding-right: 16px;
        padding-left: 16px;
    }
    .mg-a11y__body {
        padding-right: 16px;
        padding-left: 16px;
    }
    .mg-a11y__close {
        margin-right: 0;
    }
}

/* --- размер текста: содержимое страницы — zoom (шапка, подвал и первый
   экран главной во всю ширину окна — нет: их ширина считается от окна) --- */
html[data-mg-fs="125"] { --mg-z: 1.25; }
html[data-mg-fs="150"] { --mg-z: 1.5; }
html[data-mg-fs="175"] { --mg-z: 1.75; }
html[data-mg-fs="200"] { --mg-z: 2; }
html[data-mg-fs] .body-content > :not(footer, .mg-footer, script, style, link, hr, .scrollup, .fixed-action-btn, #ctl00_MainContent_menuSettings, :has(> #sectionPhoto)),
html[data-mg-fs] .body-content > div:has(> #sectionPhoto) > :not(#sectionPhoto, script, style, link) {
    zoom: var(--mg-z, 1);
}
/* Медиазапросы zoom не видят: при 150 % и больше содержимое по ширине как
   на планшете, а сетки остаются в 3–4 колонки. Переводим их в две,
   на телефоне — в одну */
html[data-mg-fs]:not([data-mg-fs="125"]) :is(.mg-quick .block-button, .mg-dir__grid, .mg-acts, .mg-legend ul, .mg-cards, .mg-vs-info),
html[data-mg-fs]:not([data-mg-fs="125"]) #ctl00_MainContent_ucStud_ASPxGridView1:not(#mg-none) .dxgvTable_MaterialCompact > tbody,
html[data-mg-fs]:not([data-mg-fs="125"]) .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
@media (max-width: 767px) {
    html[data-mg-fs] :is(.mg-quick .block-button, .mg-dir__grid, .mg-acts, .mg-legend ul, .mg-cards),
    html[data-mg-fs] #ctl00_MainContent_ucStud_ASPxGridView1:not(#mg-none) .dxgvTable_MaterialCompact > tbody,
    html[data-mg-fs] .mg-grid--list:not(#mg-none) .dxgvTable_MaterialCompact > tbody {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    html[data-mg-fs] .mg-vs-info {
        grid-template-columns: none !important;
    }
}

/* --- цвет: одно правило на все схемы, цвета — переменные. Шесть :not(#…)
   — вес шести id: иначе не перебить правила страниц с id и !important.
   Образцы в панели (.mg-a11y__sw) не трогаем, полупрозрачные подложки
   (панели, меню, модальных окон) тоже — иначе они стали бы сплошными --- */
html[data-mg-c="bw"]    { --a11y-bg: #fff;    --a11y-fg: #000; }
html[data-mg-c="wb"]    { --a11y-bg: #000;    --a11y-fg: #fff; }
html[data-mg-c="blue"]  { --a11y-bg: #9dd1ff; --a11y-fg: #063462; }
html[data-mg-c="beige"] { --a11y-bg: #f7f3d6; --a11y-fg: #4d4b43; }
html[data-mg-c="green"] { --a11y-bg: #3b2716; --a11y-fg: #a9e44d; }
html[data-mg-c],
html[data-mg-c] body,
html[data-mg-c] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(.mg-a11y__sw, .mg-a11y-backdrop, .mg-sheet-backdrop, .modal-backdrop, [class*="modalBackground"]) {
    background-color: var(--a11y-bg) !important;
    background-image: none !important;
    color: var(--a11y-fg) !important;
    border-color: var(--a11y-fg) !important;
    outline-color: var(--a11y-fg) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
html[data-mg-c]::before {
    background-color: var(--a11y-bg) !important;   /* экран загрузки — фоном схемы */
}
/* текст и рамки псевдоэлементов (номера плиток, стрелки, галочки) — тоже
   цветом схемы; их фон не трогаем: это квадратики-метки и ползунки */
html[data-mg-c] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x)::before,
html[data-mg-c] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x)::after {
    color: var(--a11y-fg) !important;
    border-color: var(--a11y-fg) !important;
}
/* ссылки в тексте подчёркнуты; ссылки-кнопки и так в рамке */
html[data-mg-c] .body-content a:not(.mg-btn, .mg-btn2, .mg-chip, .mg-lk, .mg-seg a, .mg-site, .mg-social):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    text-decoration: underline !important;
}
/* фирменный градиент соцсети при наведении — не в схеме */
html[data-mg-c] .mg-social::before {
    display: none !important;
}
/* ползунок и галочка — цветом схемы */
html[data-mg-c] .mg-a11y__switch i::before {
    background: var(--a11y-fg) !important;
}
/* кнопки без рамки (залитые акцентом) после перекраски стали бы просто
   текстом — у всех кнопок рамка цвета текста */
html[data-mg-c] body :is(.mg-btn, .mg-btn2, .mg-lk, .mg-iconbtn, .mg-chip, .dst-chip, .dst-select__btn, .scrollup, input[type="submit"], input[type="button"]):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    border: 1px solid var(--a11y-fg) !important;
}

/* --- шрифт: переменные нашего CSS и table.js плюс всё остальное.
   Иконочные шрифты (Font Awesome, Glyphicons) и образцы в панели — нет --- */
html[data-mg-font="arial"] { --mg-font: Arial, Helvetica, sans-serif; --dst-font: Arial, Helvetica, sans-serif; }
html[data-mg-font="serif"] { --mg-font: "Times New Roman", Times, Georgia, serif; --dst-font: "Times New Roman", Times, Georgia, serif; }
html[data-mg-font] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(.fa, .glyphicon, [class*="icon"], .mg-a11y__sw) {
    font-family: var(--mg-font) !important;
}

/* --- интервалы --- */
html[data-mg-ls="1"] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    letter-spacing: .06em !important;
    word-spacing: .1em !important;
}
html[data-mg-ls="2"] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    letter-spacing: .12em !important;
    word-spacing: .2em !important;
}
html[data-mg-lh="1"] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    line-height: 1.5 !important;
}
html[data-mg-lh="2"] body *:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    line-height: 2 !important;
}

/* --- изображения: служебные картинки DevExpress (стрелки списков,
   сортировка, загрузка) не трогаем --- */
html[data-mg-img="gray"] :is(img, video, picture, .hero-bg) {
    filter: grayscale(1) !important;
}
html[data-mg-img="off"] :is(img, video, picture):not([src*="DXR.axd"], [class*="dx"]) {
    display: none !important;
}
html[data-mg-img="off"] .hero-bg {
    background-image: none !important;
}

/* --- крупный курсор: стрелка 48px, у ссылок и кнопок — синяя --- */
html[data-mg-cursor] body,
html[data-mg-cursor] body * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 2.5l14 11-6.3.9 3.7 6.7-2.9 1.5-3.6-6.8L4.5 20z' fill='%23000' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 9 5, auto !important;
}
html[data-mg-cursor] :is(a, button, select, label, summary, [role="button"], [onclick], .dst-select__btn, .dxgvHeader_MaterialCompact),
html[data-mg-cursor] :is(a, button, select, label, summary, [role="button"], [onclick], .dst-select__btn, .dxgvHeader_MaterialCompact) * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 2.5l14 11-6.3.9 3.7 6.7-2.9 1.5-3.6-6.8L4.5 20z' fill='%232761af' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 9 5, pointer !important;
}
html[data-mg-cursor] :is(input:not([type="button"], [type="submit"], [type="checkbox"], [type="radio"]), textarea) {
    cursor: text !important;
}

/* --- выделять ссылки в содержимом страницы: все подчёркнуты, ссылки
   в тексте ещё и залиты жёлтым; ссылки-плитки, кнопки и подвал — без
   заливки (иначе жёлтые блоки во всю ширину) --- */
html[data-mg-links] .body-content a:not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 3px;
}
html[data-mg-links] .body-content a:not(.mg-footer a, .app_store_btn, .mg-btn, .mg-btn2, .mg-chip, .mg-lk, .mg-seg a, .mg-back, .owl-prev, .owl-next):not(#mg-x):not(#mg-x):not(#mg-x):not(#mg-x) {
    background-color: #fff3a8 !important;
    color: #000 !important;
}

/* --- остановить анимацию: длительности почти нулевые (конечные
   состояния, в том числе у панели и прелоадера, сохраняются) --- */
html[data-mg-still] *,
html[data-mg-still] *::before,
html[data-mg-still] *::after {
    animation-duration: .001s !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001s !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
}

/* печать (кнопка «Печать» в шапке): без шапки, подвала и навигации сайта */
@media print {
    html.mg-hdr-on #ctl00_navbarMenu,
    html.mg-hdr-on .mg-footer,
    html.mg-hdr-on .mg-back,
    html.mg-hdr-on .mg-crumbs,
    html.mg-hdr-on .mg-print,
    html.mg-hdr-on .mg-marks,
    html.mg-hdr-on .mg-a11y,
    html.mg-hdr-on .mg-a11y-backdrop,
    html.mg-hdr-on .scrollup,
    html.mg-hdr-on footer.footer,
    html.mg-gen-on .dxctToolbar_MaterialCompact,
    html.mg-gen-on img[class*="gvExpandedButton"],
    html.mg-gen-on img[class*="gvCollapsedButton"] {
        display: none !important;
    }
    html.mg-hdr-on,
    html.mg-hdr-on body,
    html.mg-gen-on .body-content {
        background: #fff !important;
    }
    html.mg-gen-on .body-content {
        padding-top: 0 !important;
    }
}
