/* ==================================================================
   Elety — кабинет преподавателя, волна 1
   Дизайн-система по ELETY-INNER-WAVE1-CLAUDE-HANDOFF.md и макетам
   Figma (страница «06 — INNER · TEACHER WAVE 1»).

   Живёт рядом со старой темой и включается флагом интерфейса, чтобы
   можно было вернуться к прежнему кабинету одним переключателем.
================================================================== */

.ea {
	/* ---- цвет ---- */
	--ea-canvas:   #f7f5ef;
	--ea-surface:  #ffffff;
	--ea-ink:      #132c2e;   /* основной текст и тёмная колонка */
	--ea-ink-2:    #3c5153;
	--ea-muted:    #6b7d7e;
	--ea-line:     #d8ded9;
	--ea-line-soft:#e8ece7;

	--ea-coral:      #f05a3c;  /* главное действие */
	--ea-coral-dark: #d4482c;
	--ea-coral-soft: #fde8e3;

	--ea-teal:      #147d76;   /* подтверждения, прогресс */
	--ea-teal-soft: #e3f0ee;

	--ea-warn:      #a86a12;
	--ea-warn-soft: #fdefd6;

	/* ---- радиусы, тени, отступы ---- */
	--ea-r-card:  12px;
	--ea-r-input: 10px;
	--ea-r-pill:  999px;

	--ea-s1: 4px;  --ea-s2: 8px;  --ea-s3: 12px;
	--ea-s4: 16px; --ea-s5: 24px; --ea-s6: 32px; --ea-s7: 48px;

	--ea-shadow: 0 12px 32px rgba(19,44,46,.10), 0 2px 6px rgba(19,44,46,.05);

	--ea-side: 232px;
	--ea-max:  1280px;

	background: var(--ea-canvas);
	color: var(--ea-ink);
	font-family: 'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.47;
	-webkit-font-smoothing: antialiased;
	min-height: 100vh;
}

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

.ea :where(h1,h2,h3,h4,p,ul,ol,dl,dd,figure) { margin: 0; }
.ea :where(ul,ol) { padding: 0; list-style: none; }
.ea :where(img) { display: block; max-width: 100%; }
.ea :where(a) { color: inherit; text-decoration: none; }
.ea :where(button, input, select, textarea) { font: inherit; color: inherit; }

/* Цифры в счётчиках и деньгах не должны прыгать по ширине */
.ea :where(.ea-num, .ea-metric-val, .ea-left, .ea-badge) { font-variant-numeric: tabular-nums; }

/* ---- типографическая шкала (из инструкции) --------------------- */

.ea-t-page    { font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -.02em; }
.ea-t-section { font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -.01em; }
.ea-t-card    { font-size: 18px; line-height: 24px; font-weight: 700; }
.ea-t-body    { font-size: 15px; line-height: 22px; font-weight: 400; }
.ea-t-compact { font-size: 14px; line-height: 20px; }
.ea-t-label   { font-size: 13px; line-height: 18px; font-weight: 600; }
.ea-t-counter { font-size: 28px; line-height: 32px; font-weight: 700; }
.ea-t-micro   { font-size: 12px; line-height: 16px; font-weight: 500; }

/* ==================================================================
   Каркас
================================================================== */

.ea-shell { display: grid; grid-template-columns: var(--ea-side) 1fr; min-height: 100vh; }

/* ---- боковая колонка ---- */

.ea-side {
	background: var(--ea-ink);
	color: #fff;
	padding: var(--ea-s5) var(--ea-s4);
	display: flex;
	flex-direction: column;
	position: sticky;
	top: 0;
	height: 100vh;
}

.ea-brand {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 23px;
	font-weight: 700;
	letter-spacing: -.02em;
	padding: 0 var(--ea-s3) var(--ea-s6);
}

.ea-brand svg { width: 17px; height: 17px; color: var(--ea-coral); }

.ea-nav { display: grid; gap: 2px; }

.ea-nav a {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 11px var(--ea-s3);
	border-radius: var(--ea-r-input);
	font-size: 15px;
	color: rgba(255,255,255,.72);
	transition: background .15s ease, color .15s ease;
}

.ea-nav a svg { width: 18px; height: 18px; flex: none; }
.ea-nav a:hover { background: rgba(255,255,255,.07); color: #fff; }
.ea-nav a.is-active { background: var(--ea-teal); color: #fff; font-weight: 500; }
.ea-nav a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.ea-side-me {
	margin-top: auto;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: var(--ea-s3);
	font-size: 14px;
	color: rgba(255,255,255,.75);
}

.ea-side-me img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; background: rgba(255,255,255,.1); }

/* ---- рабочая область ---- */

.ea-main { min-width: 0; padding: var(--ea-s6); }
.ea-wrap { max-width: var(--ea-max); margin: 0 auto; }

.ea-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--ea-s4);
	flex-wrap: wrap;
	margin-bottom: var(--ea-s5);
}

.ea-head h1 { font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -.02em; }
.ea-head-sub { margin-top: 5px; font-size: 14px; color: var(--ea-muted); }
.ea-head-actions { display: flex; align-items: center; gap: var(--ea-s2); flex-wrap: wrap; }

/* ==================================================================
   Компоненты
================================================================== */

/* ---- кнопки ---- */

.ea .ea-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 11px 18px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-surface);
	color: var(--ea-ink);
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
	white-space: nowrap;
}

.ea .ea-btn:hover { border-color: var(--ea-ink-2); }
.ea .ea-btn:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: 2px; }
.ea .ea-btn:active { background: var(--ea-line-soft); }
.ea .ea-btn[disabled] { opacity: .5; cursor: not-allowed; }
.ea .ea-btn svg { width: 16px; height: 16px; flex: none; }

.ea .ea-btn--primary { background: var(--ea-coral); border-color: var(--ea-coral); color: #fff; font-weight: 600; }
.ea .ea-btn--primary:hover { background: #d94a2f; border-color: #d94a2f; }
.ea .ea-btn--primary:active { background: #c84026; }

.ea .ea-btn--ghost { background: transparent; border-color: transparent; }
.ea .ea-btn--ghost:hover { background: rgba(19,44,46,.05); border-color: transparent; }

/* ---- сегмент-контрол ---- */

.ea-seg { display: inline-flex; gap: var(--ea-s2); flex-wrap: wrap; }

.ea-seg a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 10px 20px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-surface);
	font-size: 14px;
	color: var(--ea-ink);
}

.ea-seg a:hover { border-color: var(--ea-ink-2); }
.ea-seg a:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: 2px; }
.ea-seg a.is-active { background: var(--ea-coral); border-color: var(--ea-coral); color: #fff; font-weight: 600; }

/* ---- карточка ---- */

.ea-card {
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	padding: var(--ea-s4) var(--ea-s5);
}

.ea-card--flat { border-color: var(--ea-line-soft); }

/* ---- метрики ---- */

.ea-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--ea-s3); margin-bottom: var(--ea-s3); }

.ea-metric {
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	padding: 14px var(--ea-s4) var(--ea-s4);
}

.ea-metric-cap { font-size: 12px; line-height: 16px; font-weight: 500; color: var(--ea-muted); margin-bottom: 6px; }
.ea-metric-val { font-size: 28px; line-height: 32px; font-weight: 700; letter-spacing: -.02em; }

/* Второстепенные показатели — плашками, а не такими же карточками */
.ea-metrics-2 { display: flex; flex-wrap: wrap; gap: var(--ea-s2); margin-bottom: var(--ea-s5); }

.ea-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 13px;
	border-radius: var(--ea-r-pill);
	background: var(--ea-teal-soft);
	color: var(--ea-teal);
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

.ea-badge--warn { background: var(--ea-warn-soft); color: var(--ea-warn); }
.ea-badge--muted { background: var(--ea-line-soft); color: var(--ea-ink-2); }
.ea-badge--coral { background: var(--ea-coral-soft); color: #b93a1f; }

/* Статус не одним цветом: точка + подпись */
.ea-badge::before {
	content: "";
	width: 7px; height: 7px;
	border-radius: 50%;
	background: currentColor;
	flex: none;
}

.ea-badge--nodot::before { display: none; }

/* ---- полоса-подсказка ---- */

.ea-note {
	padding: 13px var(--ea-s4);
	border-radius: var(--ea-r-card);
	background: var(--ea-teal-soft);
	color: #0f5f5a;
	font-size: 14px;
	margin-bottom: var(--ea-s5);
}

/* плашка со значком: иконка фиксированного размера, иначе SVG растягивается
   на всю ширину флекс-строки */
.ea-note { display: flex; align-items: flex-start; gap: 10px; }
.ea-note > svg { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; }
.ea-note > span { flex: 1 1 auto; }
.ea-note--warn { background: var(--ea-warn-soft); color: #8a5710; }
.ea-note--bad  { background: var(--ea-coral-soft); color: #b93a1f; }

/* ---- аватар ---- */

.ea-ava {
	width: 40px; height: 40px;
	flex: none;
	border-radius: 50%;
	overflow: hidden;
	background: var(--ea-line-soft);
	display: grid;
	place-items: center;
	font-size: 15px;
	font-weight: 600;
	color: var(--ea-ink-2);
}

.ea-ava img { width: 100%; height: 100%; object-fit: cover; }
.ea-ava--lg { width: 52px; height: 52px; font-size: 18px; }

/* ---- строка ученика ---- */

.ea-rows { display: grid; gap: var(--ea-s3); }

.ea-row {
	display: flex;
	align-items: center;
	gap: var(--ea-s4);
	padding: 14px var(--ea-s5);
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	transition: border-color .15s ease, box-shadow .15s ease;
	min-height: 62px;
}

.ea-row:hover { border-color: var(--ea-ink-2); }
.ea-row:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: 2px; }

.ea-row-main { flex: 1; min-width: 0; }
.ea-row-name { display: block; font-size: 16px; font-weight: 600; }
.ea-row-sub { display: block; font-size: 13px; color: var(--ea-muted); margin-top: 2px; }

.ea-left { flex: none; font-size: 14px; color: var(--ea-ink-2); white-space: nowrap; }
.ea-left--low { color: var(--ea-coral); font-weight: 600; }
.ea-left--zero { color: var(--ea-muted); }

/* ---- поля ---- */

.ea-field { display: block; margin-bottom: var(--ea-s4); }
.ea-field:last-child { margin-bottom: 0; }

.ea-field > label,
.ea-label { display: block; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--ea-ink-2); margin-bottom: 6px; }
.ea-req { color: var(--ea-coral); }

.ea-input, .ea-textarea, .ea-select {
	width: 100%;
	min-height: 44px;
	padding: 11px 13px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-surface);
	font-size: 15px;
	line-height: 22px;
	color: var(--ea-ink);
}

.ea-textarea { resize: vertical; min-height: 76px; }

.ea-input:focus, .ea-textarea:focus, .ea-select:focus {
	outline: none;
	border-color: var(--ea-teal);
	box-shadow: 0 0 0 3px rgba(20,125,118,.14);
}

.ea-input[aria-invalid="true"], .ea-textarea[aria-invalid="true"] { border-color: var(--ea-coral); }
.ea-err { margin-top: 5px; font-size: 12px; color: var(--ea-coral); }

.ea-check { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; font-size: 14px; min-height: 44px; }
.ea-check input { width: 18px; height: 18px; accent-color: var(--ea-teal); flex: none; }

/* ---- пустое состояние ---- */

.ea-empty {
	text-align: center;
	padding: var(--ea-s7) var(--ea-s5);
	background: var(--ea-surface);
	border: 1px dashed var(--ea-line);
	border-radius: var(--ea-r-card);
}

.ea-empty h3 { font-size: 18px; font-weight: 700; margin-bottom: 6px; }
.ea-empty p { font-size: 14px; color: var(--ea-muted); max-width: 34em; margin: 0 auto var(--ea-s4); }

/* ==================================================================
   Мобильные шапка и нижнее меню
================================================================== */

.ea-mhead, .ea-mnav { display: none; }

@media (max-width: 1100px) {
	.ea { --ea-side: 80px; }
	.ea-brand { justify-content: center; padding-left: 0; padding-right: 0; font-size: 0; }
	.ea-brand svg { width: 22px; height: 22px; }
	.ea-nav a { justify-content: center; padding: 12px 0; }
	.ea-nav a span { display: none; }
	.ea-side-me { justify-content: center; }
	.ea-side-me div { display: none; }
	.ea-main { padding: var(--ea-s5); }
}

