:root{
	--blue:        #D9E6F7;
	--blue-dark:   #1F4FC0;
	--blue-soft:   #E5EEF9;
	--blue-mid:    #EFF4FC;
	--blue-pale:   #F1F5FB;
	--ink:         #1F2967;
	--ink-dark:    #0F172A;
	--muted:       #455770;
	--muted-2:     #70839E;
	--border:      #E4EAF3;
	--bg:          #EEF3FB;
	--white:       #FFFFFF;
	--red:         #E11D48;
	--radius:      12px;
	--shadow:      0 10px 30px rgba(31,41,55,.08);
}

*{ box-sizing: border-box; }

body{
	font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	background: var(--bg);
	color: var(--ink);
	margin: 0;
	padding: 28px 16px;
}

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

div.lrg{
	max-width: 1040px;
	margin: 0 auto;
	background: var(--white);
	border-radius: 24px;
	box-shadow: var(--shadow);
	padding: 28px 36px 24px;
}

div.lrg2{ width: auto !important; }

.hdr{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 22px;
}

.brand{
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -0.01em;
	background-image: linear-gradient(90deg, var(--ink-dark) 0%, var(--blue-dark) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.brand:hover{ text-decoration: none; }

.brand .ico{
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--blue);
	color: var(--ink);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.brand .ico svg{ width: 22px; height: 22px; }

nav.tabs{
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	background: var(--blue-soft);
	border-radius: 14px;
	padding: 6px;
	margin-bottom: 20px;
}

nav.tabs a, nav.tabs span.cur{
	flex: 1 1 auto;
	min-width: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 12px;
	border-radius: 10px;
	font-weight: 600;
	font-size: 14px;
	color: var(--muted);
	white-space: nowrap;
}
nav.tabs svg{ width: 16px; height: 16px; flex-shrink: 0; }

nav.tabs a:hover{
	color: var(--blue-dark);
	text-decoration: none;
}

nav.tabs span.cur{
	background: var(--white);
	color: var(--blue-dark);
	box-shadow: 0 2px 8px rgba(31,41,55,.08);
}

h1{
	font-family: inherit;
	font-size: 20px;
	font-weight: 700;
	color: var(--ink);
	background: none;
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 8px 0 18px;
}
h1 .arrow{
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--blue-soft);
	color: var(--blue-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
h1 .arrow svg{ width: 16px; height: 16px; }

.subnav{
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 20px;
}

.subnav a{
	flex: 1 1 200px;
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: 14px;
	padding: 16px 18px;
	font-weight: 600;
	color: var(--ink);
}
.subnav a:hover{
	border-color: var(--blue);
	box-shadow: 0 6px 16px rgba(47,111,235,.12);
	text-decoration: none;
}
.subnav svg{ width: 20px; height: 20px; color: var(--blue-dark); flex-shrink: 0; }

.table-wrap{
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	overflow-x: auto;
	overflow-y: hidden;
	margin-bottom: 10px;
}
.table-wrap::-webkit-scrollbar{ height: 16px; }
.table-wrap::-webkit-scrollbar-track{ background: transparent; }
.table-wrap::-webkit-scrollbar-thumb{ background: var(--blue-soft); border-radius: 8px; }
.table-wrap::-webkit-scrollbar-thumb:hover{ background: var(--blue); }
.table-wrap{ scrollbar-width: auto; scrollbar-color: var(--blue-soft) transparent; }

table.inf, table.lrg{
	width: max-content;
	min-width: 100%;
	border-collapse: collapse;
}

/* границы таблиц: чтобы отключить, добавьте класс no-borders в table.inf */
table.inf td, table.inf th{
	border: 2px solid var(--white);
}
table.inf.no-borders td, table.inf.no-borders th{
	border: none;
}
table.inf tr:first-child td, table.inf tr:first-child th{ border-top: none; }
table.inf tr:last-child td, table.inf tr:last-child th{ border-bottom: none; }
table.inf td:first-child, table.inf th:first-child{ border-left: none; border-bottom: none; }
table.inf td:last-child, table.inf th:last-child{ border-right: none; }

td.hd{
	background: var(--blue);
	color: var(--ink);
	font-weight: 700;
	font-family: inherit;
	font-size: 13px;
	padding: 8px 6px;
	white-space: nowrap;
}
td.hd0{
	background: var(--white);
	color: var(--ink);
	font-weight: 700;
	font-family: inherit;
	font-size: 13px;
	padding: 8px 6px;
	white-space: nowrap;
}
td.ur, td.urlt{
	text-align: center;
	background: var(--blue-soft) !important;
	color: var(--ink);
	font-family: inherit;
	font-size: 13px;
	padding: 8px;
}
td.urlt{ cursor: pointer; }
td.vp{
	background: var(--blue-soft);
	color: var(--ink);
	font-family: inherit;
	font-size: 13px;
	padding: 8px;
}
td.nul{
	background: var(--blue-mid);
	color: var(--ink);
	font-family: inherit;
	font-size: 13px;
	padding: 8px;
}
td.no{
	background: var(--blue-pale);
	color: var(--blue-dark);
	font-family: inherit;
	font-size: 13px;
	padding: 8px;
}

/* прогресс-бар "Итоги": цвет задаётся самим images/graf0.gif (растянутый пиксель),
   через CSS его не перекрасить - при смене темы нужно заменить сам файл */
img[src*="graf"]{
	display: inline-block;
	vertical-align: middle;
	border-radius: 3px;
}

td.m0{ font-size: 13px; font-weight: 600; background: var(--blue-soft); padding: 10px; }
td.m0 a{ color: var(--ink); }
td.m0 ul{ margin: 4px 0 0; padding-left: 18px; }
td.m1{ background: var(--white); color: var(--blue-dark); text-align: center; vertical-align: top; font-weight: 700; padding: 10px; }
td.m2{ background: var(--blue-soft); text-align: center; vertical-align: top; font-weight: 700; padding: 10px; }
td.m2 a{ color: var(--muted); }
td.m3{ width: 6px; }
td.m4{ width: 6px; background: var(--blue-soft); }
td.mu, td.mf, td.h1{ display: none; }

div.lrg2 p, div.lrg2 ul{
	text-align: left;
	font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--ink);
}
div.lrg2 ul{ padding-left: 20px; }
div.lrg2 li{ margin-bottom: 10px; }

a.z0, a.z1{ color: var(--ink); font-size: 108%; font-weight: 700; }
a.z2{ color: var(--ink); }
a.z3{ color: var(--muted-2); }
a.hd{ color: var(--ink); }

ul.zg{ text-align: left; font-size: 14px; font-weight: 700; margin-top: 0; }
ul.zg a{ color: var(--red); }
li.zgr{ color: var(--red); }

div.ref{
	width: auto;
	text-align: right;
	font-family: inherit;
	font-size: 13px;
	color: var(--muted-2);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
	margin: 14px 0 4px;
}
div.ref svg{ width: 14px; height: 14px; }

hr{
	border: none;
	border-top: 1px solid var(--border);
	margin: 12px 0 14px;
}

div.copy{
	font-family: inherit;
	font-size: 13px;
	color: var(--muted);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	text-align: left;
}
div.copy .note{
	color: var(--muted-2);
	display: flex;
	align-items: center;
	gap: 6px;
}
a.copy{ color: var(--muted); font-weight: 600; }

/* Гарантированная заглавная первая буква в надписях меню/подменю */
.brand .lbl,
nav.tabs .lbl,
.subnav .lbl{
	display: inline-block; /* обязательно для работы ::first-letter */
}
.brand .lbl::first-letter,
nav.tabs .lbl::first-letter,
.subnav .lbl::first-letter{
	text-transform: uppercase;
}

/* Единый вид нумерации в списках (Список групп / преподавателей */
table.inf td.ur:first-child{
	background: var(--blue) !important;
	color: var(--ink) !important;
	font-weight: 700;
	text-align: center !important;
}