@media (max-width: 767px) {
	.ea-shell { grid-template-columns: 1fr; }
	.ea-side { display: none; }

	.ea-mhead {
		display: flex;
		align-items: center;
		gap: var(--ea-s3);
		height: 56px;
		padding: 0 var(--ea-s4);
		background: var(--ea-ink);
		color: #fff;
		position: sticky;
		top: 0;
		z-index: 30;
	}

	.ea-mhead .ea-brand { padding: 0; font-size: 20px; }
	.ea-mhead .ea-brand svg { width: 15px; height: 15px; }
	.ea-mhead-me { margin-left: auto; }
	.ea-mhead-me img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }

	.ea-main { padding: var(--ea-s4) var(--ea-s4) calc(64px + env(safe-area-inset-bottom, 0px) + var(--ea-s5)); }
	.ea-head h1 { font-size: 26px; line-height: 32px; }

	.ea-mnav {
		display: flex;
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 40;
		height: calc(64px + env(safe-area-inset-bottom, 0px));
		padding-bottom: env(safe-area-inset-bottom, 0px);
		background: var(--ea-surface);
		border-top: 1px solid var(--ea-line);
	}

	.ea-mnav a {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		font-size: 11px;
		color: var(--ea-muted);
		min-height: 44px;
	}

	.ea-mnav a svg { width: 21px; height: 21px; }
	.ea-mnav a.is-active { color: var(--ea-coral); }
	.ea-mnav a:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: -2px; }

	.ea-metrics { grid-template-columns: repeat(2, 1fr); }
	.ea-row { padding: 12px var(--ea-s4); gap: var(--ea-s3); }
	.ea-head-actions { width: 100%; }
	.ea-head-actions .ea-btn { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.ea *, .ea *::before, .ea *::after {
		transition-duration: .001ms !important;
		animation-duration: .001ms !important;
	}
}

/* ==================================================================
   Репорт пары
================================================================== */

.ea-pair-head {
	display: flex;
	align-items: center;
	gap: var(--ea-s3);
	margin-bottom: var(--ea-s5);
	flex-wrap: wrap;
}

.ea .ea-back {
	width: 40px; height: 40px;
	flex: none;
	display: grid;
	place-items: center;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-surface);
	color: var(--ea-ink);
}

.ea .ea-back:hover { border-color: var(--ea-ink-2); }
.ea-back svg { width: 18px; height: 18px; }

.ea-pair-who { flex: 1; min-width: 200px; }
.ea-pair-who h1 { font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -.02em; }
.ea-pair-head .ea-head-actions { margin-left: auto; }

.ea-program { max-width: 420px; margin-bottom: var(--ea-s4); }

.ea-month {
	font-size: 18px;
	line-height: 24px;
	font-weight: 700;
	margin: var(--ea-s6) 0 var(--ea-s3);
}

/* ---- урок ---- */

.ea-lesson {
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	padding: var(--ea-s4) var(--ea-s5) var(--ea-s5);
	margin-bottom: var(--ea-s3);
}

/* Урок, который ждёт заполнения, заметен слева коралловой чертой */
.ea-lesson.is-open { border-left: 3px solid var(--ea-coral); }
.ea-lesson.is-check { border-left: 3px solid var(--ea-teal); }

.ea-lesson-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ea-s3);
	flex-wrap: wrap;
	margin-bottom: var(--ea-s4);
}

.ea-lesson-when { font-size: 15px; font-weight: 600; }

.ea-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ea-s4); }

.ea-lesson-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ea-s3);
	flex-wrap: wrap;
	margin-top: var(--ea-s4);
}

/* ---- контрольная точка ---- */

.ea-check-card {
	margin-top: var(--ea-s4);
	padding: var(--ea-s4) var(--ea-s5) var(--ea-s5);
	border-radius: var(--ea-r-card);
	background: var(--ea-teal-soft);
}

.ea-check-title { font-size: 16px; font-weight: 700; margin-bottom: var(--ea-s3); }

.ea-check-status { display: flex; gap: var(--ea-s2); flex-wrap: wrap; margin-bottom: var(--ea-s4); }

.ea-check-opt {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 10px 20px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-surface);
	font-size: 14px;
	cursor: pointer;
}

.ea-check-opt input { position: absolute; opacity: 0; width: 0; height: 0; }
.ea-check-opt.is-on { background: var(--ea-coral); border-color: var(--ea-coral); color: #fff; font-weight: 600; }
.ea-check-opt:has(input:focus-visible) { outline: 2px solid var(--ea-ink); outline-offset: 2px; }
.ea-check-card .ea-textarea, .ea-check-card .ea-input, .ea-check-card .ea-select { background: var(--ea-surface); }

.ea-field--short { max-width: 240px; }

@media (max-width: 767px) {
	.ea-grid-2 { grid-template-columns: 1fr; gap: var(--ea-s3); }
	.ea-pair-who h1 { font-size: 23px; line-height: 28px; }
	.ea-lesson { padding: var(--ea-s4); }
	.ea-check-card { padding: var(--ea-s4); }
	.ea-lesson-foot { flex-direction: column-reverse; align-items: stretch; }
	.ea-lesson-foot .ea-btn { width: 100%; }
	.ea-field--short { max-width: none; }
	.ea-pair-head .ea-head-actions { width: auto; margin-left: auto; }
}

/* Будущий или отменённый урок — компактной строкой: формы у него нет,
   и высокая пустая карточка только растягивает ленту. */
.ea-lesson:not(:has(.ea-lesson-form)) { padding: 14px var(--ea-s5); }
.ea-lesson:not(:has(.ea-lesson-form)) .ea-lesson-head { margin-bottom: 0; }

/* ==================================================================
   Расписание
================================================================== */

.ea-cal-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ea-s4);
	flex-wrap: wrap;
	margin-bottom: var(--ea-s4);
}

.ea-cal-period { display: flex; align-items: center; gap: var(--ea-s2); flex-wrap: wrap; }
.ea-cal-title { font-size: 21px; font-weight: 700; margin-left: var(--ea-s2); letter-spacing: -.01em; }
.ea .ea-btn--icon { padding: 0; width: 44px; }

.ea-cal {
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	overflow: hidden;
}

/* ---- легенда ---- */

.ea-legend { display: flex; gap: var(--ea-s4); flex-wrap: wrap; margin-top: var(--ea-s3); font-size: 12px; color: var(--ea-muted); }
.ea-lg { display: inline-flex; align-items: center; gap: 7px; }

.ea-lg::before {
	content: "";
	width: 10px; height: 10px;
	border-radius: 3px;
	background: var(--ea-teal);
}

.ea-lg--offline::before { background: #559db2; }
.ea-lg--wait::before { background: var(--ea-warn); }
.ea-lg--done::before { background: #4c966a; }
.ea-lg--hint::before { display: none; }

/* ---- месяц ---- */

.ea-month { display: block; }
.ea-dow, .ea-week { display: grid; grid-template-columns: repeat(7, 1fr); }

.ea-dow div {
	padding: 11px;
	text-align: center;
	font-size: 12px;
	font-weight: 700;
	color: var(--ea-muted);
	border-bottom: 1px solid var(--ea-line);
}

.ea-day {
	min-height: 118px;
	padding: 8px;
	border-right: 1px solid var(--ea-line-soft);
	border-bottom: 1px solid var(--ea-line-soft);
	min-width: 0;
}

.ea-day.is-out { background: #fbfaf6; color: #a8b2af; }
.ea-day-top { display: flex; align-items: center; justify-content: space-between; }

.ea .ea-day-num {
	display: grid;
	place-items: center;
	width: 28px; height: 28px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
}

.ea-day.is-today .ea-day-num { background: var(--ea-coral); color: #fff; }

.ea .ea-day-add {
	width: 26px; height: 26px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: var(--ea-muted);
	cursor: pointer;
	opacity: 0;
}

.ea-day:hover .ea-day-add, .ea-day-add:focus-visible { opacity: 1; }
.ea-day-add svg { width: 14px; height: 14px; }
.ea-day-add:hover { background: var(--ea-line-soft); color: var(--ea-ink); }

.ea-day-events { display: grid; gap: 4px; margin-top: 6px; }

.ea .ea-chip {
	display: flex;
	align-items: baseline;
	gap: 6px;
	padding: 5px 8px;
	border-left: 3px solid var(--ea-teal);
	border-radius: 6px;
	background: var(--ea-teal-soft);
	font-size: 12px;
	min-width: 0;
}

.ea-chip b { font-weight: 700; flex: none; }
.ea-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ea-chip.is-offline { border-color: #559db2; background: #e9f5f8; }
.ea-chip.is-wait { border-style: dashed; border-color: var(--ea-warn); background: var(--ea-warn-soft); }
.ea-chip.is-done { border-color: #4c966a; background: #eaf4ed; opacity: .75; }
.ea .ea-more { display: block; font-size: 12px; color: var(--ea-muted); padding: 2px 8px; }

/* ---- неделя и день ---- */

.ea-grid-wrap { overflow: auto; }

.ea-grid {
	display: grid;
	grid-template-columns: 64px repeat(var(--cols), minmax(118px, 1fr));
	min-width: 100%;
}

.ea-grid--day { grid-template-columns: 64px 1fr; }

.ea-corner { border-bottom: 1px solid var(--ea-line); }

.ea-colhead {
	padding: 10px 8px;
	text-align: center;
	border-bottom: 1px solid var(--ea-line);
	border-left: 1px solid var(--ea-line-soft);
}

.ea-colhead-dow { display: block; font-size: 11px; color: var(--ea-muted); text-transform: uppercase; letter-spacing: .04em; }
.ea-colhead-num { display: block; font-size: 17px; font-weight: 700; margin-top: 2px; }
.ea-colhead.is-today .ea-colhead-num { color: var(--ea-coral); }
.ea-colhead-count { display: inline-block; margin-top: 3px; font-size: 11px; color: var(--ea-muted); }

.ea-times { border-right: 1px solid var(--ea-line-soft); }
.ea-time { height: 64px; position: relative; }
.ea-time span { position: absolute; top: -8px; right: 8px; font-size: 11px; color: var(--ea-muted); }
.ea-time:first-child span { top: 4px; }

.ea-track { position: relative; border-left: 1px solid var(--ea-line-soft); }
.ea-track.is-today { background: rgba(240,90,60,.03); }

.ea .ea-cell {
	display: block;
	width: 100%;
	height: 64px;
	border: 0;
	border-top: 1px solid var(--ea-line-soft);
	background: transparent;
	cursor: pointer;
	padding: 0;
}

.ea-cell:hover { background: var(--ea-teal-soft); }
.ea-cell:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: -2px; }
.ea-cell.is-closed { background: #f2f2ed; cursor: default; }
.ea-cell.is-closed:hover { background: #f2f2ed; }

.ea-now { position: absolute; left: 0; right: 0; height: 0; border-top: 2px solid var(--ea-coral); z-index: 3; }

.ea-now span {
	position: absolute;
	left: 3px; top: -9px;
	background: var(--ea-coral);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	padding: 1px 5px;
	border-radius: 4px;
}

.ea .ea-ev {
	position: absolute;
	left: 5px; right: 5px;
	min-height: 44px;
	padding: 6px 8px;
	border-left: 3px solid var(--ea-teal);
	border-radius: 7px;
	background: var(--ea-teal-soft);
	font-size: 12px;
	overflow: hidden;
	z-index: 2;
}

.ea-ev:hover { filter: brightness(.97); }
.ea-ev:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: 1px; }
.ea-ev-time { display: block; font-weight: 700; }
.ea-ev-name { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ea-ev-kind { display: block; color: var(--ea-muted); font-size: 11px; margin-top: 1px; }

.ea-ev.is-offline { border-color: #559db2; background: #e9f5f8; }
.ea-ev.is-wait { border-style: dashed; border-color: var(--ea-warn); background: var(--ea-warn-soft); }
.ea-ev.is-done { border-color: #4c966a; background: #eaf4ed; }
.ea-ev.is-live { border-color: var(--ea-coral); background: var(--ea-coral-soft); }

/* ---- день: список справа ---- */

.ea-day-view { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 0; }
.ea-agenda { border-left: 1px solid var(--ea-line); padding: var(--ea-s4) var(--ea-s5); }

.ea-agenda-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--ea-s3); margin-bottom: var(--ea-s3); }
.ea-agenda-head h2 { font-size: 17px; font-weight: 700; }
.ea .ea-agenda-link { font-size: 13px; color: var(--ea-teal); }
.ea-agenda-empty { font-size: 14px; color: var(--ea-muted); }

.ea .ea-agenda-card {
	display: flex;
	gap: var(--ea-s3);
	padding: var(--ea-s3) 0;
	border-top: 1px solid var(--ea-line-soft);
}

.ea-agenda-time { flex: none; font-size: 14px; font-weight: 700; }
.ea-agenda-time span { display: block; font-size: 12px; font-weight: 400; color: var(--ea-muted); }
.ea-agenda-name { font-size: 15px; font-weight: 600; }
.ea-agenda-meta { font-size: 12px; color: var(--ea-muted); margin: 2px 0 6px; }

/* ---- лента дат (только телефон) ---- */

.ea-cal-strip { display: none; }

/* ---- модалка ---- */

.ea-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: var(--ea-s4); }
.ea-modal[hidden] { display: none; }
.ea-modal-back { position: absolute; inset: 0; background: rgba(11,31,31,.45); }

.ea-modal-box {
	position: relative;
	width: min(540px, 100%);
	max-height: 90vh;
	overflow: auto;
	background: var(--ea-surface);
	border-radius: 18px;
	padding: var(--ea-s5) var(--ea-s5) var(--ea-s4);
	box-shadow: 0 18px 60px rgba(19,44,46,.24);
}

.ea-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--ea-s3); }
.ea-modal-head h2 { font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.ea-modal-sub { font-size: 14px; color: var(--ea-muted); margin: 4px 0 var(--ea-s4); }
.ea-modal-empty { font-size: 14px; color: var(--ea-muted); margin-top: var(--ea-s3); }

.ea .ea-modal-x {
	flex: none;
	width: 36px; height: 36px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: var(--ea-muted);
	font-size: 17px;
	cursor: pointer;
}

.ea-modal-x:hover { background: var(--ea-line-soft); color: var(--ea-ink); }
.ea-hint { font-size: 12px; color: var(--ea-muted); margin-top: 5px; }

.ea-modal-actions {
	display: flex;
	justify-content: flex-end;
	gap: var(--ea-s2);
	margin-top: var(--ea-s5);
	padding-top: var(--ea-s4);
	border-top: 1px solid var(--ea-line-soft);
}

/* ---- адаптив расписания ---- */

@media (max-width: 1100px) {
	.ea-day-view { grid-template-columns: 1fr; }
	.ea-agenda { border-left: 0; border-top: 1px solid var(--ea-line); }
}

@media (max-width: 767px) {
	.ea-hide-sm { display: none; }
	.ea-cal-bar { display: block; }
	.ea-cal-period { justify-content: space-between; }
	.ea-cal-title { font-size: 17px; margin: 0; order: -1; width: 100%; }
	.ea-seg { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: var(--ea-s3); }
	.ea-seg a { justify-content: center; padding: 10px 8px; }

	/* Неделя не сжимается в семь колонок: сверху лента дат, ниже — один день */
	.ea-cal-strip { display: flex; gap: 6px; overflow-x: auto; padding: 0 0 var(--ea-s3); }

	.ea .ea-strip-day {
		flex: none;
		min-width: 62px;
		padding: 8px 10px;
		border: 1px solid var(--ea-line);
		border-radius: var(--ea-r-input);
		background: var(--ea-surface);
		text-align: center;
		font-size: 12px;
		color: var(--ea-muted);
		position: relative;
	}

	.ea-strip-day b { display: block; font-size: 17px; color: var(--ea-ink); }
	.ea-strip-day.is-today { border-color: var(--ea-coral); }
	.ea-strip-day.is-today b { color: var(--ea-coral); }
	.ea-strip-day i { position: absolute; right: 8px; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--ea-teal); }

	.ea-grid { grid-template-columns: 54px repeat(var(--cols), minmax(140px, 1fr)); }
	.ea-month { overflow-x: auto; }
	.ea-dow, .ea-week { grid-template-columns: repeat(7, minmax(104px, 1fr)); min-width: 728px; }
	.ea-day { min-height: 96px; }
	.ea-day-add { opacity: 1; }

	/* Модалка снизу листом */
	.ea-modal { place-items: end center; padding: 0; }

	.ea-modal-box {
		width: 100%;
		border-radius: 20px 20px 0 0;
		padding: var(--ea-s5) var(--ea-s4) max(var(--ea-s4), env(safe-area-inset-bottom, 0px));
		max-height: 92vh;
	}

	.ea-modal-actions { position: sticky; bottom: 0; background: var(--ea-surface); }
	.ea-modal-actions .ea-btn { flex: 1; }
}

/* ==================================================================
   Профиль
================================================================== */

.ea-tabs { margin-bottom: var(--ea-s4); }
.ea-card-title { font-size: 18px; line-height: 24px; font-weight: 700; margin-bottom: var(--ea-s4); }

.ea-profile-top { display: flex; align-items: center; gap: var(--ea-s4); margin-bottom: var(--ea-s4); }
.ea-profile-who { flex: 1; min-width: 0; }
.ea-photo-form { flex: none; }

.ea-tab { display: block; }
.ea-tab[hidden] { display: none; }
.ea-tab > .ea-card { margin-bottom: var(--ea-s4); }
.ea-tab .ea-grid-2 > .ea-card { margin-bottom: 0; }

/* ---- категории занятий ---- */

.ea-cats { display: grid; gap: var(--ea-s2); margin-bottom: var(--ea-s4); }

.ea-cat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ea-s3);
	padding: 6px 0;
	border-bottom: 1px solid var(--ea-line-soft);
}

.ea-cat:last-child { border-bottom: 0; }
.ea-cat .ea-check { flex: 1; min-width: 0; }
.ea-cat-price { display: flex; align-items: center; gap: 7px; flex: none; }
.ea-cat-price .ea-input { width: 110px; text-align: right; }
.ea-cat-price span { color: var(--ea-muted); font-size: 14px; }

/* ---- рабочие часы ---- */

.ea-hours-card { margin-top: var(--ea-s4); }
.ea-hours { overflow-x: auto; padding-bottom: var(--ea-s2); margin-bottom: var(--ea-s4); }
.ea-hours-row { display: grid; grid-template-columns: 42px repeat(24, minmax(24px, 1fr)); gap: 3px; align-items: center; margin-bottom: 3px; }
.ea-hours-head span { font-size: 10px; color: var(--ea-muted); text-align: center; }
.ea-hours-day { font-size: 13px; font-weight: 600; }

.ea-hour {
	position: relative;
	height: 28px;
	border-radius: 5px;
	background: var(--ea-line-soft);
	cursor: pointer;
	display: block;
}

.ea-hour input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.ea-hour.is-on { background: var(--ea-teal); }
.ea-hour:has(input:checked) { background: var(--ea-teal); }
.ea-hour:has(input:focus-visible) { outline: 2px solid var(--ea-coral); outline-offset: 1px; }

.ea-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- списки истории и уровней ---- */

.ea-hist { display: grid; gap: 2px; }
.ea-hist-row { display: flex; align-items: center; gap: var(--ea-s3); padding: 10px 0; border-bottom: 1px solid var(--ea-line-soft); }
.ea-hist-row:last-child { border-bottom: 0; }

/* ---- настройки ---- */

.ea-toggle-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ea-s4);
	padding: var(--ea-s3) 0;
	border-bottom: 1px solid var(--ea-line-soft);
	flex-wrap: wrap;
}

.ea-toggle-row:last-child { border-bottom: 0; }
.ea-inline-form { display: flex; gap: var(--ea-s2); flex: none; }
.ea-inline-form .ea-input { width: 220px; }

.ea .ea-switch {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 8px 14px 8px 8px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-pill);
	background: var(--ea-surface);
	font-size: 13px;
	font-weight: 600;
	color: var(--ea-muted);
	cursor: pointer;
}

.ea-switch::before {
	content: "";
	width: 34px; height: 20px;
	border-radius: 999px;
	background: var(--ea-line);
	position: relative;
	transition: background .15s ease;
	flex: none;
	box-shadow: inset 16px 0 0 -14px #fff;
}

.ea-switch::after {
	content: "";
	position: absolute;
	left: 11px;
	width: 16px; height: 16px;
	border-radius: 50%;
	background: #fff;
	transition: transform .15s ease;
	box-shadow: 0 1px 3px rgba(19,44,46,.3);
}

.ea-switch { position: relative; }
.ea-switch.is-on { color: var(--ea-teal); border-color: var(--ea-teal); }
.ea-switch.is-on::before { background: var(--ea-teal); }
.ea-switch.is-on::after { transform: translateX(14px); }
.ea-switch:focus-visible { outline: 2px solid var(--ea-coral); outline-offset: 2px; }

@media (max-width: 767px) {
	.ea-profile-top { flex-wrap: wrap; }
	.ea-photo-form { width: 100%; }
	.ea-photo-form .ea-btn { width: 100%; }
	.ea-tabs { display: flex; overflow-x: auto; gap: 6px; }
	.ea-tabs a { flex: none; }
	.ea-inline-form { width: 100%; }
	.ea-inline-form .ea-input { width: auto; flex: 1; }
	.ea-toggle-row { align-items: flex-start; }
	.ea-cat { flex-wrap: wrap; }
	.ea-cat-price .ea-input { width: 96px; }
}

/* ---- сообщения ---- */

.ea-row.is-unread { border-color: var(--ea-teal); }
.ea-row-preview { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 60ch; }
.ea-msg-side { flex: none; display: flex; align-items: center; gap: var(--ea-s2); }
.ea-msg-time { font-size: 12px; color: var(--ea-muted); }

.ea-msg-dot {
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--ea-teal);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: grid;
	place-items: center;
}

/* ---- карточки ---- */

.ea-pick {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 2px;
	max-height: 240px;
	overflow-y: auto;
	padding: 6px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-canvas);
}

.ea-pick-item { padding: 6px 10px; border-radius: 8px; background: var(--ea-surface); min-height: 40px; }
.ea-pick-item:hover { background: var(--ea-teal-soft); }
.ea-hint-inline { font-weight: 400; color: var(--ea-muted); }
.ea-steps { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.7; color: var(--ea-ink-2); list-style: decimal; }

/* --- находки обхода 14.08 -------------------------------------- */

/* Предпросмотр сообщения не должен растягивать строку: 60ch на узком
   экране давали 594 px и страницу уносило вбок. */
.ea-row-preview { max-width: 100%; }
.ea-row { min-width: 0; }

@media (max-width: 767px) {
	/* В ячейке месяца кнопка «+» физически не может быть 44 px:
	   убираем её, добавление остаётся в шапке и по нажатию на день.
	   Специфичность .ea .ea-day-add — иначе базовое правило сильнее. */
	.ea .ea-day-add { display: none; }

	/* Сам день делаем целиком нажимаемым */
	.ea .ea-day-num { width: 100%; height: 34px; justify-content: flex-start; padding-left: 4px; }
}

/* ==================================================================
   Карточка урока
================================================================== */

.ea-lesson-state { margin-bottom: var(--ea-s4); }
.ea-lesson-state .ea-hint { margin-top: 8px; }

.ea-facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ea-s3); margin-top: var(--ea-s4); }
.ea-facts dt { font-size: 12px; color: var(--ea-muted); margin-bottom: 2px; }
.ea-facts dd { margin: 0; font-size: 15px; font-weight: 500; }

.ea-actions { display: flex; gap: var(--ea-s2); flex-wrap: wrap; }
.ea-actions .ea-hint { width: 100%; }

.ea .ea-btn--danger { border-color: #e3b7ae; color: #b93a1f; }
.ea .ea-btn--danger:hover { background: var(--ea-coral-soft); border-color: var(--ea-coral); }

.ea-report-text { font-size: 15px; line-height: 1.65; color: var(--ea-ink-2); }

/* ==================================================================
   Переписка
================================================================== */

.ea-chat {
	display: flex;
	flex-direction: column;
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	overflow: hidden;
	height: calc(100vh - 220px);
	min-height: 420px;
}

.ea-chat-feed { flex: 1; overflow-y: auto; padding: var(--ea-s5); display: flex; flex-direction: column; gap: var(--ea-s3); }
.ea-chat-empty { margin: auto; text-align: center; max-width: 34em; color: var(--ea-muted); }
.ea-chat-empty p { margin-bottom: 6px; }

.ea-msg { max-width: 72%; align-self: flex-start; }
.ea-msg.is-mine { align-self: flex-end; }

.ea-msg-body {
	padding: 10px 14px;
	border-radius: 14px 14px 14px 4px;
	background: var(--ea-canvas);
	font-size: 15px;
	line-height: 1.5;
	word-break: break-word;
}

.ea-msg.is-mine .ea-msg-body { background: var(--ea-teal-soft); border-radius: 14px 14px 4px 14px; }
.ea-msg time { display: block; font-size: 11px; color: var(--ea-muted); margin-top: 4px; }
.ea-msg.is-mine time { text-align: right; }
.ea-msg-body img { border-radius: 8px; margin-top: 4px; }

/* Системное уведомление платформы — не диалог, отвечать на него некому */
.ea-msg-system {
	align-self: center;
	max-width: 82%;
	text-align: center;
	padding: 9px 16px;
	border: 1px dashed var(--ea-line);
	border-radius: var(--ea-r-input);
	background: transparent;
	color: var(--ea-muted);
	font-size: 13px;
	line-height: 1.5;
}

.ea-msg-system time { display: block; font-size: 11px; margin-top: 3px; opacity: .8; }

.ea-chat-send {
	display: flex;
	align-items: flex-end;
	gap: var(--ea-s2);
	padding: var(--ea-s3) var(--ea-s4);
	border-top: 1px solid var(--ea-line);
	background: var(--ea-surface);
}

.ea-chat-input {
	flex: 1;
	min-height: 44px;
	max-height: 160px;
	padding: 11px 13px;
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-input);
	background: var(--ea-canvas);
	font-size: 15px;
	line-height: 22px;
	resize: none;
}

.ea-chat-input:focus { outline: none; border-color: var(--ea-teal); box-shadow: 0 0 0 3px rgba(20,125,118,.14); }

.ea .ea-chat-clip, .ea .ea-chat-btn {
	flex: none;
	width: 44px; height: 44px;
	display: grid;
	place-items: center;
	padding: 0;
	border-radius: var(--ea-r-input);
	cursor: pointer;
}

.ea .ea-chat-clip { border: 1px solid var(--ea-line); background: var(--ea-surface); color: var(--ea-muted); }
.ea .ea-chat-clip:hover { border-color: var(--ea-ink-2); color: var(--ea-ink); }
.ea-chat-clip svg, .ea-chat-btn svg { width: 19px; height: 19px; }

/* ==================================================================
   Системные страницы: вход, QR, ошибки
================================================================== */

.ea-plain { display: flex; flex-direction: column; min-height: 100vh; }

.ea-plain-head { padding: var(--ea-s5) var(--ea-s6); }

.ea .ea-plain-brand {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 25px;
	font-weight: 700;
	letter-spacing: -.02em;
	color: var(--ea-ink);
}

.ea-plain-brand svg { width: 17px; height: 17px; color: var(--ea-coral); }

.ea-plain-main { flex: 1; display: grid; place-items: center; padding: var(--ea-s5) var(--ea-s4) var(--ea-s7); }

.ea-state {
	width: min(520px, 100%);
	background: var(--ea-surface);
	border: 1px solid var(--ea-line);
	border-radius: var(--ea-r-card);
	padding: var(--ea-s6);
	text-align: center;
}

.ea-state h1 { font-size: 25px; line-height: 32px; font-weight: 700; letter-spacing: -.02em; margin-bottom: 8px; }
.ea-state-text { font-size: 15px; color: var(--ea-ink-2); line-height: 1.6; }
.ea-state .ea-hint { margin-top: var(--ea-s3); }

.ea-state-icon {
	width: 64px; height: 64px;
	margin: 0 auto var(--ea-s4);
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--ea-teal-soft);
	color: var(--ea-teal);
}

.ea-state-icon svg { width: 30px; height: 30px; }
.ea-state--bad .ea-state-icon { background: var(--ea-coral-soft); color: #b93a1f; }
.ea-state--warn .ea-state-icon { background: var(--ea-warn-soft); color: var(--ea-warn); }

.ea-state-marks { display: flex; gap: var(--ea-s2); justify-content: center; flex-wrap: wrap; margin: var(--ea-s4) 0 0; }
.ea-state-actions { display: flex; gap: var(--ea-s2); justify-content: center; flex-wrap: wrap; margin-top: var(--ea-s5); }

@media (max-width: 767px) {
	.ea-chat { height: calc(100vh - 190px); border-radius: 0; border-left: 0; border-right: 0; margin: 0 calc(-1 * var(--ea-s4)); }
	.ea-chat-feed { padding: var(--ea-s4); }
	.ea-msg { max-width: 86%; }
	.ea-facts { grid-template-columns: 1fr; }
	.ea-actions .ea-btn { flex: 1; }
	.ea-plain-head { padding: var(--ea-s4); }
	.ea-state { padding: var(--ea-s5) var(--ea-s4); }
}

/* ==================================================================
   Кабинет ученика: ближайшие уроки, пакеты, домашняя работа
   Токены общие с кабинетом преподавателя — это один продукт, и человек
   может быть в обеих ролях.
================================================================== */

/* карточка ближайшего урока */
.ea-lesson-who { display: flex; align-items: center; gap: 8px; margin: 8px 0; font-size: 14px; }
.ea-lesson.is-pending { border-left: 3px solid var(--a-amber, #b06a12); }

/* пакет уроков */
.ea-pack { padding: 12px 0; border-bottom: 1px solid var(--a-line, #e6e3da); }
.ea-pack:last-child { border-bottom: 0; }
.ea-pack-head { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.ea-pack-head a { color: inherit; text-decoration: none; }
.ea-pack-head a:hover { color: var(--a-coral, #f05a3c); }
.ea-pack-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 6px; }
.ea-pack-name { color: var(--a-ink-2, #40575a); }
.ea-pack-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }

/* компактный месяц: ученику нужен обзор, а не рабочая сетка */
.ea-cal--compact .ea-day { min-height: 78px; }
.ea-cal--compact .ea-chip span { display: none; }
.ea-cal--compact .ea-chip { padding: 2px 6px; }

/* домашняя работа */
.ea-hw {
	background: var(--a-surface, #fff);
	border: 1px solid var(--a-line, #e6e3da);
	border-radius: 14px;
	padding: 16px;
	margin-bottom: 12px;
}
.ea-hw.is-current { border-left: 3px solid var(--a-coral, #f05a3c); }
.ea-hw-head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.ea-hw-when b { display: block; }
.ea-hw-when span { font-size: 12px; color: var(--a-muted, #6d7f80); }
.ea-hw-marks { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ea-hw-score { font-size: 13px; color: var(--a-muted, #6d7f80); }
.ea-hw-who { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 13px; color: var(--a-ink-2, #40575a); }
.ea-hw-text { margin-top: 10px; max-width: 72ch; }
.ea-hw-more { margin-top: 10px; }
.ea-hw-more summary { cursor: pointer; font-size: 13px; color: var(--a-muted, #6d7f80); }
.ea-hw-more p { margin-top: 8px; max-width: 72ch; }
.ea-hw-foot { margin-top: 12px; }
.ea-hw-archive > summary { cursor: pointer; margin: 18px 0 12px; font-weight: 600; }

@media (max-width: 767px) {
	.ea-pack-row { flex-direction: column; align-items: flex-start; gap: 2px; }
	.ea-hw-head { flex-direction: column; align-items: flex-start; }
}
/* динамика словаря: простая колонка-диаграмма без библиотек */
.ea-bars { display: flex; align-items: flex-end; gap: 10px; height: 150px; margin-top: 6px; }
.ea-bar { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; }
.ea-bar-fill { width: 100%; max-width: 46px; min-height: 3px; border-radius: 6px 6px 0 0; background: var(--ea-teal, #147d76); }
.ea-bar-num { font-size: 12px; font-weight: 600; margin-top: 4px; }
.ea-bar-cap { font-size: 11px; color: var(--a-muted, #6d7f80); }
/* витрина преподавателей */
.ea-filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.ea-filters .ea-field { flex: 1 1 180px; }
.ea-filters .ea-input { width: 100%; }

.ea-teachers { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-top: 12px; }
.ea-teacher {
	background: var(--a-surface, #fff);
	border: 1px solid var(--a-line, #e6e3da);
	border-radius: 14px;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ea-teacher-top { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.ea-teacher-name { font-weight: 600; font-size: 16px; overflow-wrap: anywhere; }
.ea-teacher-top:hover .ea-teacher-name { color: var(--a-coral, #f05a3c); }
.ea-teacher-about {
	color: var(--a-ink-2, #40575a);
	font-size: 14px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.ea-teacher-cats { display: grid; gap: 6px; }
.ea-teacher-cats li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; font-size: 13px; }
.ea-teacher-cats span { flex: 1 1 auto; color: var(--a-ink-2, #40575a); }
.ea-teacher-cats em { font-style: normal; color: var(--a-muted, #6d7f80); font-size: 12px; }
.ea-teacher-foot { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
/* страница преподавателя: решение о записи принимают здесь */
.ea-t-page { display: grid; gap: 12px; max-width: 880px; }
.ea-t-top { display: flex; align-items: center; gap: 16px; }
.ea-t-top h1 { font-size: 22px; margin: 0; overflow-wrap: anywhere; }
.ea-t-about { margin-top: 12px; max-width: 70ch; color: var(--a-ink-2, #40575a); }
.ea-t-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }

.ea-teacher-cats--lg li { font-size: 14px; padding: 8px 0; border-bottom: 1px solid var(--a-line-soft, #f0eee7); }
.ea-teacher-cats--lg li:last-child { border-bottom: 0; }

/* месяц-выбор дня: только числа и точка «есть занятия» */
.ea-month--pick .ea-day { min-height: 46px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-decoration: none; color: inherit; }
.ea-month--pick .ea-day:hover { background: var(--ea-teal-soft, #e3f0ee); }
.ea-month--pick .ea-day.is-out { opacity: .35; pointer-events: none; }
.ea-day-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ea-teal, #147d76); }

/* свободные часы */
.ea-slots { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.ea-slot {
	min-width: 84px;
	min-height: 44px;
	padding: 10px 14px;
	border: 1px solid var(--a-line, #e6e3da);
	border-radius: 10px;
	background: var(--a-surface, #fff);
	font: inherit;
	font-weight: 600;
	color: var(--a-ink, #132c2e);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.ea-slot:hover { border-color: var(--ea-coral, #f05a3c); color: var(--ea-coral, #f05a3c); }
.ea-slot:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; }
.ea-slot-form .ea-field { max-width: 320px; }
/* текстовая ссылка «назад» — в отличие от .ea-back это не кнопка-иконка */
.ea-backlink {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	color: var(--a-muted, #6d7f80);
	text-decoration: none;
	font-size: 14px;
}
.ea-backlink:hover { color: var(--ea-coral, #f05a3c); }
.ea-backlink svg { width: 16px; height: 16px; }
/* счёт */
.ea-bill { max-width: 640px; }
.ea-bill-teacher { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.ea-bill-teacher .ea-row-name { display: block; color: inherit; text-decoration: none; font-weight: 600; }
.ea-bill-teacher .ea-row-name:hover { color: var(--ea-coral, #f05a3c); }
.ea-bill-state { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--a-line, #e6e3da); }
.ea-bill-state .ea-hint { margin-top: 8px; max-width: 60ch; }
.ea-bill-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
/* На узком экране кнопки урока идут сверху вниз в порядке важности:
   главное действие первым. column-reverse из кабинета преподавателя
   переворачивал этот порядок у ученика. */
@media (max-width: 767px) {
	.ea-lesson-foot { flex-direction: column; align-items: stretch; }
	.ea-lesson-foot .ea-hint-inline { order: 99; text-align: center; }
}
/* ==================================================================
   Мобильный лист «Ещё» и уровень ученика
================================================================== */

.ea-mnav button {
	border: 0;
	background: transparent;
	font: inherit;
	cursor: pointer;
}

.ea-sheet { position: fixed; inset: 0; z-index: 60; }
.ea-sheet-back { position: absolute; inset: 0; background: rgba(19,44,46,.45); }
.ea-sheet-box {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	background: var(--a-surface, #fff);
	border-radius: 18px 18px 0 0;
	padding: 12px 16px calc(16px + env(safe-area-inset-bottom));
	box-shadow: 0 -12px 40px rgba(19,44,46,.18);
}
.ea-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 0 10px; }
.ea-sheet-x { border: 0; background: transparent; font-size: 26px; line-height: 1; cursor: pointer; min-width: 44px; min-height: 44px; }
.ea-sheet-item {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 52px;
	padding: 8px 4px;
	border-top: 1px solid var(--a-line-soft, #f0eee7);
	color: inherit;
	text-decoration: none;
}
.ea-sheet-item svg { width: 20px; height: 20px; }
.ea-sheet-item.is-active { color: var(--ea-coral, #f05a3c); }

@media (min-width: 768px) { .ea-sheet { display: none; } }

/* уровень ученика во вкладке «Прогресс» */
.ea-level { display: grid; gap: 2px; }
.ea-level-label { font-size: 22px; font-weight: 600; }
.ea-level-score { color: var(--a-muted, #6d7f80); }
.ea-level-delta { font-weight: 600; }
.ea-level-delta.is-up { color: var(--ea-teal, #147d76); }
.ea-level-delta.is-down { color: var(--ea-coral, #f05a3c); }
.ea-details summary { cursor: pointer; font-size: 13px; color: var(--a-muted, #6d7f80); margin-top: 12px; }
.ea-level-history { display: grid; gap: 8px; margin-top: 12px; }
.ea-level-history li { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; font-size: 13px; border-top: 1px solid var(--a-line-soft, #f0eee7); padding-top: 8px; }
.ea-level-history-n { min-width: 86px; color: var(--a-muted, #6d7f80); }
.ea-up { color: var(--ea-teal, #147d76); }
.ea-down { color: var(--ea-coral, #f05a3c); }
/* лента дат: мобильная замена месячной сетке */
.ea-datestrip { display: none; }

@media (max-width: 767px) {
	.ea-datestrip {
		display: flex;
		gap: 8px;
		overflow-x: auto;
		padding: 4px 0 10px;
		scroll-snap-type: x proximity;
		-webkit-overflow-scrolling: touch;
	}
	.ea-datestrip .ea-date {
		flex: 0 0 auto;
		scroll-snap-align: start;
		min-width: 52px;
		min-height: 62px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 2px;
		border: 1px solid var(--a-line, #e6e3da);
		border-radius: 12px;
		background: var(--a-surface, #fff);
		text-decoration: none;
		color: inherit;
	}
	.ea-date b { font-size: 16px; }
	.ea-date span { font-size: 11px; color: var(--a-muted, #6d7f80); }
	.ea-date i { width: 5px; height: 5px; border-radius: 50%; background: var(--ea-teal, #147d76); }
	.ea-date.is-today { border-color: var(--ea-coral, #f05a3c); }
	.ea-date.is-active { background: var(--ea-ink, #132c2e); color: #fff; border-color: var(--ea-ink, #132c2e); }
	.ea-date.is-active span { color: rgba(255,255,255,.75); }
	.ea-date.is-active i { background: #fff; }

	.ea-hide-sm { display: none; }
}
/* Аватар-животное — растровый PNG 256×256: класс может стоять и на обёртке,
   и прямо на <img>, поэтому кадрирование задаём обоим. */
img.ea-ava, img.ea-ava--lg { object-fit: cover; border-radius: 50%; background: var(--ea-line-soft); }
.ea-ava img, img.ea-ava { image-rendering: auto; }
/* выход из кабинета: раньше он был только в мобильном листе «Ещё» */
.ea-side-out {
	display: block;
	margin-top: 8px;
	padding: 8px 10px;
	border-radius: 10px;
	color: rgba(255,255,255,.62);
	text-decoration: none;
	font-size: 13px;
}
.ea-side-out:hover { color: #fff; background: rgba(255,255,255,.08); }
.ea-mhead-right { display: flex; align-items: center; gap: 10px; }
.ea-mhead-out { color: rgba(255,255,255,.7); text-decoration: none; font-size: 13px; }
/* ==================================================================
   Домашняя работа: общий язык для кабинета ученика и преподавателя
   Композиция по Figma 138:3 / 138:4 (ученик) и 144:3 / 144:4 (преподаватель).
================================================================== */

.ea-hw-current { padding: 20px; }

.ea-hw-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ea-hw-when { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--ea-teal, #147d76); }
.ea-hw-when b { font-weight: 600; }
.ea-hw-title { margin: 8px 0 0; font-size: 22px; font-weight: 600; }
.ea-hw-sub { margin: 20px 0 10px; font-size: 15px; font-weight: 600; }

.ea-hw-message { margin-top: 14px; }
.ea-hw-message p {
	margin-top: 6px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--ea-teal-soft, #e3f0ee);
	max-width: 72ch;
}

/* пункты задания */
.ea-hw-items { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.ea-hw-item {
	display: grid;
	grid-template-columns: 32px 1fr auto;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border: 1px solid var(--ea-line, #e6e3da);
	border-radius: 12px;
	background: var(--ea-surface, #fff);
}
.ea-hw-item.is-done { background: var(--ea-teal-soft, #e3f0ee); border-color: transparent; }
.ea-hw-item.is-stuck { background: var(--ea-warn-soft, #fdf0d5); border-color: transparent; }
.ea-hw-item.is-proposed { border-style: dashed; border-color: #b9a6e8; background: #f6f2ff; }

.ea-hw-num {
	width: 26px; height: 26px;
	display: grid; place-items: center;
	border-radius: 50%;
	background: var(--ea-line-soft, #f0eee7);
	font-size: 12px; font-weight: 600;
}
.ea-hw-item.is-done .ea-hw-num { background: var(--ea-teal, #147d76); color: #fff; }

.ea-hw-body { min-width: 0; }
.ea-hw-text { font-weight: 500; overflow-wrap: anywhere; }
.ea-hw-link { display: inline-block; margin-top: 2px; font-size: 12px; color: var(--ea-teal, #147d76); }
.ea-hw-proposed-label { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: #6d4fc2; }

/* «Сделал / Не получается» — независимо по каждому пункту */
.ea-hw-marks { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ea-hw-mark {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 36px;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid var(--ea-line, #e6e3da);
	background: var(--ea-surface, #fff);
	font-size: 13px;
	cursor: pointer;
	white-space: nowrap;
}
.ea-hw-mark input { position: absolute; opacity: 0; width: 0; height: 0; }
.ea-hw-mark::before { content: '○'; font-size: 12px; }
.ea-hw-mark.is-on { background: var(--ea-teal, #147d76); border-color: var(--ea-teal, #147d76); color: #fff; }
.ea-hw-mark.is-on::before { content: '✓'; }
.ea-hw-mark--stuck.is-on { background: var(--ea-warn-soft, #fdf0d5); border-color: #d9b45f; color: #8a5710; }
.ea-hw-mark:focus-within { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; }
.ea-hw-mark input:disabled + span { opacity: .6; }

.ea-hw-mark-read { font-size: 13px; white-space: nowrap; }
.ea-good-mark { color: var(--ea-teal, #147d76); }
.ea-warn-mark { color: #8a5710; }

/* ответ ученика, ответ преподавателя, оценка */
.ea-hw-answer-grid { display: grid; grid-template-columns: 1fr 1fr 140px; gap: 16px; margin-top: 18px; align-items: start; }
.ea-hw-answer-grid .ea-textarea { width: 100%; }
.ea-hw-reply { padding: 12px 14px; border-radius: 12px; background: var(--ea-teal-soft, #e3f0ee); min-height: 64px; }
.ea-hw-score-box {
	display: grid; place-items: center; gap: 2px;
	padding: 18px 12px;
	border-radius: 12px;
	background: var(--ea-ink, #132c2e);
	color: #fff;
}
.ea-hw-score-box b { font-size: 26px; }
.ea-hw-score-box span { font-size: 11px; opacity: .7; }

.ea-hw-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; }

/* история — аккордеон */
.ea-hw-history-title { margin: 28px 0 4px; font-size: 20px; font-weight: 600; }
.ea-hw-history { display: grid; gap: 8px; margin-top: 12px; }
.ea-hw-past { background: var(--ea-surface, #fff); border: 1px solid var(--ea-line, #e6e3da); border-radius: 12px; }
.ea-hw-past > summary {
	display: grid;
	grid-template-columns: 120px 1fr auto 64px 20px;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	cursor: pointer;
	list-style: none;
}
.ea-hw-past > summary::-webkit-details-marker { display: none; }
.ea-hw-past > summary::after { content: '⌄'; color: var(--ea-muted, #6d7f80); }
.ea-hw-past[open] > summary::after { content: '⌃'; }
.ea-hw-past-date { font-weight: 600; }
.ea-hw-past-title { color: var(--ea-ink-2, #40575a); overflow-wrap: anywhere; }
.ea-hw-past-score { font-weight: 600; text-align: right; }
.ea-hw-past-body { padding: 0 16px 16px; display: grid; gap: 12px; }
.ea-hw-past-items { display: grid; gap: 6px; padding-left: 0; list-style: none; }
.ea-hw-past-items li { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; }
.ea-hw-field b { display: block; font-size: 12px; color: var(--ea-muted, #6d7f80); }
.ea-hw-field span { display: block; max-width: 78ch; }
.ea-hw-past-foot { font-size: 12px; color: var(--ea-muted, #6d7f80); }

/* ---------- преподаватель ---------- */

.ea-hw-step { margin-top: 22px; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--ea-teal, #147d76); }
.ea-hw-h2 { margin: 4px 0 2px; font-size: 22px; font-weight: 600; }

.ea-hw-picker .ea-input { min-width: 200px; }

.ea-hw-draft {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 16px;
	margin-top: 12px;
	padding: 18px;
	border-radius: 16px;
	background: #f4f1fb;
}
.ea-hw-draft-main { display: grid; gap: 14px; align-content: start; }
.ea-hw-draft-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.ea-badge--elety { background: #e7defb; color: #5b3fa8; }
.ea-badge--elety::before { background: #6d4fc2; }

.ea-hw-mode { background: var(--ea-surface, #fff); border-radius: 999px; padding: 2px; }
.ea-hw-mode > span, .ea-hw-mode button {
	display: inline-block;
	padding: 7px 14px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font: inherit;
	font-size: 13px;
	cursor: pointer;
}
.ea-hw-mode > span.is-active { background: #e7defb; color: #5b3fa8; }

.ea-hw-draft-head { display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: var(--ea-surface, #fff); justify-items: start; }
.ea-hw-draft-head .ea-input, .ea-hw-draft-head .ea-textarea { width: 100%; }

.ea-hw-items--edit .ea-hw-item { grid-template-columns: 32px 1fr auto; }
.ea-hw-item-acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.ea-hw-order { display: flex; gap: 4px; }
.ea-hw-item-edit { grid-column: 1 / -1; display: grid; gap: 10px; padding-top: 10px; border-top: 1px solid var(--ea-line-soft, #f0eee7); }
.ea-hw-item-edit .ea-input, .ea-hw-item-edit .ea-textarea { width: 100%; }

.ea-hw-add { display: grid; gap: 10px; justify-items: start; }
.ea-hw-add-ways { display: flex; flex-wrap: wrap; gap: 8px; }
.ea-hw-new-item { width: 100%; display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: var(--ea-surface, #fff); justify-items: start; }
.ea-hw-new-item .ea-input, .ea-hw-new-item .ea-textarea { width: 100%; }

.ea-hw-draft-side { display: grid; gap: 12px; align-content: start; padding: 16px; border-radius: 12px; background: var(--ea-surface, #fff); }
.ea-hw-draft-side .ea-input { width: 100%; }
.ea-hw-draft-side .ea-btn--primary { width: 100%; justify-content: center; }
.ea-hw-draft-status { font-size: 12px; color: #8a5710; }

.ea-hw-startline { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 0 8px; }

.ea-hw-review { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; margin-top: 12px; align-items: start; }
.ea-hw-review .ea-card { display: grid; gap: 14px; }
.ea-hw-verdict { display: grid; gap: 12px; }
.ea-hw-verdict .ea-textarea { width: 100%; }
.ea-hw-verdict-foot { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.ea-field--short .ea-input { width: 120px; }

.ea-hw-elety { display: grid; gap: 12px; align-content: start; padding: 16px; border-radius: 16px; background: #f4f1fb; }
.ea-hw-toggle-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ea-hw-suggestion { padding: 14px; border-radius: 12px; background: var(--ea-teal-soft, #e3f0ee); display: grid; gap: 6px; justify-items: start; }
.ea-hw-suggestion-score { font-weight: 600; }
.ea-hw-suggestion-text { font-size: 13px; color: var(--ea-ink-2, #40575a); }
.ea-hw-elety-foot { font-size: 12px; color: var(--ea-muted, #6d7f80); }

/* ---------- планшет и телефон ---------- */

@media (max-width: 1199px) {
	.ea-hw-draft, .ea-hw-review { grid-template-columns: minmax(0, 1fr); }
	.ea-hw-answer-grid { grid-template-columns: 1fr 1fr; }
	.ea-hw-score { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
	/* порядок блоков фиксирован: задание → пункты → ответ → проверка → история */
	.ea-hw-answer-grid { grid-template-columns: 1fr; }
	.ea-hw-item { grid-template-columns: 26px 1fr; }
	.ea-hw-marks { grid-column: 1 / -1; justify-content: flex-start; }
	.ea-hw-item-acts { grid-column: 1 / -1; justify-content: flex-start; }
	.ea-hw-mark { min-height: 44px; flex: 1 1 auto; justify-content: center; }
	.ea-hw-mark-read { grid-column: 1 / -1; }
	.ea-hw-past > summary { grid-template-columns: 84px 1fr auto; row-gap: 4px; }
	.ea-hw-past-score { grid-column: 2 / 3; text-align: left; }
	.ea-hw-past > summary::after { grid-row: 1; }
	.ea-hw-actions .ea-btn { width: 100%; justify-content: center; }
	.ea-hw-draft { padding: 14px; }
	.ea-hw-draft-side .ea-btn { width: 100%; justify-content: center; }
	.ea-hw-startline { flex-direction: column; align-items: stretch; }
	.ea-hw-startline .ea-btn { width: 100%; justify-content: center; }
}
/* display: grid на форме перебивал атрибут hidden — скрытые блоки раскрывались сами */
.ea [hidden] { display: none !important; }
/* ==================================================================
   Домашняя работа: правки после сверки с Figma 144:3 / 144:4
   Экран читается как «проверь и отправь»: формы свёрнуты, пока их не открыли.
================================================================== */

/* выбор ученика — капсула «Имя · сменить», нативный список поверх неё */
.ea-hw-picker {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 16px;
	border-radius: 999px;
	border: 1px solid var(--ea-line, #e6e3da);
	background: var(--ea-surface, #fff);
	font-size: 14px;
}
.ea-hw-picker-name { font-weight: 600; }
.ea-hw-picker-sep, .ea-hw-picker-hint { color: var(--ea-muted, #6d7f80); }
.ea-hw-picker-hint::after { content: ' ⌄'; }
.ea-hw-picker select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

/* шапка черновика: заголовок текстом, а не полем */
.ea-hw-draft-head { padding: 0 4px; }
.ea-hw-draft-title { margin: 0; font-size: 24px; font-weight: 600; letter-spacing: -.01em; }
.ea-hw-draft-note { margin-top: 6px; color: var(--ea-ink-2, #40575a); max-width: 62ch; }
.ea-hw-head-edit { display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: var(--ea-surface, #fff); justify-items: start; }
.ea-hw-head-edit .ea-input, .ea-hw-head-edit .ea-textarea { width: 100%; }

/* пункты: белые строки, действия появляются только в режиме правки */
.ea-hw-items--edit .ea-hw-item { border-color: transparent; box-shadow: 0 1px 2px rgba(19,44,46,.06); }
.ea-hw-item-tools { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ea-hw-num.is-deck { background: var(--ea-teal, #147d76); color: #fff; }
.ea-hw-link--muted { color: var(--ea-muted, #6d7f80); }

/* «Принять» у предложенного пункта — teal, как в макете */
.ea-btn--accept { background: var(--ea-teal, #147d76); border-color: var(--ea-teal, #147d76); color: #fff; }
.ea-btn--accept:hover { background: #10635e; border-color: #10635e; }

/* добавление пункта — одна строка-сегмент */
.ea-hw-add-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px;
	padding: 4px;
	border-radius: 12px;
	background: var(--ea-surface, #fff);
	box-shadow: 0 1px 2px rgba(19,44,46,.06);
}
.ea-hw-add-label { padding: 8px 14px; font-size: 13px; color: var(--ea-ink-2, #40575a); }
.ea-hw-add-way {
	padding: 8px 14px;
	min-height: 36px;
	border: 0;
	border-radius: 8px;
	background: var(--ea-teal-soft, #e3f0ee);
	color: var(--ea-teal, #147d76);
	font: inherit;
	font-size: 13px;
	cursor: pointer;
}
.ea-hw-add-way:hover { background: #d3e7e4; }
.ea-hw-add-way:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; }

/* правая колонка: primary + «Редактировать черновик» */
.ea-hw-edit-draft { width: 100%; justify-content: center; }

/* ответ ученика у преподавателя — нейтральное поле, не «успех» */
.ea-hw-answer-read {
	padding: 12px 14px;
	border: 1px solid var(--ea-line, #e6e3da);
	border-radius: 12px;
	background: var(--ea-surface, #fff);
	min-height: 56px;
	max-width: 78ch;
}

/* строки проверки: белые, статус справа текстом со значком */
.ea-hw-items--read .ea-hw-item { background: var(--ea-surface, #fff); border-color: var(--ea-line, #e6e3da); }
.ea-hw-items--read .ea-hw-item.is-deck-row { background: var(--ea-teal-soft, #e3f0ee); border-color: transparent; }

/* развилка проверки */
.ea-hw-verdict-ways { display: flex; flex-wrap: wrap; gap: 8px; }
.ea-btn--soft { background: var(--ea-teal-soft, #e3f0ee); border-color: transparent; color: var(--ea-teal, #147d76); }
.ea-btn--soft:hover { background: #d3e7e4; }

/* автопроверка: тумблер и зелёная карточка результата */
.ea-hw-elety .ea-switch { flex: none; }
.ea-hw-elety .ea-switch.is-busy { opacity: .6; }
.ea-hw-elety-note { font-size: 13px; color: var(--ea-ink-2, #40575a); }
.ea-hw-suggestion-list { display: grid; gap: 2px; margin: 4px 0 8px; padding: 0; list-style: none; font-size: 13px; color: var(--ea-ink-2, #40575a); }
.ea-hw-manual-jump { width: 100%; justify-content: center; }

@media (max-width: 767px) {
	.ea-hw-picker { width: 100%; justify-content: space-between; }
	.ea-hw-add-row { width: 100%; }
	.ea-hw-add-way { flex: 1 1 auto; text-align: center; }
	.ea-hw-verdict-ways .ea-btn { width: 100%; justify-content: center; }
	.ea-hw-item-acts { gap: 6px; }
	.ea-hw-item-tools .ea-btn { min-height: 40px; }
}
/* сегмент «Elety предложила / Создать вручную» — одной строкой, как в макете */
.ea-hw-mode { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: 2px; }
.ea-hw-mode form { display: inline-flex; }
.ea-hw-mode > span, .ea-hw-mode button { white-space: nowrap; }
.ea-hw-mode button { background: var(--ea-surface, #fff); }

/* «+ Добавить пункт» — белая пилюля в том же сегменте, а не подпись */
.ea-hw-add-label {
	padding: 8px 14px;
	min-height: 36px;
	display: inline-flex;
	align-items: center;
	border-radius: 8px;
	background: var(--ea-surface, #fff);
	border: 1px solid var(--ea-line, #e6e3da);
	font-size: 13px;
	color: var(--ea-ink, #132c2e);
	white-space: nowrap;
}
.ea-hw-add-row { gap: 6px; background: transparent; box-shadow: none; padding: 0; }
/* ==================================================================
   Профиль ученика: одна страница вместо вкладок «Прогресс» и «Настройки»
   Композиция по Figma 180:2 (desktop) и 180:77 (mobile 390).
================================================================== */

.ea-tabs--scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.ea-pf-top { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 12px; align-items: start; }

/* социальная карточка */
.ea-pf-card { display: grid; justify-items: center; gap: 6px; padding: 24px 20px; text-align: center; }
.ea-pf-ava {
	width: 160px; height: 160px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--ea-line-soft, #f0eee7);
	display: grid;
	place-items: center;
}
.ea-pf-ava img { width: 100%; height: 100%; object-fit: cover; }
.ea-pf-name { margin-top: 10px; font-size: 22px; font-weight: 600; overflow-wrap: anywhere; }
.ea-pf-role { color: var(--ea-muted, #6d7f80); font-size: 13px; }

.ea-pf-tz {
	position: relative;
	width: 100%;
	margin-top: 12px;
	padding: 10px 14px;
	border: 1px solid var(--ea-line, #e6e3da);
	border-radius: 12px;
	text-align: left;
	background: var(--ea-surface, #fff);
}
.ea-pf-tz label { display: block; font-size: 11px; color: var(--ea-muted, #6d7f80); }
.ea-pf-tz select {
	width: 100%;
	border: 0;
	background: transparent;
	font: inherit;
	font-weight: 600;
	color: var(--ea-ink, #132c2e);
	padding: 2px 0 0;
	cursor: pointer;
}
.ea-pf-tz select:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 3px; }

/* контакты и уведомления */
.ea-pf-contacts { display: grid; gap: 10px; align-content: start; }
.ea-pf-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--ea-bg-soft, #f7f5ef);
}
.ea-pf-row--privacy { background: #f4f1fb; }
.ea-pf-row-value { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: var(--ea-muted, #6d7f80); }
.ea-pf-row-label { font-size: 13px; color: var(--ea-ink-2, #40575a); }
.ea-pf-row-acts { display: flex; align-items: center; gap: 10px; }

.ea-pf-id {
	border: 0;
	border-radius: 999px;
	padding: 4px 10px;
	background: var(--ea-teal-soft, #e3f0ee);
	color: var(--ea-teal, #147d76);
	font: inherit;
	font-size: 12px;
	cursor: pointer;
}
.ea-pf-id:hover { background: #d3e7e4; }

.ea-pf-edit {
	width: 34px; height: 34px;
	display: grid; place-items: center;
	border: 1px solid var(--ea-line, #e6e3da);
	border-radius: 10px;
	background: var(--ea-surface, #fff);
	color: var(--ea-ink-2, #40575a);
	text-decoration: none;
	cursor: pointer;
	font-size: 14px;
}
.ea-pf-edit:hover { border-color: var(--ea-ink-2, #40575a); }

.ea-pf-mail { display: grid; gap: 10px; padding: 14px 16px; border-radius: 12px; background: var(--ea-bg-soft, #f7f5ef); }
.ea-pf-mail .ea-input { width: 100%; max-width: 360px; }

/* прогресс */
.ea-pf-progress { margin-top: 12px; }
.ea-pf-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ea-pf-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 1.4fr; gap: 12px; margin-top: 14px; }
.ea-pf-metrics .ea-metric {
	padding: 16px;
	border-radius: 12px;
	background: var(--ea-bg-soft, #f7f5ef);
}
.ea-pf-total { padding: 16px; border-radius: 12px; background: var(--ea-teal-soft, #e3f0ee); display: grid; gap: 4px; align-content: start; }
.ea-pf-level { font-size: 22px; font-weight: 600; }
.ea-pf-total-sub { font-size: 12px; color: var(--ea-ink-2, #40575a); }
.ea-pf-total .ea-bar { height: 8px; margin-top: 6px; border-radius: 999px; background: rgba(19,44,46,.10); overflow: hidden; }
.ea-pf-total .ea-bar span { display: block; height: 100%; background: var(--ea-teal, #147d76); }

/* безопасность */
.ea-pf-security { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.ea-pf-phone-value { font-weight: 600; }
.ea-pf-security-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ea-pf-sec-form { margin-top: 10px; display: grid; gap: 10px; }

@media (max-width: 1199px) {
	.ea-pf-top { grid-template-columns: minmax(0, 1fr); }
	.ea-pf-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.ea-pf-total { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
	/* порядок на телефоне: фото и имя → прогресс → контакты → безопасность */
	.ea-pf-top { display: contents; }
	.ea-pf-card { order: 1; }
	.ea-pf-progress { order: 2; margin-top: 12px; }
	.ea-pf-contacts { order: 3; margin-top: 12px; }
	.ea-pf-security, .ea-pf-sec-form { order: 4; }
	.ea-tab[data-pane="profile"] { display: flex; flex-direction: column; }

	.ea-pf-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ea-pf-row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 6px; }
	.ea-pf-row-label { grid-column: 1 / -1; order: 3; }
	.ea-pf-security { flex-direction: column; align-items: stretch; }
	.ea-pf-security-acts .ea-btn { width: 100%; justify-content: center; }
	.ea-pf-ava { width: 132px; height: 132px; }

	/* нижняя навигация не должна перекрывать кнопки безопасности */
	.ea-tab[data-pane="profile"] { padding-bottom: 88px; }
}
/* вкладки профиля на телефоне: горизонтальная прокрутка, а не перенос строки */
.ea-tabs--scroll { flex-wrap: nowrap; }
.ea-tabs--scroll > a { flex: 0 0 auto; }
/* Профиль открывается по своему имени: подсвечиваем его, когда мы внутри */
.ea-side-me.is-active { background: rgba(255,255,255,.10); border-radius: 12px; }
.ea-mhead-me.is-active img { outline: 2px solid var(--ea-coral, #f05a3c); outline-offset: 2px; border-radius: 50%; }
/* ==================================================================
   Авторизация: вход, регистрация, восстановление
   Композиция по Figma 190:3 / 190:34 / 190:69 (desktop) и 190:132 и далее (390).
================================================================== */

.ea-auth-page { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); min-height: 100vh; }

.ea-auth-side {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 24px;
	padding: 40px;
	background: var(--ea-ink, #132c2e);
	color: #fff;
}
.ea-auth-brand { display: inline-flex; align-items: center; gap: 6px; font-size: 22px; font-weight: 700; color: #fff; text-decoration: none; }
.ea-auth-brand svg { width: 18px; height: 18px; color: var(--ea-coral, #f05a3c); }
.ea-auth-claim { margin-top: auto; font-size: 40px; line-height: 1.12; font-weight: 700; letter-spacing: -.02em; max-width: 12ch; }
.ea-auth-sub { margin-top: 14px; color: rgba(255,255,255,.72); max-width: 34ch; }
.ea-auth-quote {
	margin-top: 28px;
	padding: 18px 20px;
	border-radius: 14px;
	background: var(--ea-coral, #f05a3c);
	font-weight: 600;
	line-height: 1.35;
	max-width: 320px;
}

.ea-auth-main { display: grid; place-items: center; padding: 40px 24px; background: var(--ea-bg, #f7f5ef); }
.ea-auth-box {
	width: 100%;
	max-width: 460px;
	padding: 26px;
	border-radius: 18px;
	background: var(--ea-surface, #fff);
	box-shadow: 0 18px 50px rgba(19,44,46,.08);
}

/* две вкладки: восстановление сюда не выносится */
.ea-auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 20px; }
.ea-auth-tabs a {
	min-height: 44px;
	display: grid;
	place-items: center;
	border-radius: 10px;
	background: var(--ea-bg-soft, #f2efe7);
	color: var(--ea-ink-2, #40575a);
	text-decoration: none;
	font-size: 14px;
}
.ea-auth-tabs a.is-active { background: var(--ea-ink, #132c2e); color: #fff; }
.ea-auth-tabs a:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; }

.ea-auth-title { font-size: 26px; font-weight: 700; letter-spacing: -.01em; }
.ea-auth-lead { margin-top: 4px; color: var(--ea-muted, #6d7f80); font-size: 13px; }

.ea-auth-social { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px; }
.ea-auth-social-btn { width: 100%; justify-content: center; min-height: 44px; }

.ea-auth-or { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: var(--ea-muted, #6d7f80); font-size: 12px; }
.ea-auth-or::before, .ea-auth-or::after { content: ''; flex: 1; height: 1px; background: var(--ea-line, #e6e3da); }

.ea-auth-form { display: grid; gap: 14px; }
.ea-auth-form .ea-input { width: 100%; min-height: 48px; }

.ea-auth-pass { position: relative; }
.ea-auth-eye {
	position: absolute;
	top: 30px; right: 12px;
	min-height: 32px;
	padding: 4px 8px;
	border: 0;
	background: transparent;
	color: var(--ea-teal, #147d76);
	font: inherit;
	font-size: 13px;
	cursor: pointer;
}
.ea-auth-eye:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; border-radius: 6px; }

/* «Забыли пароль?» — текстовая ссылка, а не вторая кнопка */
.ea-auth-forgot {
	justify-self: center;
	color: var(--ea-teal, #147d76);
	font-size: 13px;
	text-decoration: none;
	padding: 6px 8px;
}
.ea-auth-forgot:hover { text-decoration: underline; }
.ea-auth-forgot:focus-visible { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; border-radius: 6px; }

.ea-auth-submit { width: 100%; justify-content: center; min-height: 48px; }

.ea-auth-error {
	padding: 12px 14px;
	border-radius: 10px;
	background: var(--ea-coral-soft, #fde8e3);
	color: #a1341c;
	font-size: 13px;
}

.ea-auth-note {
	margin-top: 20px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--ea-teal-soft, #e3f0ee);
	font-size: 13px;
}
.ea-auth-note p { margin-top: 4px; }
.ea-auth-legal { margin-top: 14px; text-align: center; font-size: 12px; color: var(--ea-muted, #6d7f80); }
.ea-auth-legal a { color: inherit; }

/* роль при регистрации: она превращается в is_teacher */
.ea-auth-roles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 6px; }
.ea-auth-role {
	min-height: 48px;
	display: grid;
	place-items: center;
	border: 1px solid var(--ea-line, #e6e3da);
	border-radius: 10px;
	cursor: pointer;
	font-size: 14px;
}
.ea-auth-role input { position: absolute; opacity: 0; width: 0; height: 0; }
.ea-auth-role.is-on { border-color: var(--ea-teal, #147d76); background: var(--ea-teal-soft, #e3f0ee); color: var(--ea-teal, #147d76); font-weight: 600; }
.ea-auth-role:focus-within { outline: 2px solid var(--ea-teal, #147d76); outline-offset: 2px; }

/* восстановление */
.ea-auth-sent { display: grid; gap: 8px; justify-items: center; text-align: center; padding: 18px 0; }
.ea-auth-sent-icon {
	width: 46px; height: 46px;
	display: grid; place-items: center;
	border-radius: 50%;
	background: var(--ea-teal-soft, #e3f0ee);
	color: var(--ea-teal, #147d76);
	font-size: 22px;
}
.ea-auth-back { display: block; margin-top: 16px; text-align: center; color: var(--ea-muted, #6d7f80); font-size: 13px; text-decoration: none; }
.ea-auth-back:hover { color: var(--ea-ink, #132c2e); }

@media (max-width: 1199px) {
	.ea-auth-page { grid-template-columns: minmax(0, 340px) minmax(0, 1fr); }
	.ea-auth-claim { font-size: 32px; }
}

@media (max-width: 767px) {
	/* на телефоне обещание продукта сворачивается в шапку, соцвходы — в столбик */
	.ea-auth-page { grid-template-columns: minmax(0, 1fr); min-height: auto; }
	.ea-auth-side { padding: 24px 20px 28px; gap: 12px; }
	.ea-auth-claim { margin-top: 14px; font-size: 26px; max-width: none; }
	.ea-auth-sub { margin-top: 8px; }
	.ea-auth-quote { display: none; }
	.ea-auth-main { padding: 18px 16px 40px; }
	.ea-auth-box { padding: 18px; box-shadow: none; }
	.ea-auth-social { grid-template-columns: 1fr; }
	.ea-auth-roles { grid-template-columns: 1fr; }
}
/* страница авторизации занимает весь экран, без обёртки кабинета */
.ea-auth-body { min-height: 100vh; }
/* нерабочее время: у ученика — помеченный час, у преподавателя — подтверждение */
.ea-slot--off {
	background: var(--ea-bg-soft, #f2efe7);
	color: var(--ea-muted, #6d7f80);
	border-style: dashed;
	cursor: default;
	display: grid;
	gap: 2px;
	line-height: 1.2;
}
.ea-slot--off em { font-style: normal; font-size: 10px; }

.ea-offer-warn {
	margin: 12px 0;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--ea-warn-soft, #fdf0d5);
	color: #7a4f0c;
}
.ea-offer-warn-acts { display: flex; gap: 8px; margin-top: 10px; }
.ea-btn--grey { background: var(--ea-line-soft, #eceae3); border-color: transparent; color: var(--ea-ink-2, #40575a); }
.ea-btn--grey:hover { background: #e2dfd6; }

/* закрытый час в сетке подписан, а не только закрашен */
.ea-cell.is-closed { position: relative; }
.ea-cell.is-closed::after {
	content: 'нерабочее время';
	position: absolute;
	left: 6px; top: 50%;
	transform: translateY(-50%);
	font-size: 10px;
	color: var(--ea-muted, #6d7f80);
	pointer-events: none;
	white-space: nowrap;
	opacity: 0;
}
.ea-cell.is-closed:hover::after, .ea-cell.is-closed:focus-visible::after { opacity: 1; }
/* галочка «ДЗ» рядом со скрепкой */
.ea-chat-hw {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 10px;
	border: 1px solid var(--ea-line, #e2ded3);
	border-radius: 999px;
	color: var(--ea-muted, #6d7f80);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	flex: 0 0 auto;
	align-self: flex-end;
	margin-bottom: 2px;
}
.ea-chat-hw input { position: absolute; opacity: 0; pointer-events: none; }
.ea-chat-hw svg { width: 14px; height: 14px; opacity: .45; }
.ea-chat-hw:hover { border-color: var(--ea-coral, #f05a3c); color: var(--ea-coral, #f05a3c); }
.ea-chat-hw:has(input:checked) {
	background: var(--ea-coral, #f05a3c);
	border-color: var(--ea-coral, #f05a3c);
	color: #fff;
}
.ea-chat-hw:has(input:checked) svg { opacity: 1; }
.ea-chat-hw:has(input:focus-visible) { outline: 2px solid var(--ea-coral, #f05a3c); outline-offset: 2px; }
/* блок «войти через…» на странице входа */
.ea-auth-social { display: grid; gap: 8px; }
.ea-auth-tg { display: flex; justify-content: center; min-height: 40px; }
.ea-auth-social-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; }
/* ---------- приёмка 15.08: подсказки об ошибках, прошедшие дни, форма QR ---------- */

.ea-hint--err {
	color: #b03a1f;
}

.ea-day.is-past {
	opacity: .38;
	cursor: default;
}

.ea-state-form {
	display: grid;
	gap: 12px;
	justify-items: center;
	margin: 20px auto 0;
	max-width: 320px;
	width: 100%;
	text-align: left;
}

.ea-state-form .ea-field {
	width: 100%;
}

.ea-state-form .ea-btn {
	width: 100%;
	justify-content: center;
}

/* Календарь выбора дня на странице преподавателя: общее мобильное правило
   даёт сетке min-width 728px, и на телефоне страницу уносило вбок
   (в кабинете это скрыто скроллом .ea-month, здесь обёртки нет).
   Для выбора дня достаточно компактных ячеек. */
@media (max-width: 767px) {
	.ea-month--pick .ea-dow,
	.ea-month--pick .ea-week {
		grid-template-columns: repeat(7, minmax(0, 1fr));
		min-width: 0;
	}

	.ea-month--pick .ea-day {
		min-height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 4px;
	}

	.ea-month--pick .ea-day-num {
		width: auto;
		justify-content: center;
		padding-left: 0;
	}
}

/* ---------- рабочие часы дня и страница направления ---------- */

.ea-back { margin-bottom: 12px; font-size: 14px; }
.ea-back a { color: var(--ea-muted, #6b7472); text-decoration: none; }
.ea-back a:hover { color: var(--ea-ink, #132c2e); }

.ea-wh-day { display: grid; gap: 8px; }

.ea-wh-hour {
	border: 1px solid var(--ea-line, #e3e0d8);
	border-radius: 10px;
	padding: 10px 14px;
	background: var(--ea-card, #fff);
}

.ea-wh-hour.is-off { background: var(--ea-line-soft, #f4f2ec); }

.ea-wh-hour-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 28px;
}

.ea-wh-time { font-variant-numeric: tabular-nums; font-weight: 600; }

.ea-switch-inline {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--ea-muted, #6b7472);
	cursor: pointer;
	min-height: 44px;
	padding: 0 2px;
}

.ea-switch-inline input { width: 20px; height: 20px; }

.ea-wh-lesson {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 8px;
	padding: 8px 10px;
	border-radius: 8px;
	background: var(--ea-line-soft, #f4f2ec);
	color: inherit;
	text-decoration: none;
	font-size: 14px;
}

.ea-wh-lesson:hover { background: var(--ea-line, #e3e0d8); }
.ea-wh-lesson-time { font-variant-numeric: tabular-nums; font-weight: 600; }
.ea-wh-lesson-who { color: var(--ea-ink, #132c2e); }

/* Подзаголовок внутри карточки — для второго списка (например, забранные наборы) */
.ea-sub-title { margin: 18px 0 8px; font-size: 14px; font-weight: 600; color: var(--ea-muted, #6b7472); }
/* Форма переноса урока на карточке */
.ea-move-form { margin-top: 14px; display: grid; gap: 10px; padding-top: 14px; border-top: 1px solid var(--ea-line, #e3e0d8); }
.ea-move-form .ea-field--short .ea-input { max-width: 220px; }
/* ---------- Школы преподавателя: где работает и по какой ставке ---------- */
.ea-list { display: flex; flex-direction: column; gap: 2px; }
.ea-list-row {
	display: flex; align-items: center; justify-content: space-between; gap: var(--ea-s4);
	padding: 12px 0; border-bottom: 1px solid var(--ea-line);
}
.ea-list-row:last-child { border-bottom: 0; }
.ea-list-val { font-weight: 600; white-space: nowrap; text-align: right; }
@media (max-width: 560px) {
	.ea-list-row { flex-direction: column; align-items: flex-start; gap: 4px; }
	.ea-list-val { text-align: left; }
}
/* Ставка по направлению — вложенная строка под школой */
.ea-list-row--sub { padding-left: 16px; border-left: 2px solid var(--ea-line); }
.ea-list-row--sub > div:first-child { font-size: 14px; }
/* Свои занятия: строка-форма из четырёх полей */
.ea-own { margin-top: var(--ea-s5); }
.ea-own.is-hidden { display: none; }
.ea-sub-title { font-size: 15px; font-weight: 700; margin: var(--ea-s5) 0 4px; }
.ea-own-row {
	display: grid; grid-template-columns: minmax(180px, 2fr) 1.2fr .8fr .8fr auto;
	gap: 10px; align-items: end; padding: 12px 0; border-bottom: 1px solid var(--ea-line);
}
.ea-own-row--new { border-bottom: 0; }
.ea-own-acts { display: flex; gap: 8px; }
@media (max-width: 720px) {
	.ea-own-row { grid-template-columns: 1fr 1fr; }
	.ea-own-acts { grid-column: 1 / -1; }
}

/* Час, отданный школе: занят, кликать нельзя */
.ea-hour--school.is-on { box-shadow: inset 0 0 0 2px var(--ea-accent, #7c5cff); }
.ea-hour.is-school { opacity: .55; cursor: not-allowed; background-image: repeating-linear-gradient(45deg, transparent, transparent 3px, rgba(0,0,0,.12) 3px, rgba(0,0,0,.12) 6px); }
/* Карточка-переворот и проверка себя на странице набора */
.ea-back { display: inline-block; margin-bottom: 6px; font-size: 13px; color: var(--ea-muted); }
.ea-flip {
	display: flex; align-items: center; justify-content: center; text-align: center;
	min-height: 180px; padding: var(--ea-s5); cursor: pointer; user-select: none;
	border: 1px solid var(--ea-line); border-radius: var(--ea-r); background: var(--ea-canvas, #f7f6f2);
	font-size: 24px; font-weight: 600;
}
.ea-flip:focus-visible { outline: 2px solid var(--ea-accent, #7c5cff); outline-offset: 2px; }
.ea-flip-back { color: var(--ea-muted); font-weight: 500; }
.ea-flip-actions { display: flex; align-items: center; justify-content: space-between; gap: var(--ea-s3); margin-top: var(--ea-s4); }
.ea-quiz-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: var(--ea-s4); }
.ea-quiz-options .ea-btn { justify-content: center; text-align: center; }
@media (max-width: 560px) { .ea-quiz-options { grid-template-columns: 1fr; } }
/* Длинное название без пробелов распирало строку и уводило страницу вбок
   (нашлось на тесте: набор с именем из 200 одинаковых букв). */
.ea-row-name, .ea-row-sub, .ea-card-title, .ea-flip { overflow-wrap: anywhere; }
/* Значок непрочитанных: цифра рядом с пунктом меню */
.ea-badge-count {
	margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px; background: var(--ea-coral, #f05a3c); color: #fff;
	font-size: 11px; font-weight: 600; line-height: 1;
}
.ea-mnav .ea-badge-count--dot {
	position: absolute; top: 4px; right: 50%; margin-right: -22px; margin-left: 0;
	min-width: 16px; height: 16px; padding: 0 4px; font-size: 10px;
}
.ea-mnav a, .ea-mnav button { position: relative; }
/* ==================================================================
   Тренажёр внутри кабинета: своё меню, основное — свёрнуто.
   На телефоне меню тренажёра уходит, остаётся кнопка «← Elety».
================================================================== */
.ea-cards-shell { display: grid; grid-template-columns: 200px 1fr; gap: var(--ea-s5); align-items: start; }

.ea-cards-nav {
	position: sticky; top: var(--ea-s4);
	display: flex; flex-direction: column; gap: 4px;
	padding: var(--ea-s4); border: 1px solid var(--ea-line); border-radius: var(--ea-r);
	background: var(--ea-surface);
}
.ea-cards-back { font-size: 13px; color: var(--ea-muted); margin-bottom: 4px; }
.ea-cards-brand { font-size: 15px; font-weight: 700; margin-bottom: 8px; }
.ea-cards-nav nav { display: flex; flex-direction: column; gap: 2px; }
.ea-cards-nav nav a {
	display: flex; align-items: center; gap: 8px;
	padding: 9px 10px; border-radius: 9px; font-size: 14px; color: var(--ea-ink);
}
.ea-cards-nav nav a svg { width: 16px; height: 16px; flex: none; }
.ea-cards-nav nav a:hover { background: var(--ea-canvas, #f7f6f2); }
.ea-cards-nav nav a.is-active { background: var(--ea-coral, #f05a3c); color: #fff; }
.ea-cards-full { margin-top: var(--ea-s4); font-size: 13px; color: var(--ea-muted); }

/* Основное меню кабинета на страницах тренажёра сворачивается в полосу */
.ea-shell:has(.ea-cards-shell) .ea-side { width: 64px; }
.ea-shell:has(.ea-cards-shell) .ea-side span,
.ea-shell:has(.ea-cards-shell) .ea-side .ea-side-me b,
.ea-shell:has(.ea-cards-shell) .ea-brand-text { display: none; }
.ea-shell:has(.ea-cards-shell) .ea-side a { justify-content: center; }

@media (max-width: 900px) {
	.ea-cards-shell { grid-template-columns: 1fr; }
	.ea-cards-nav {
		position: static; flex-direction: row; align-items: center; gap: 8px;
		overflow-x: auto; padding: 10px var(--ea-s4);
	}
	.ea-cards-nav nav { flex-direction: row; gap: 6px; }
	.ea-cards-nav nav a { white-space: nowrap; }
	.ea-cards-brand, .ea-cards-full { display: none; }
	.ea-cards-back { margin: 0 6px 0 0; font-weight: 600; color: var(--ea-ink); }
}

/* Тренировка */
.ea-train-top { display: flex; justify-content: space-between; margin-bottom: var(--ea-s3); }
.ea-train-actions { display: flex; gap: 10px; justify-content: center; margin-top: var(--ea-s4); }
.ea-train-actions .ea-btn { min-width: 150px; justify-content: center; }
@media (max-width: 560px) {
	.ea-train-actions { flex-direction: column; }
	.ea-train-actions .ea-btn { width: 100%; }
}
/* Мобильная лента тренажёра: кнопка возврата одной строкой */
.ea-cards-back { white-space: nowrap; }

/* Нижнее меню на телефоне: длинные названия слипались друг с другом */
.ea-mnav a, .ea-mnav button { min-width: 0; }
.ea-mnav a span, .ea-mnav a, .ea-mnav button {
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* ==================================================================
   Свёрнутое меню на страницах тренажёра: полоса иконок, которая
   раскрывается при наведении. Имя человека сжимается до аватарки,
   «Выйти» — до значка.
================================================================== */
.ea-shell:has(.ea-cards-shell) .ea-side {
	width: 64px; overflow: hidden;
	transition: width .16s ease;
	z-index: 30;
}
.ea-shell:has(.ea-cards-shell) .ea-side:hover,
.ea-shell:has(.ea-cards-shell) .ea-side:focus-within { width: 232px; }

.ea-shell:has(.ea-cards-shell) .ea-side .ea-brand span,
.ea-shell:has(.ea-cards-shell) .ea-side nav span,
.ea-shell:has(.ea-cards-shell) .ea-side .ea-side-me div,
.ea-shell:has(.ea-cards-shell) .ea-side .ea-side-out span {
	opacity: 0; transition: opacity .12s ease; white-space: nowrap;
}
.ea-shell:has(.ea-cards-shell) .ea-side:hover .ea-brand span,
.ea-shell:has(.ea-cards-shell) .ea-side:hover nav span,
.ea-shell:has(.ea-cards-shell) .ea-side:hover .ea-side-me div,
.ea-shell:has(.ea-cards-shell) .ea-side:hover .ea-side-out span,
.ea-shell:has(.ea-cards-shell) .ea-side:focus-within nav span,
.ea-shell:has(.ea-cards-shell) .ea-side:focus-within .ea-side-me div,
.ea-shell:has(.ea-cards-shell) .ea-side:focus-within .ea-side-out span { opacity: 1; }

/* Аватар круглый и по центру полосы */
.ea-shell:has(.ea-cards-shell) .ea-side-me img { border-radius: 50%; }
.ea-shell:has(.ea-cards-shell) .ea-side-me,
.ea-shell:has(.ea-cards-shell) .ea-side-out,
.ea-shell:has(.ea-cards-shell) .ea-side nav a { gap: 12px; }

/* Значок выхода виден всегда, подпись — только в раскрытом виде */
.ea-side-out { display: flex; align-items: center; gap: 10px; }
.ea-side-out svg { width: 18px; height: 18px; flex: none; }

@media (max-width: 900px) {
	.ea-shell:has(.ea-cards-shell) .ea-side { width: auto; }
	.ea-shell:has(.ea-cards-shell) .ea-side span,
	.ea-shell:has(.ea-cards-shell) .ea-side .ea-side-me div { opacity: 1; }
}
/* Правка карточки прямо в строке набора */
.ea-card-edit { display: grid; grid-template-columns: 1fr 1fr auto auto; gap: 8px; align-items: center; width: 100%; }
.ea-card-edit .ea-input { min-width: 0; }
@media (max-width: 700px) { .ea-card-edit { grid-template-columns: 1fr 1fr; } .ea-card-edit .ea-btn { grid-column: span 1; } }

/* Подбор пар */
.ea-match { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: var(--ea-s4); }
.ea-match-col { display: flex; flex-direction: column; gap: 8px; }
.ea-match-cell { justify-content: center; text-align: center; }
.ea-match-cell.is-picked { box-shadow: inset 0 0 0 2px var(--ea-coral, #f05a3c); }
/* Иконка «Настройки» стоит вне <nav>, и правило для nav svg её не ловило —
   картинка растягивалась на всю ширину колонки (нашёл Василий на скриншоте). */
.ea-cards-nav svg { width: 16px; height: 16px; flex: none; }
.ea-cards-settings { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 9px; font-size: 14px; }
.ea-cards-settings:hover { background: var(--ea-canvas, #f7f6f2); }
.ea-cards-settings.is-active { background: var(--ea-coral, #f05a3c); color: #fff; }

/* Аватар в свёрнутой полосе: не сплющивается и не растягивается */
.ea-side-me img { flex: none; width: 32px; height: 32px; object-fit: cover; border-radius: 50%; }
/* Аватар сжимался флексом до полоски 8 px: фиксируем размер жёстко */
.ea-shell .ea-side .ea-side-me img {
	flex: 0 0 32px; min-width: 32px; width: 32px; height: 32px;
	object-fit: cover; border-radius: 50%;
}