/* ===== Дизайн-система, вариант A «Тёплый личный» ===== */
:root {
  --bg: #FFF6F1;
  --card: #FFFFFF;
  --ink: #2E2424;
  --ink-soft: #6E5F5C;
  --ink-faint: #79625F;
  --coral: #F87575;
  --coral-soft: #FFE3E1;
  --melon: #FFA9A3;
  --sky: #B9E6FF;
  --sky-soft: #DFF1FF;
  --corn: #5C95FF;
  --line: #EBD9D2;
  --sun-soft: #FFF0C9;
  --ok-bg: #E7F4EC;
  --ok-ink: #2F6E4A;
  --radius: 18px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  /* Место под скроллбар зарезервировано всегда: иначе на короткой странице
     он исчезает, ширина контента прыгает и текст «дрожит» при переходах. */
  scrollbar-gutter: stable;
}
body {
  font-family: 'Manrope', 'Segoe UI', sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
}
.container { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { letter-spacing: -0.02em; }
h2 { font-size: 34px; font-weight: 800; margin-bottom: 14px; }
.section { padding: 72px 0; }
.section-tint { background: #FDEFE8; }
.section-sub { color: var(--ink-soft); max-width: 560px; margin-bottom: 34px; }

/* ===== Header ===== */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 246, 241, 0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
.header-row { display: flex; align-items: center; justify-content: space-between; padding-top: 14px; padding-bottom: 14px; }
.logo { font-weight: 800; font-size: 19px; }
.logo .dot { color: var(--coral); }
.main-nav { display: flex; gap: 26px; font-size: 14.5px; font-weight: 600; color: var(--ink-soft); }
.main-nav a:hover { color: var(--ink); }
.header-cta { display: flex; align-items: center; gap: 16px; }
.login-soon { font-size: 14.5px; font-weight: 700; color: var(--ink-faint); cursor: default; }
a.login-soon { cursor: pointer; }
a.login-soon:hover { color: var(--ink); }

/* ===== Кнопки ===== */
.btn {
  display: inline-block; border: none; cursor: pointer;
  font-family: inherit; font-weight: 800; font-size: 16px;
  padding: 16px 28px; border-radius: 15px; transition: transform .12s ease, box-shadow .12s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--ink); color: #fff; box-shadow: 0 10px 24px rgba(46, 36, 36, 0.25); }
.btn-ghost { background: var(--card); color: var(--ink); border: 1.5px solid var(--line); font-weight: 700; }
.btn-small { background: var(--coral); color: #332424; font-size: 14px; padding: 10px 18px; border-radius: 12px; }

/* ===== Hero ===== */
.hero { padding: 64px 0 84px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 48px; align-items: center; }
.badge {
  display: inline-block; background: var(--card); border: 1px solid #F3E3DC;
  color: var(--ink-faint); font-size: 12.5px; font-weight: 700; letter-spacing: 0.06em;
  padding: 8px 16px; border-radius: 999px; margin-bottom: 22px;
}
.hero h1 { font-size: 54px; line-height: 1.08; font-weight: 800; margin-bottom: 18px; }
.hero h1 em { font-style: normal; color: var(--coral); }
.sub { font-size: 18px; color: var(--ink-soft); max-width: 520px; margin-bottom: 28px; }
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-note { display: flex; align-items: center; gap: 9px; margin-top: 18px; font-size: 14px; font-weight: 600; color: var(--ink-faint); }
.dot-marker { width: 8px; height: 8px; border-radius: 50%; background: var(--corn); display: inline-block; }

.hero-visual { position: relative; display: flex; flex-direction: column; align-items: center; }
/* Мокап кабинета: продукт вместо абстрактного круга */
.hero-mock {
  width: min(440px, 100%); background: var(--card); border-radius: 20px;
  box-shadow: 0 24px 60px rgba(176, 74, 68, 0.15); padding: 0 0 18px; overflow: hidden;
  position: relative; z-index: 2;
}
.hm-head { display: flex; align-items: center; gap: 6px; background: #FDF6F1; border-bottom: 1px solid #F3E3DC; padding: 12px 16px; }
.hm-dot { width: 9px; height: 9px; border-radius: 50%; background: #EBD9D2; }
.hm-title { margin-left: 8px; font-size: 12.5px; font-weight: 700; color: var(--ink-faint); }
.hm-row { display: flex; align-items: center; gap: 11px; padding: 11px 16px; border-bottom: 1px solid #F9F0EA; }
.hm-row .skill-chip { font-size: 11px; padding: 5px 10px; }
.hm-text { flex: 1; font-size: 13.5px; font-weight: 600; }
.hm-row.done .hm-text { color: var(--ink-faint); text-decoration: line-through; }
.hm-check {
  width: 21px; height: 21px; border-radius: 7px; border: 1.5px solid #CBB6AE; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff;
}
.hm-check.checked { background: var(--coral); border-color: var(--coral); }
.hm-chart { padding: 12px 16px 0; }
.hm-chart svg { width: 100%; height: 56px; }
.hm-chart-caption { font-size: 12px; font-weight: 700; color: var(--ink-faint); margin-top: 4px; }
.portrait-initials { color: #fff; font-size: 64px; font-weight: 800; }
.portrait-caption { margin-top: 16px; font-size: 13.5px; font-weight: 600; color: var(--ink-soft); text-align: center; position: relative; z-index: 2; }
.chip {
  position: absolute; z-index: 3; background: var(--card); border-radius: 15px;
  padding: 12px 16px; box-shadow: 0 12px 28px rgba(59, 46, 46, 0.14);
  display: flex; align-items: center; gap: 11px; font-size: 12px; color: var(--ink-faint);
}
.chip b { display: block; font-size: 13.5px; color: var(--ink); }
.chip small { font-weight: 600; }
.chip-ico { width: 34px; height: 34px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-weight: 800; }
.ico-ok { background: var(--sky-soft); color: #3D6FD6; font-size: 15px; }
.chip-lesson { right: -14px; top: -34px; }

/* ===== Шаги ===== */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 30px; }
.step { background: var(--card); border-radius: var(--radius); padding: 24px 20px; box-shadow: 0 4px 16px var(--glow, rgba(176, 74, 68, 0.07)); }
.step:hover { transform: translateY(-4px); box-shadow: 0 10px 26px var(--glow-h, rgba(176, 74, 68, 0.13)); }
.step-num {
  display: inline-flex; width: 34px; height: 34px; border-radius: 50%;
  background: var(--coral-soft); color: #B04A44; font-weight: 800;
  align-items: center; justify-content: center; margin-bottom: 14px;
}
.step h3 { font-size: 17px; margin-bottom: 7px; }
.step p { font-size: 14px; color: var(--ink-soft); }

/* ===== Карточки платформы и отзывов ===== */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.card { background: var(--card); border-radius: var(--radius); padding: 26px 22px; box-shadow: 0 4px 16px var(--glow, rgba(176, 74, 68, 0.07)); }
.card-ico { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.card-ico svg { width: 20px; height: 20px; }
.i1 { background: var(--coral-soft); color: #B04A45; }
.i2 { background: var(--sky-soft); color: #2B5E8C; }
.i3 { background: var(--sun-soft); color: #9A5B2B; }
.i4 { background: #EDE8FF; color: #5A4A9E; }
.card h3 { font-size: 17px; margin-bottom: 7px; }
.card p { font-size: 14px; color: var(--ink-soft); }
.review { display: flex; flex-direction: column; box-shadow: 0 6px 22px var(--glow, rgba(176, 74, 68, 0.09)); }
.review.bg1 { background: #FCEBDD; }
.review.bg2 { background: #E8F2FA; }
/* .review .review-text — иначе .card p (0-1-1) перебивает размер и цвет */
.review .review-text { font-size: 14.5px; line-height: 1.62; color: var(--ink); margin-bottom: 14px; }
.review-shot { display: block; margin-bottom: 13px; }
.review-shot img { display: block; width: 100%; max-height: 240px; object-fit: cover; object-position: top; border-radius: 12px; border: 1px solid var(--line); }
.review-foot { display: flex; align-items: center; gap: 9px; margin-top: auto; }
.review-ava {
  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px;
}
.review-ava.a0 { background: var(--coral-soft); color: #B04A44; }
.review-ava.a1 { background: var(--sky-soft); color: #2B5E8C; }
.review-ava.a2 { background: var(--sun-soft); color: #9A5B2B; }
.review-ava.a3 { background: #EDE8FF; color: #5A4A9E; }
.review-ava.a4 { background: #E4F3E6; color: #3E7A4C; }
.review-author { font-size: 13.5px; font-weight: 700; color: var(--ink-faint); }
.review-chip {
  margin-left: auto; white-space: nowrap; flex-shrink: 0;
  background: var(--card); border: 1.5px solid var(--coral); color: #B04A44;
  font-weight: 800; font-size: 12px; padding: 3px 10px; border-radius: 999px;
}

/* Лента отзывов: едет сама, замирает под курсором, на телефоне — свайп руками */
.reviews-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); padding: 6px 0 10px; }
.reviews-track { display: flex; width: max-content; }
.reviews-track .review { width: 380px; flex-shrink: 0; margin-right: 18px; }
@media (prefers-reduced-motion: no-preference) and (min-width: 961px) {
  .reviews-track { animation: reviews-scroll 70s linear infinite; }
  .reviews-marquee:hover .reviews-track { animation-play-state: paused; }
}
@keyframes reviews-scroll { to { transform: translateX(-50%); } }
@media (max-width: 960px), (prefers-reduced-motion: reduce) {
  .reviews-marquee { overflow-x: auto; scroll-snap-type: x mandatory; padding-left: 24px; scrollbar-width: none; }
  .reviews-marquee::-webkit-scrollbar { display: none; }
  .reviews-track .review { width: min(340px, 82vw); scroll-snap-align: start; }
  .reviews-track > [aria-hidden="true"] { display: none; }  /* дубли нужны только автоленте */
}

/* ===== О преподавателе ===== */
.about-grid { display: grid; grid-template-columns: 280px 1fr; gap: 48px; align-items: center; }
.about-photo {
  width: 260px; height: 260px; border-radius: 28px;
  background: linear-gradient(145deg, var(--melon), var(--coral));
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 34px rgba(248, 117, 117, 0.3);
}
.about-photo .portrait-initials { font-size: 56px; }
.about-text { color: var(--ink-soft); margin-bottom: 20px; max-width: 620px; }
.about-text p { font-size: 16px; line-height: 1.66; margin: 0 0 14px; }
.about-text p:last-child { margin-bottom: 0; }
.about-text .about-lede { font-size: 17.5px; line-height: 1.6; color: var(--ink); }
.about-text .hl {
  font-weight: 700; color: var(--ink);
  background: linear-gradient(transparent 62%, rgba(248, 117, 117, 0.28) 62%);
  padding: 0 1px;
}
[data-theme="dark"] .about-text .hl { background: linear-gradient(transparent 62%, rgba(248, 117, 117, 0.36) 62%); }
.chips-row { display: flex; gap: 10px; flex-wrap: wrap; }
.chips-row .skill-chip:hover { transform: translateY(-2px); }
.skill-chip { font-size: 13px; font-weight: 800; padding: 8px 15px; border-radius: 999px; }
.c-l { background: var(--sky-soft); color: #2B5E8C; }
.c-r { background: #E4ECFF; color: #33549E; }
.c-w { background: var(--coral-soft); color: #B04A45; }
.c-s { background: #FFEAD9; color: #9A5B2B; }

/* ===== FAQ ===== */
.faq-wrap { max-width: 760px; }
.faq-wrap details { background: var(--card); border-radius: 15px; margin-top: 12px; box-shadow: 0 3px 12px rgba(176, 74, 68, 0.06); }
.faq-wrap summary {
  font-weight: 700; cursor: pointer; font-size: 16px; list-style: none;
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 18px 22px;  /* кликается вся карточка, не полоска текста */
}
.faq-wrap details > p { padding: 0 22px 18px; }
.faq-wrap summary::-webkit-details-marker { display: none; }
.faq-wrap summary::after {
  content: ''; width: 9px; height: 9px; flex-shrink: 0; margin-right: 4px;
  border-right: 2px solid var(--ink-faint); border-bottom: 2px solid var(--ink-faint);
  transform: rotate(45deg) translateY(-2px);
  transition: transform var(--t-mid) var(--ease), border-color var(--t-fast) var(--ease);
}
.faq-wrap details[open] summary::after { transform: rotate(-135deg) translateY(-2px); border-color: var(--coral); }
.faq-wrap details p { margin-top: 10px; color: var(--ink-soft); font-size: 15px; }

/* Плавное раскрытие ответа: высота анимируется от 0 до auto */
:root { interpolate-size: allow-keywords; }
@media (prefers-reduced-motion: no-preference) {
  .faq-wrap details::details-content {
    block-size: 0; overflow: hidden;
    transition: block-size var(--t-mid) var(--ease), content-visibility var(--t-mid) allow-discrete;
  }
  .faq-wrap details[open]::details-content { block-size: auto; }
}

/* ===== Переходы между страницами ===== */
/* Переход между страницами — только прозрачность: сдвиг по Y заставляет
   текст перерисовываться в субпиксельных позициях, отсюда «дрожание». */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vt-fade .18s var(--ease) reverse both; }
::view-transition-new(root) { animation: vt-fade .28s var(--ease) both; }
@keyframes vt-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
.field-bad { border-color: #D94F4F !important; border-width: 2px !important; box-shadow: 0 0 0 3px rgba(217, 79, 79, 0.22) !important; }

/* ===== Тосты ошибок ===== */
#toast-root { position: fixed; top: 18px; left: 50%; transform: translateX(-50%); z-index: 200; width: min(480px, 92vw); display: flex; flex-direction: column; gap: 10px; }
.toast {
  background: var(--card); color: var(--ink); border: 1.5px solid var(--coral);
  border-left: 6px solid var(--coral); border-radius: 14px; padding: 14px 44px 14px 18px;
  font-size: 14.5px; font-weight: 600; box-shadow: 0 16px 40px rgba(59, 46, 46, 0.22);
  position: relative; animation: toast-in .3s ease;
}
.toast.gone { opacity: 0; transform: translateY(-8px); transition: opacity .5s ease, transform .5s ease; }
.toast-x { position: absolute; top: 8px; right: 10px; background: none; border: none; cursor: pointer; font-size: 20px; color: var(--ink-faint); }
.toast-x:hover { color: var(--ink); }
@keyframes toast-in { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }

/* ===== Плавность повсюду =====
   Тайминги ощутимые: быстрые переходы читаются как «дёрганье».
   Кривая ease-out-quart — движение мягко тормозит в конце. */
:root { --ease: cubic-bezier(0.22, 0.61, 0.36, 1); --t-fast: .28s; --t-mid: .45s; --t-slow: .7s; }
/* Один слой анимации на переход страницы (ниже, во view-transition) —
   без сдвигов внутренних блоков: наложение слоёв и давало «дрожь». */
@keyframes page-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .login-card { animation: page-in var(--t-mid) var(--ease) both; }
}
.btn:active, .slot-btn:active, .quick:active, .check-btn:active { transform: scale(0.96); transition-duration: .1s; }
a, button, select, input, textarea, summary, .card, .step, .cab-card, .stat-tile, .slot-btn, .quick, .skill-chip, .goal-chip span {
  transition: color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease);
}
.section .card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px var(--glow-h, rgba(176, 74, 68, 0.13)); }
.slot-btn:hover, .quick:hover { transform: translateY(-2px); }
.leads-table tbody tr { transition: background-color var(--t-fast) var(--ease); }
.leads-table tbody tr:hover { background: #FDF6F1; }
.fab-panel.open { animation: page-in var(--t-mid) var(--ease); }
.fade-el { transition: opacity var(--t-slow) var(--ease) calc(var(--i, 0) * 70ms),
                       transform var(--t-slow) var(--ease) calc(var(--i, 0) * 70ms) !important; }

/* ===== Доступность и движение ===== */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 3px solid rgba(92, 149, 255, 0.55); outline-offset: 2px; border-radius: 8px;
}
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .fade-el { opacity: 0; transform: translateY(22px); }
  .fade-el.vis { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; transition-delay: 0s !important; animation-duration: .01ms !important; }
  html { scroll-behavior: auto; }
}

/* ===== Кнопка «Войти» и модалка входа ===== */
.login-link { font-family: inherit; font-size: 14.5px; font-weight: 700; color: var(--ink); background: none; border: none; cursor: pointer; padding: 4px 2px; }
.login-link:hover { color: var(--coral); }
.login-dialog {
  margin: auto; position: relative;
  border: none; border-radius: 22px; padding: 34px 32px 28px; width: min(420px, 92vw);
  background: var(--card); color: var(--ink); box-shadow: 0 24px 70px rgba(59, 46, 46, 0.3);
  font-family: 'Manrope', 'Segoe UI', sans-serif;
}
.login-dialog::backdrop { background: rgba(59, 46, 46, 0.35); backdrop-filter: blur(6px); }
/* появление и закрытие модалки — без рывка */
@media (prefers-reduced-motion: no-preference) {
  .login-dialog { animation: dlg-in var(--t-mid) var(--ease); }
  .login-dialog::backdrop { animation: fade-in var(--t-mid) var(--ease); }
  .login-dialog.closing { animation: dlg-out .3s var(--ease) forwards; }
  .login-dialog.closing::backdrop { animation: fade-out .3s var(--ease) forwards; }
}
@keyframes dlg-in { from { opacity: 0; transform: translateY(18px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes dlg-out { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(10px) scale(.98); } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes fade-out { from { opacity: 1; } to { opacity: 0; } }
.login-dialog h3 { font-size: 21px; font-weight: 800; margin-bottom: 6px; }
.dialog-sub { font-size: 14px; color: var(--ink-soft); margin-bottom: 18px; }
.dialog-close {
  position: absolute; top: 14px; right: 16px; background: none; border: none; cursor: pointer;
  font-size: 22px; line-height: 1; color: var(--ink-faint); padding: 4px;
}
.dialog-close:hover { color: var(--ink); }
.dialog-alt { margin-top: 16px; font-size: 13px; color: var(--ink-faint); }
.dialog-alt a { color: var(--corn); text-decoration: underline; }

/* ===== Чипы цели в форме ===== */
.goal-chips { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.goal-chip input { position: absolute; opacity: 0; pointer-events: none; }
.goal-chip span {
  display: inline-block; font-size: 14px; font-weight: 700; color: var(--ink-soft);
  background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 999px;
  padding: 11px 18px; cursor: pointer; transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.goal-chip:hover span { border-color: var(--melon); }
.goal-chip input:checked + span { background: var(--coral-soft); border-color: var(--coral); color: #B04A45; }
.goal-chip input:focus-visible + span { box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.25); }

/* ===== Поля файла и времени ===== */
input[type="file"] {
  font-family: inherit; font-size: 14px; color: var(--ink-soft);
  background-color: #FFFDFC; border: 1.5px dashed var(--line); border-radius: 12px;
  padding: 12px 14px; width: 100%; cursor: pointer;
}
input[type="file"]:hover { border-color: var(--melon); background: #FFF9F6; }
input[type="file"]::file-selector-button {
  font-family: inherit; font-size: 13.5px; font-weight: 800; cursor: pointer;
  background: var(--coral-soft); color: #B04A45; border: none;
  border-radius: 9px; padding: 9px 15px; margin-right: 12px;
  transition: background-color var(--t-fast) var(--ease);
}
input[type="file"]::file-selector-button:hover { background: var(--melon); color: #5C3532; }

input[type="time"], input[type="date"], input[type="number"] {
  font-family: inherit; font-size: 14px; color: var(--ink);
  background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 11px;
  padding: 10px 13px;
}
input[type="time"]:focus, input[type="date"]:focus, input[type="number"]:focus {
  outline: none; border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.16);
}
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: .55; cursor: pointer; transition: opacity var(--t-fast) var(--ease);
}
input[type="time"]::-webkit-calendar-picker-indicator:hover,
input[type="date"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* ===== Колокольчик ===== */
.bell-wrap { position: relative; }
.bell {
  position: relative; width: 38px; height: 38px; border-radius: 12px; cursor: pointer;
  background: transparent; border: 1.5px solid var(--line); color: var(--ink-soft);
  display: flex; align-items: center; justify-content: center;
}
.bell:hover { border-color: var(--melon); color: var(--ink); }
.bell svg { width: 18px; height: 18px; }
.bell-dot {
  position: absolute; top: -6px; right: -6px; min-width: 19px; height: 19px; padding: 0 5px;
  background: var(--coral); color: #332424; border-radius: 999px;
  font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center;
  animation: bell-pop .5s var(--ease) both;
}
@keyframes bell-pop { from { transform: scale(0); } 70% { transform: scale(1.15); } to { transform: scale(1); } }
.bell-panel {
  position: absolute; right: 0; top: 48px; width: min(320px, 84vw); z-index: 95;
  background: var(--card); border-radius: 16px; padding: 16px 18px;
  box-shadow: 0 18px 44px rgba(59, 46, 46, 0.2); border: 1px solid #F3E3DC;
  opacity: 0; transform: translateY(-8px) scale(.98); pointer-events: none;
  transition: opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease);
}
.bell-panel.open { opacity: 1; transform: none; pointer-events: auto; }
.bell-list { list-style: none; margin-bottom: 12px; }
.bell-item { font-size: 14px; font-weight: 600; padding: 9px 0; border-bottom: 1px solid #F6ECE7; }
.bell-item:last-child { border-bottom: none; }
.bell-review { color: var(--ok-ink); }
.bell-task { color: #B04A45; }

/* ===== Селекты (админка и кабинеты): своя стрелка ===== */
select {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%238A7370' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
  padding-right: 34px !important;
}

/* ===== Форма пробного ===== */
.trial-box {
  background: var(--card); border-radius: 26px; padding: 48px;
  box-shadow: 0 14px 40px rgba(211, 122, 78, 0.14); text-align: center;
}
.trial-box .section-sub { margin: 0 auto 28px; }
.trial-form { display: flex; flex-direction: column; gap: 18px; align-items: center; }
.form-row { display: flex; gap: 12px; width: 100%; max-width: 760px; }
.trial-form input[type="text"], .trial-form select {
  flex: 1; font-family: inherit; font-size: 15px; color: var(--ink);
  background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 14px; padding: 15px 18px;
}
.trial-form input:focus, .trial-form select:focus {
  outline: none; border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.18);
}
.consent { font-size: 13px; color: var(--ink-faint); display: flex; gap: 8px; align-items: flex-start; text-align: left; max-width: 420px; margin: 0 auto; }
.consent input { margin-top: 2px; flex-shrink: 0; width: 16px; height: 16px; accent-color: var(--coral); }
.consent a { color: var(--corn); text-decoration: underline; }
.sent-ok { background: var(--ok-bg); color: var(--ok-ink); font-weight: 700; border-radius: 14px; padding: 18px 24px; display: inline-block; }

/* ===== Footer ===== */
.site-footer { border-top: 1px solid var(--line); padding: 40px 0 22px; background: #FDF3ED; }
.footer-cols { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 32px; }
.footer-col { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
.footer-about { font-size: 13.5px; color: var(--ink-soft); max-width: 320px; line-height: 1.55; }
.footer-h { font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-faint); margin-bottom: 3px; }
.footer-col a { font-size: 14px; font-weight: 600; color: var(--ink-soft); }
.footer-col a:hover { color: var(--ink); }
.footer-bottom { margin-top: 28px; padding-top: 16px; border-top: 1px solid #F3E3DC; font-size: 12.5px; color: var(--ink-faint); }
@media (max-width: 960px) { .footer-cols { grid-template-columns: 1fr; gap: 24px; } }

/* ===== Служебные страницы ===== */
.legal { padding: 64px 24px; max-width: 760px; }
.legal h1 { font-size: 30px; margin-bottom: 18px; }
.legal p { color: var(--ink-soft); margin-bottom: 14px; }
.legal-h { font-size: 19px; font-weight: 800; margin: 26px 0 10px; }
.legal-pre { white-space: pre-line; }
.legal-list { list-style: none; }
.legal-list li { padding: 7px 0; }
.legal-list a { color: var(--corn); text-decoration: underline; font-weight: 600; }

.teacher { padding: 48px 24px; }
.teacher h1 { font-size: 28px; margin-bottom: 22px; }
.empty { color: var(--ink-soft); }
.leads-table { width: 100%; border-collapse: collapse; background: var(--card); border-radius: var(--radius); overflow: hidden; box-shadow: 0 4px 16px rgba(176, 74, 68, 0.07); }
/* На телефоне широкие таблицы скроллятся внутри себя, не ломая страницу
   (Наталья ведёт учеников с телефона в дороге) */
@media (max-width: 960px) {
  .leads-table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  .leads-table td, .leads-table th { min-width: 90px; }
}
.leads-table th, .leads-table td { text-align: left; padding: 13px 16px; font-size: 14.5px; border-bottom: 1px solid #F6ECE7; }
.leads-table th { font-size: 12.5px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-faint); background: #FDF6F1; }
.status { font-size: 12.5px; font-weight: 800; padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.status-new { background: var(--coral-soft); color: #B04A45; }
.status-contacted { background: var(--sun-soft); color: #9A5B2B; }
.status-trial_scheduled { background: var(--sky-soft); color: #2B5E8C; }
.status-active { background: var(--ok-bg); color: var(--ok-ink); }
.status-closed { background: #EFE9E6; color: var(--ink-faint); }
.status-form { display: flex; gap: 8px; align-items: center; }
.status-form select { font-family: inherit; font-size: 13.5px; border: 1.5px solid var(--line); border-radius: 10px; padding: 8px 10px; background-color: #FFFDFC; }

/* ===== Вход ученика ===== */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; }
.login-card { background: var(--card); border-radius: 26px; padding: 44px 40px; max-width: 420px; width: 100%; box-shadow: 0 14px 40px rgba(176, 74, 68, 0.12); text-align: center; }
.login-card .logo { display: inline-block; margin-bottom: 22px; }
.login-card h1 { font-size: 26px; margin-bottom: 8px; }
.login-sub { color: var(--ink-soft); font-size: 15px; margin-bottom: 22px; }
.login-error { background: var(--coral-soft); color: #B04A45; font-size: 14px; font-weight: 700; border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; }
.login-form { display: flex; flex-direction: column; gap: 14px; }
.login-form input { font-family: inherit; font-size: 18px; text-align: center; letter-spacing: 0.15em; text-transform: uppercase; background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 14px; padding: 15px 18px; }
.login-form input::placeholder { text-transform: none; letter-spacing: normal; font-size: 15px; }
/* обычная форма (логин/пароль преподавателя) — без стиля кода доступа */
.login-form-plain input { font-size: 15px; text-align: left; letter-spacing: normal; text-transform: none; }
.login-form input:focus { outline: none; border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.18); }
.login-note { margin-top: 18px; font-size: 13px; color: var(--ink-faint); }

/* ===== Кабинет (ученик и преподаватель) ===== */
/* Подчёркивание не меняет высоту пункта: рамка есть у всех, цвет — у активного.
   Иначе высота шапки скачет от страницы к странице и контент «дрожит». */
.main-nav a { padding-bottom: 3px; border-bottom: 2px solid transparent; }
.cab-nav .nav-active { color: var(--ink); border-bottom-color: var(--coral); }
.cab { padding: 40px 24px 64px; }
.cab-title { font-size: 30px; margin-bottom: 6px; }
.cab-goal { color: var(--ink-soft); font-weight: 600; margin-bottom: 24px; }
.cab-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 18px; margin-top: 20px; align-items: start; }
.cab-card { background: var(--card); border-radius: var(--radius); padding: 24px 22px; box-shadow: 0 4px 16px rgba(176, 74, 68, 0.07); margin-bottom: 18px; }
.cab-card h2 { font-size: 18px; margin-bottom: 14px; }
.cab-card h2.mt, h2.mt { margin-top: 22px; }
.cab-link { color: #4A7DE0; font-weight: 700; font-size: 14.5px; }
.muted { color: var(--ink-faint); font-size: 14px; }
.mt { margin-top: 22px; }

.task-list { list-style: none; }
.task-list li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #F6ECE7; }
.task-list li:last-child { border-bottom: none; }
.task-list li.done .task-title { color: var(--ink-faint); text-decoration: line-through; }
.task-title { flex: 1; font-size: 15px; font-weight: 600; }
.check-btn { width: 26px; height: 26px; border-radius: 9px; border: 1.5px solid #CBB6AE; background-color: #FFFDFC; cursor: pointer; font-size: 14px; font-weight: 800; color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.check-btn.checked { background: var(--coral); border-color: var(--coral); }
.check-btn.static { cursor: default; }
.skill-chip.sc-listening { background: var(--sky-soft); color: #2B5E8C; }
.skill-chip.sc-reading { background: #E4ECFF; color: #33549E; }
.skill-chip.sc-writing { background: var(--coral-soft); color: #B04A45; }
.skill-chip.sc-speaking { background: #FFEAD9; color: #9A5B2B; }
.skill-chip.sc-general { background: #EFE9E6; color: var(--ink-faint); }
.task-list .skill-chip { font-size: 11.5px; padding: 6px 11px; }

.bar { height: 10px; border-radius: 999px; background: #F1E2DA; border: 1px solid var(--line); overflow: hidden; margin-bottom: 8px; }
.bar-wide { margin-top: 14px; }
.bar-fill { height: 100%; background: linear-gradient(90deg, var(--coral), var(--melon)); border-radius: 999px; }

.band-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.band { font-size: 13px; font-weight: 800; padding: 7px 12px; border-radius: 10px; }
.b-l { background: var(--sky-soft); color: #2B5E8C; }
.b-r { background: #E4ECFF; color: #33549E; }
.b-w { background: var(--coral-soft); color: #B04A45; }
.b-s { background: #FFEAD9; color: #9A5B2B; }
.b-o { background: var(--ink); color: #fff; }

.chart-legend { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 12px; }
.legend-item { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--ink-soft); }
.legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.chart-wrap { overflow-x: auto; }
.chart-wrap svg { width: 100%; max-width: 640px; height: auto; }

/* ===== Админка: формы и мелочи ===== */
.inline-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.inline-form input[type="text"], .inline-form select, .mock-form input, .mock-form select {
  font-family: inherit; font-size: 14px; background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 11px; padding: 10px 13px;
}
.inline-form input[type="text"] { flex: 1; min-width: 160px; }
.mock-form { display: flex; flex-direction: column; gap: 10px; }
.mock-bands { display: flex; gap: 8px; }
.mock-bands input { width: 64px; text-align: center; }
.invite-box { background: var(--sun-soft); border-radius: 14px; padding: 14px 18px; font-size: 14px; margin: 14px 0 24px; }

/* Правка данных ученика: свёрнута в строку под шапкой, раскрывается формой */
.edit-student { margin: -6px 0 14px; }
.edit-student summary { cursor: pointer; font-size: 14px; list-style: none; width: fit-content; }
.edit-student summary::-webkit-details-marker { display: none; }
.edit-student-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 14px; align-items: end; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin-top: 10px; max-width: 760px; }
.edit-student-form label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: var(--ink-soft); font-weight: 600; }
.edit-student-form input, .edit-student-form select { padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; background-color: var(--bg); color: var(--ink); font: inherit; font-size: 14px; }
.edit-student-form button { justify-self: start; }
.leads-filter { margin: -8px 0 14px; }
.students-search { display: flex; gap: 10px; align-items: center; margin: 0 0 16px; }
.students-search input { flex: 0 1 320px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background-color: var(--card); color: var(--ink); font: inherit; font-size: 14px; }

/* Тизер мини-теста уровня на лендинге */
.quiz-teaser { display: flex; gap: 28px; align-items: center; justify-content: space-between; background: var(--card); border: 1px solid var(--line); border-radius: 22px; padding: 34px 38px; box-shadow: 0 10px 34px -22px var(--glow, rgba(248, 117, 117, 0.35)); }
.quiz-teaser h2 { margin-bottom: 8px; }
.quiz-teaser-cta { display: flex; flex-direction: column; gap: 8px; align-items: center; flex-shrink: 0; }
@media (max-width: 720px) {
  .quiz-teaser { flex-direction: column; align-items: flex-start; padding: 26px 22px; }
  .quiz-teaser-cta { align-items: flex-start; }
}
.invite-box code { background: #fff; border-radius: 7px; padding: 3px 8px; font-weight: 700; }
.teacher-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 24px; align-items: start; }
.block-title { font-size: 20px; margin-bottom: 14px; }
.module-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.module-head h3 { font-size: 16.5px; }
.link-danger { background: none; border: none; cursor: pointer; color: #B04A45; font-family: inherit; font-size: 13px; font-weight: 700; }
.btn-convert { background: var(--sky-soft); color: #2B5E8C; }
.task-list form { display: flex; }
.leads-table code { background: #FDF6F1; border-radius: 7px; padding: 3px 8px; font-weight: 700; }

/* ===== Полоса фактов на лендинге ===== */
.facts-strip { background: var(--ink); color: #fff; padding: 26px 0; }
.facts-row { display: flex; gap: 14px; justify-content: space-between; flex-wrap: wrap; }
.fact { display: flex; flex-direction: column; gap: 2px; min-width: 150px; }
/* моноширинные цифры всегда: во время бега счётчика и после него ширина одинаковая — ничего не дёргается */
.fact-value { font-size: 26px; font-weight: 800; color: var(--melon); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.fact-label { font-size: 13px; font-weight: 600; color: rgba(255, 255, 255, 0.75); }

/* ===== Экран практики (computer-delivered стиль) ===== */
.practice-bar { position: sticky; top: 0; z-index: 60; background: var(--ink); color: #fff; padding: 12px 0; }
.practice-bar-row { display: flex; align-items: center; gap: 18px; justify-content: space-between; flex-wrap: wrap; }
.practice-back { font-size: 14px; font-weight: 700; color: rgba(255,255,255,.8); }
.practice-back:hover { color: #fff; }
.practice-title { font-size: 15.5px; font-weight: 800; display: flex; align-items: center; gap: 10px; }
.practice-kind { font-size: 12px; font-weight: 700; background: rgba(255,255,255,.16); padding: 5px 10px; border-radius: 999px; }
.practice-meta { display: flex; align-items: center; gap: 14px; }
.timer, .wordcount { font-size: 14px; font-weight: 800; padding: 7px 13px; border-radius: 10px; background: rgba(255,255,255,.14); }
.timer.low { background: var(--coral); color: #332424; }
.timer.over { background: #B04A45; color: #fff; }
.wordcount.ok { background: #2F6E4A; }

.practice-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 1400px; margin: 0 auto; padding: 20px 24px 40px; align-items: start; }
.practice-pane { background: var(--card); border-radius: var(--radius); padding: 22px 24px; box-shadow: 0 4px 16px rgba(176, 74, 68, 0.07); }
.practice-left { max-height: calc(100vh - 140px); overflow-y: auto; }
.pane-tools { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.tool-btn { font-family: inherit; font-size: 13px; font-weight: 700; background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 10px; padding: 8px 13px; cursor: pointer; }
.tool-btn.active { background: var(--sun-soft); border-color: #E8C56A; }
.tool-hint { font-size: 12px; color: var(--ink-faint); }
.task-prompt { font-size: 16px; font-weight: 700; line-height: 1.6; margin-bottom: 16px; white-space: pre-line; }
.task-passage { font-size: 15px; line-height: 1.75; color: var(--ink-soft); white-space: pre-line; }
.hl-mode { cursor: text; background: rgba(255, 240, 201, 0.25); border-radius: 10px; }
mark.user-hl { background: #FFE9A8; padding: 1px 2px; border-radius: 3px; }
#answer {
  width: 100%; min-height: 60vh; font-family: inherit; font-size: 15.5px; line-height: 1.7;
  border: 1.5px solid var(--line); border-radius: 14px; padding: 16px 18px; resize: vertical;
  background-color: #FFFDFC; color: var(--ink);
}
#answer:focus { outline: none; border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.16); }
.practice-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; flex-wrap: wrap; }
.draft-note { font-size: 12.5px; color: var(--ink-faint); }

/* ===== Домашка ===== */
.news-card { border-left: 5px solid var(--coral); }
.subs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); gap: 14px; align-items: start; }
.sub-card { margin-bottom: 0; }
.sub-card:has(.sub-comment) { border-left: 5px solid var(--ok-ink); }
.sub-title-link { color: var(--ink); }
.sub-title-link:hover b { color: #B04A45; }
.sub-body-clamp { max-height: 76px; overflow: hidden; }
.extra-submit summary { font-size: 15px; font-weight: 700; cursor: pointer; color: var(--ink-soft); }
.extra-submit summary:hover { color: var(--ink); }
.extra-submit { margin-bottom: 22px; }
.view-meta { display: flex; gap: 6px; flex-wrap: wrap; font-size: 13.5px; font-weight: 700; color: var(--ink-faint); margin-bottom: 12px; }
.view-body { font-size: 15.5px; line-height: 1.7; white-space: pre-line; background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.sub-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.sub-body { font-size: 14px; color: var(--ink-soft); white-space: pre-line; background: #FDF6F1; border-radius: 12px; padding: 12px 14px; margin: 8px 0; max-height: 220px; overflow-y: auto; }
.sub-comment { font-size: 14px; background: var(--ok-bg); color: var(--ok-ink); border-radius: 12px; padding: 12px 14px; margin-top: 8px; white-space: pre-line; }
.lesson-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

/* ===== Стат-тайлы дашборда ===== */
.stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 20px 0 4px; }
.stat-tile { background: var(--card); border-radius: 16px; padding: 18px 20px; box-shadow: 0 4px 16px rgba(176, 74, 68, 0.07); display: flex; flex-direction: column; gap: 3px; }
.stat-num { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; }
.stat-num small { font-size: 16px; color: var(--ink-faint); font-weight: 700; }
.stat-label { font-size: 12.5px; font-weight: 700; color: var(--ink-faint); }
.stat-hot { border-left: 4px solid var(--coral); box-shadow: 0 6px 22px rgba(176, 74, 68, 0.13); }
.stat-hot .stat-num { color: #B04A45; }

/* ===== Плавающий ассистент ===== */
.fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 90;
  width: 56px; height: 56px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--ink); color: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 28px rgba(46, 36, 36, 0.35); transition: transform .15s ease;
}
.fab:hover { transform: scale(1.06); }
.fab svg { width: 24px; height: 24px; }
.fab-panel {
  position: fixed; right: 22px; bottom: 90px; z-index: 89;
  width: min(390px, calc(100vw - 44px)); height: min(560px, calc(100vh - 130px));
  background: var(--card); border-radius: 18px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(59, 46, 46, 0.28);
  display: none;
}
.fab-panel.open { display: block; }
.fab-panel iframe { width: 100%; height: 100%; border: none; }
/* Внутри виджета скроллится только лента сообщений: страница в iframe
   не должна иметь собственную полосу прокрутки (иначе их видно две). */
html:has(.chat-embed), body:has(.chat-embed) { height: 100%; overflow: hidden; scrollbar-gutter: auto; }
.chat-embed {
  padding: 10px !important; max-width: none; height: 100%;
  display: flex; flex-direction: column; animation: none;
}
.chat-embed .cab-card {
  margin-bottom: 0; box-shadow: none; padding: 12px;
  flex: 1; display: flex; flex-direction: column; min-height: 0;
}
.chat-embed .chat-log { flex: 1; max-height: none; height: auto; min-height: 0; }

/* ===== Speaking-диктофон ===== */
.recorder-hint { font-size: 14.5px; color: var(--ink-soft); margin-bottom: 18px; line-height: 1.6; }
.recorder-main { display: flex; align-items: center; gap: 16px; }
.rec-time { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink); }
#rec-btn.recording { background: #B04A45; animation: rec-pulse 1.6s infinite; }
@keyframes rec-pulse { 0%, 100% { box-shadow: 0 10px 24px rgba(176, 74, 69, 0.3); } 50% { box-shadow: 0 10px 34px rgba(176, 74, 69, 0.55); } }

/* ===== AI-разбор работы ===== */
.ai-review { margin-top: 14px; border: 1.5px solid #E4D6F2; background: #FBF8FF; border-radius: 14px; padding: 14px 16px; }
.ai-review-head { font-size: 13px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: #6B4FA0; margin-bottom: 8px; }
.ai-review-body { font-size: 14px; line-height: 1.6; white-space: pre-line; color: var(--ink); }
.ai-review-note { font-size: 12px; color: var(--ink-faint); margin-top: 10px; }
.ai-review-details { margin-top: 10px; }
.ai-review-details summary { font-size: 13.5px; font-weight: 700; color: #6B4FA0; cursor: pointer; }
.ai-review-details .ai-review-body { margin-top: 8px; background: #FBF8FF; border-radius: 10px; padding: 10px 12px; }

/* ===== Занятия и слоты ===== */
.lesson-next { font-size: 17px; font-weight: 800; margin-bottom: 8px; }
.lesson-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.btn-small-ghost { font-size: 14px; padding: 10px 18px; }
.slot-day { margin-bottom: 16px; }
.slot-day-title { font-size: 14px; font-weight: 800; color: var(--ink-soft); margin-bottom: 8px; }
.slot-row { display: flex; gap: 8px; flex-wrap: wrap; }
.slot-row form { display: inline; }
.slot-btn { font-family: inherit; font-size: 14.5px; font-weight: 800; color: var(--ink); background: #fff; border: 1.5px solid var(--line); border-radius: 12px; padding: 10px 16px; cursor: pointer; }
.slot-btn:hover { border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.14); }

/* ===== Чат ассистента ===== */
.chat-page { max-width: 860px; }
.chat-card { display: flex; flex-direction: column; gap: 14px; }
.chat-log { display: flex; flex-direction: column; gap: 10px; max-height: 460px; overflow-y: auto; padding: 4px 2px; }
.msg { display: flex; }
.msg.user { justify-content: flex-end; }
.bubble { max-width: 78%; padding: 12px 16px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; white-space: pre-line; }
.msg.bot .bubble { background: #FDF6F1; border: 1px solid #F3E3DC; color: var(--ink); border-bottom-left-radius: 6px; }
.msg.user .bubble { background: var(--ink); color: #fff; border-bottom-right-radius: 6px; }
.msg { animation: msg-in .4s var(--ease) both; }
@keyframes msg-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.bubble.typing { display: flex; gap: 5px; align-items: center; padding: 15px 18px; }
.bubble.typing span {
  width: 7px; height: 7px; border-radius: 50%; background: var(--ink-faint);
  animation: typing-dot 1.3s infinite ease-in-out;
}
.bubble.typing span:nth-child(2) { animation-delay: .18s; }
.bubble.typing span:nth-child(3) { animation-delay: .36s; }
@keyframes typing-dot {
  0%, 60%, 100% { opacity: .3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-4px); }
}
.chat-input input:disabled { opacity: .6; }
.quick-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.quick { font-family: inherit; font-size: 13px; font-weight: 700; color: var(--ink); background: #fff; border: 1.5px solid var(--line); border-radius: 999px; padding: 9px 15px; cursor: pointer; }
.quick:hover { border-color: var(--coral); }
.chat-input { display: flex; gap: 10px; }
.chat-input input { flex: 1; font-family: inherit; font-size: 15px; background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 14px; padding: 13px 16px; }
.chat-input input:focus { outline: none; border-color: var(--coral); box-shadow: 0 0 0 3px rgba(248, 117, 117, 0.18); }
.chat-input .btn { padding: 13px 22px; }
.chat-note { font-size: 12px; color: var(--ink-faint); }

/* ===== Мини-тест уровня ===== */
.quiz-link { color: var(--corn); text-decoration: underline; font-weight: 700; }
.quiz-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 48px 20px; }
.quiz-card { background: var(--card); border-radius: 24px; padding: 40px 36px; max-width: 620px; width: 100%; box-shadow: 0 14px 40px rgba(176, 74, 68, 0.12); }
.quiz-logo { display: inline-block; margin-bottom: 20px; }
.quiz-card h1 { font-size: 27px; margin-bottom: 10px; }
.quiz-sub { color: var(--ink-soft); font-size: 15px; line-height: 1.6; margin-bottom: 22px; }
.quiz-progress { height: 8px; border-radius: 999px; background: #F6ECE7; overflow: hidden; margin-bottom: 10px; }
.quiz-progress-fill { height: 100%; background: linear-gradient(90deg, var(--coral), var(--melon)); border-radius: 999px; transition: width var(--t-mid) var(--ease); }
.quiz-counter { font-size: 12.5px; font-weight: 700; color: var(--ink-faint); margin-bottom: 14px; }
.quiz-question { font-size: 20px; font-weight: 800; margin-bottom: 18px; }
.quiz-options { display: flex; flex-direction: column; gap: 10px; }
.quiz-opt {
  font-family: inherit; font-size: 15.5px; font-weight: 600; text-align: left; cursor: pointer;
  background-color: #FFFDFC; border: 1.5px solid var(--line); border-radius: 13px; padding: 14px 17px;
}
.quiz-opt:hover { border-color: var(--coral); background: #FFF6F4; transform: translateY(-1px); }
.quiz-cta { margin-top: 20px; border-top: 1px solid #F6ECE7; padding-top: 18px; }
.quiz-cta p { font-size: 14.5px; margin-bottom: 14px; }

/* ===== Отчёт (экран + печать в PDF) ===== */
.report { max-width: 860px; padding: 32px 24px 48px; }
.report-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.report-head h1 { font-size: 30px; margin: 10px 0 4px; }
.report-stats { grid-template-columns: repeat(4, 1fr); margin: 22px 0; }
.report-section { margin-top: 26px; background: var(--card); border-radius: var(--radius); padding: 22px; box-shadow: 0 4px 16px rgba(176, 74, 68, 0.07); }
.report-section h2 { font-size: 19px; margin-bottom: 14px; }
.report-list { list-style: none; }
.report-list li { padding: 7px 0; border-bottom: 1px solid #F6ECE7; font-size: 14.5px; font-weight: 600; }
.report-list li:last-child { border-bottom: none; }
.report-sub { padding: 12px 0; border-bottom: 1px solid #F6ECE7; display: flex; flex-direction: column; gap: 4px; }
.report-sub:last-child { border-bottom: none; }
.report-comment { font-size: 13.5px; color: var(--ok-ink); background: var(--ok-bg); border-radius: 10px; padding: 9px 12px; }
.report-foot { margin-top: 30px; font-size: 12px; text-align: center; }
@media print {
  .no-print, .fab, .fab-panel, #toast-root { display: none !important; }
  body { background: #fff; }
  .report-section, .stat-tile { box-shadow: none; border: 1px solid #eee; }
  .report { padding: 0; }
  /* Печать всегда светлая, даже из тёмной темы */
  [data-theme="dark"] {
    --bg: #fff; --card: #fff; --ink: #2E2424; --ink-soft: #6E5F5C;
    --ink-faint: #79625F; --line: #EBD9D2; --coral-soft: #FFE3E1;
    --sky-soft: #DFF1FF; --sun-soft: #FFF0C9; --ok-bg: #E7F4EC; --ok-ink: #2F6E4A;
  }
}

/* ===== Словарь ===== */
.vocab-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.vocab-card { margin-bottom: 12px; }
.vocab-front { font-size: 16.5px; font-weight: 800; color: #B04A45; }
.vocab-back { font-size: 15px; font-weight: 600; margin-top: 3px; }
.vocab-example { font-size: 13.5px; color: var(--ink-soft); font-style: italic; margin-top: 6px; background: #FDF6F1; border-radius: 9px; padding: 8px 11px; }
.vocab-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; }

/* ===== Страница отзывов ===== */
.reviews-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.all-reviews-link { font-weight: 700; white-space: nowrap; }
.reviews-page h1 { margin: 10px 0 26px; }
.reviews-intro {
  position: relative; margin: 0 0 36px;
  background: var(--card);
  border-radius: 22px; padding: 32px 38px 26px 80px;
  box-shadow: 0 10px 30px rgba(176, 74, 68, 0.09);
}
.quote-mark { position: absolute; left: 26px; top: 30px; width: 36px; height: 36px; color: var(--coral); opacity: .85; }
.reviews-intro-text { font-size: 18.5px; line-height: 1.68; margin: 0 0 12px; max-width: 900px; }
.reviews-intro-author { font-size: 13.5px; font-weight: 700; color: var(--ink-faint); }
.reviews-intro-author::before { content: "— "; }
/* Три вертикальные «лесенки»: колонки едут в разные стороны и тают у краёв */
.reviews-columns {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
  height: 780px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 7%, #000 93%, transparent);
}
.rev-col { overflow: hidden; }
.rev-stack .review { margin-bottom: 18px; }
@media (prefers-reduced-motion: no-preference) and (min-width: 901px) {
  .c0 .rev-col-inner { animation: col-scroll 95s linear infinite; }
  .c1 .rev-col-inner { animation: col-scroll 80s linear infinite reverse; }
  .c2 .rev-col-inner { animation: col-scroll 105s linear infinite; }
  .reviews-columns:hover .rev-col-inner { animation-play-state: paused; }
}
@keyframes col-scroll { to { transform: translateY(-50%); } }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
  .reviews-columns { display: block; height: auto; mask-image: none; -webkit-mask-image: none; }
  .rev-stack[aria-hidden="true"] { display: none; }
}
.reviews-more {
  text-align: center; margin: 26px auto 0; padding: 14px 22px; max-width: 640px;
  background: var(--card); box-shadow: 0 6px 22px rgba(176, 74, 68, 0.09);
  border-radius: 14px; font-size: 14.5px; line-height: 1.6;
}
.reviews-more b { color: #B04A44; }
.reviews-more a { font-weight: 700; }
.reviews-cta { text-align: center; margin: 48px auto 10px; max-width: 520px; }
.reviews-cta h2 { margin-bottom: 8px; }
.reviews-cta .btn { margin-top: 16px; }
.site-footer.slim { padding: 20px 0; }
.footer-slim-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; font-size: 13.5px; color: var(--ink-faint); }
.footer-slim-row a { color: var(--ink-soft); }
@media (max-width: 640px) {
  .reviews-intro { padding: 20px 20px 18px 56px; }
  .quote-mark { left: 16px; top: 20px; width: 26px; height: 26px; }
  .reviews-intro-text { font-size: 15.5px; }
}

/* ===== Miro-доска ===== */
.miro-form { margin: 14px 0 4px; align-items: center; }
.miro-form input[type="url"] { flex: 1; min-width: 260px; }
.miro-label { font-weight: 700; font-size: 14px; white-space: nowrap; }
.miro-hint { font-size: 12.5px; margin: 4px 0 0; }
.board-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.board-frame {
  border: 1.5px solid var(--line); border-radius: 16px; overflow: hidden;
  background: #fff; box-shadow: 0 10px 30px rgba(46, 36, 36, 0.06);
}
.board-frame iframe { display: block; width: 100%; height: min(74vh, 820px); border: 0; }
.board-hint { font-size: 12.5px; margin-top: 10px; }

/* ===== Адаптив ===== */
@media (max-width: 960px) {
  .main-nav { display: none; }
  .site-header { position: static; }           /* на телефоне липкая шапка съедает экран */
  .header-row { padding-top: 10px; padding-bottom: 10px; }
  .hero { padding: 34px 0 48px; }
  .hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero h1 { font-size: 38px; }
  /* чипы уходят из absolute в поток: не наезжают на текст */
  .hero-visual { margin-top: 4px; gap: 12px; }
  .portrait { width: 180px; height: 180px; }
  .portrait-initials { font-size: 46px; }
  .chip { position: static; box-shadow: 0 6px 18px rgba(59, 46, 46, 0.12); width: 100%; max-width: 340px; }
  .blob { display: none; }
  .steps { grid-template-columns: 1fr 1fr; }
  .about-grid { grid-template-columns: 1fr; }
  .form-row { flex-direction: column; }
  .trial-box { padding: 32px 22px; }
  h2 { font-size: 28px; }
  /* панель колокольчика не вылезает за экран */
  .bell-panel { position: fixed; left: 12px; right: 12px; top: 96px; width: auto; }
  /* пункты меню кабинета не переносятся на две строки */
  .cab-nav { gap: 14px; font-size: 13.5px; overflow-x: auto; scrollbar-width: none; }
  .cab-nav::-webkit-scrollbar { display: none; }
  .cab-nav a { white-space: nowrap; }
  /* быстрые кнопки чата: одна строка со скроллом, не съедают ленту */
  .quick-btns { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .quick-btns::-webkit-scrollbar { display: none; }
  .quick { flex-shrink: 0; }
  .subs-grid { grid-template-columns: 1fr; }
  .hide-mobile { display: none; }
}
@media (max-width: 960px) {
  .cab-grid, .teacher-grid { grid-template-columns: 1fr; }
  .main-nav.cab-nav { display: flex; }
  .stat-row { grid-template-columns: 1fr 1fr; }
  .practice-wrap { grid-template-columns: 1fr; }
  .practice-left { max-height: none; }
  #answer { min-height: 40vh; }
}
@media (max-width: 560px) {
  .steps { grid-template-columns: 1fr; }
  .site-header .header-cta .login-soon { display: none; }
  .header-row { flex-wrap: wrap; row-gap: 10px; }
}

/* ===== Тёмная тема =====
   Светлая тема не трогается: всё через переопределения под [data-theme="dark"].
   Палитра — тёплый тёмно-коричневый, коралл остаётся акцентом. */
[data-theme="dark"] {
  --bg: #242021;
  --card: #332D2B;
  --ink: #F5EEE9;
  --ink-soft: #CFC3BD;
  --ink-faint: #A79A93;
  --coral-soft: #533431;
  --sky: #2F4A5E;
  --sky-soft: #2B3B48;
  --corn: #7FA8FF;
  --line: #4A403C;
  --sun-soft: #463A28;
  --ok-bg: #2B4134;
  --ok-ink: #9AD3AE;
}
[data-theme="dark"] .section-tint { background: #2B2725; }
[data-theme="dark"] .site-header { background: rgba(36, 32, 33, 0.92); }
[data-theme="dark"] .btn-primary { background: var(--coral); color: #2E1B19; box-shadow: 0 10px 24px rgba(248, 117, 117, 0.16); }
[data-theme="dark"] .facts-strip, [data-theme="dark"] .practice-bar { background: #1C1919; }
[data-theme="dark"] .b-o { background: #46362F; color: #F5EEE9; }
[data-theme="dark"] .msg.user .bubble { background: #5E463F; color: #F6ECE7; }
[data-theme="dark"] .msg.bot .bubble { background: #3B332F; border-color: #4A403C; }
[data-theme="dark"] .fab { background: var(--coral); color: #2E1B19; box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5); }
[data-theme="dark"] .hm-head { background: #2B2624; border-bottom-color: var(--line); }
[data-theme="dark"] .hm-dot { background: #4A403C; }
[data-theme="dark"] .hm-row { border-bottom-color: #362F2C; }
[data-theme="dark"] .hm-check, [data-theme="dark"] .check-btn { border-color: #64554D; background: #2B2624; }
[data-theme="dark"] .hm-check.checked, [data-theme="dark"] .check-btn.checked { background: var(--coral); border-color: var(--coral); }
[data-theme="dark"] .blob-1 { opacity: 0.28; }
[data-theme="dark"] .blob-2 { opacity: 0.22; }

/* Поля ввода и кнопки-плашки: светлый фон -> тёмный */
[data-theme="dark"] input[type="text"], [data-theme="dark"] input[type="url"],
[data-theme="dark"] input[type="time"], [data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="number"], [data-theme="dark"] input[type="password"],
[data-theme="dark"] textarea, [data-theme="dark"] select,
[data-theme="dark"] .goal-chip span, [data-theme="dark"] .tool-btn,
[data-theme="dark"] .quiz-opt, [data-theme="dark"] .slot-btn, [data-theme="dark"] .quick,
[data-theme="dark"] #answer, [data-theme="dark"] .view-body,
[data-theme="dark"] .login-form input, [data-theme="dark"] .chat-input input {
  /* только background-color: шортхенд background сбрасывал no-repeat
     у стрелки select — она тайлилась «зигзагом» по всему полю */
  background-color: #2B2624; color: var(--ink); border-color: var(--line);
}
[data-theme="dark"] input[type="file"] { background-color: #2B2624; color: var(--ink-soft); }
[data-theme="dark"] input[type="file"]:hover { background-color: #3A332F; }
[data-theme="dark"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23C9B8B1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
[data-theme="dark"] .quiz-opt:hover { background: #3A332F; }
[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.85); }

/* Тексты акцентных бейджей: тёмно-красные/синие/охра -> светлые пары */
[data-theme="dark"] .step-num, [data-theme="dark"] .review-ava.a0, [data-theme="dark"] .i1,
[data-theme="dark"] .c-w, [data-theme="dark"] .skill-chip.sc-writing, [data-theme="dark"] .b-w,
[data-theme="dark"] .status-new, [data-theme="dark"] .goal-chip input:checked + span,
[data-theme="dark"] .login-error, [data-theme="dark"] .link-danger,
[data-theme="dark"] .vocab-front, [data-theme="dark"] .stat-hot .stat-num,
[data-theme="dark"] .review-chip, [data-theme="dark"] .reviews-more b,
[data-theme="dark"] .bell-task, [data-theme="dark"] .ico-w,
[data-theme="dark"] .sub-title-link:hover b { color: #F5A19C; }
[data-theme="dark"] input[type="file"]::file-selector-button { background: var(--coral-soft); color: #F5A19C; }
[data-theme="dark"] .i2, [data-theme="dark"] .review-ava.a1, [data-theme="dark"] .c-l,
[data-theme="dark"] .skill-chip.sc-listening, [data-theme="dark"] .b-l,
[data-theme="dark"] .status-trial_scheduled, [data-theme="dark"] .btn-convert { color: #8FC1E8; }
[data-theme="dark"] .ico-ok { color: #8FC1E8; }
[data-theme="dark"] .i3, [data-theme="dark"] .review-ava.a2,
[data-theme="dark"] .skill-chip.sc-speaking, [data-theme="dark"] .b-s,
[data-theme="dark"] .status-contacted { color: #E0A662; }
[data-theme="dark"] .c-s { background: #463A28; color: #E0A662; }
[data-theme="dark"] .c-r, [data-theme="dark"] .skill-chip.sc-reading, [data-theme="dark"] .b-r { background: #2B3447; color: #93A9E8; }
[data-theme="dark"] .i4, [data-theme="dark"] .review-ava.a3 { background: #363050; color: #B3A3E8; }
[data-theme="dark"] .review-ava.a4 { background: #2C3F33; color: #9AD3AE; }
[data-theme="dark"] .skill-chip.sc-general, [data-theme="dark"] .status-closed { background: #3D3531; }

/* Панели и фоны на светлых тонах */
[data-theme="dark"] .review.bg1 { background: #3A322C; }
[data-theme="dark"] .review.bg2 { background: #2C363E; }
[data-theme="dark"] .reviews-intro, [data-theme="dark"] .reviews-more { background: #2B2725; }
[data-theme="dark"] .site-footer { background: #201D1C; }
[data-theme="dark"] .footer-bottom, [data-theme="dark"] .badge, [data-theme="dark"] .bell-panel { border-color: var(--line); }
[data-theme="dark"] .leads-table th { background: #2B2624; }
[data-theme="dark"] .leads-table th, [data-theme="dark"] .leads-table td,
[data-theme="dark"] .task-list li, [data-theme="dark"] .bell-item,
[data-theme="dark"] .quiz-cta, [data-theme="dark"] .report-list li,
[data-theme="dark"] .report-sub { border-color: #423A36; }
[data-theme="dark"] .leads-table tbody tr:hover { background: #2B2624; }
[data-theme="dark"] .leads-table code, [data-theme="dark"] .invite-box code { background: #2B2624; }
[data-theme="dark"] .bar, [data-theme="dark"] .quiz-progress { background: #3D3531; }
[data-theme="dark"] .sub-body, [data-theme="dark"] .vocab-example { background: #2B2624; }
[data-theme="dark"] .hl-mode { background: rgba(255, 240, 201, 0.06); }
[data-theme="dark"] mark.user-hl { color: #2E2424; }
[data-theme="dark"] .ai-review { background: #2E2839; border-color: #453C5C; }
[data-theme="dark"] .ai-review-head, [data-theme="dark"] .ai-review-details summary { color: #B3A3E8; }
[data-theme="dark"] .ai-review-details .ai-review-body { background: #2E2839; }
[data-theme="dark"] .board-frame { background: var(--card); }
[data-theme="dark"] .cab-link { color: #7FA8FF; }
[data-theme="dark"] .tool-btn.active { background: #463A28; border-color: #6B5A2E; }

/* ===== Ползунок темы ===== */
.theme-switch {
  position: relative; width: 52px; height: 28px; flex-shrink: 0;
  border-radius: 999px; border: 1.5px solid var(--line); cursor: pointer;
  background: var(--card); padding: 0;
  display: inline-flex; align-items: center;
}
.theme-switch:hover { border-color: var(--melon); }
.theme-switch svg { position: absolute; width: 14px; height: 14px; top: 50%; transform: translateY(-50%); color: var(--ink-faint); }
.ts-sun { left: 6px; }
.ts-moon { right: 6px; }
.ts-knob {
  position: absolute; left: 3px; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; border-radius: 50%; background: var(--coral);
  transition: left var(--t-fast) var(--ease);
}
[data-theme="dark"] .ts-knob { left: 26px; }
.quick:disabled { opacity: .45; cursor: default; transform: none !important; }

/* Смена темы кругом от кнопки: дефолтный кроссфейд навигации выключается,
   новый снапшот раскрывается clip-path-кругом поверх старого */
html.theme-vt::view-transition-old(root),
html.theme-vt::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
html.theme-vt::view-transition-old(root) { z-index: 1; }
html.theme-vt::view-transition-new(root) { z-index: 2; }
/* при волне полоска меню не должна жить своей отдельной анимацией */
html.theme-vt::view-transition-group(nav-underline) { animation: none; }

/* Фолбэк смены темы без волны (iOS Safari): один мягкий длинный кроссфейд */
html.theme-fade::view-transition-old(root) { animation-duration: .8s; }
html.theme-fade::view-transition-new(root) { animation-duration: .8s; }

/* Тёмная тема: карточки отделяются от фона рамкой; тень включается только
   у семейств с назначенной --glow-d (transparent = ничего не рисует) */
[data-theme="dark"] .card, [data-theme="dark"] .cab-card, [data-theme="dark"] .step,
[data-theme="dark"] .stat-tile, [data-theme="dark"] .trial-box, [data-theme="dark"] .login-card,
[data-theme="dark"] .quiz-card, [data-theme="dark"] .practice-pane, [data-theme="dark"] .report-section,
[data-theme="dark"] .faq-wrap details, [data-theme="dark"] .leads-table,
[data-theme="dark"] .login-dialog, [data-theme="dark"] .bell-panel, [data-theme="dark"] .cmp-row {
  border: 1px solid #453C37; box-shadow: 0 10px 28px var(--glow-d, transparent);
}
[data-theme="dark"] .step:hover, [data-theme="dark"] .section .card:hover {
  border-color: #5A4E48; box-shadow: 0 10px 26px var(--glow-dh, rgba(0, 0, 0, 0.35));
}
[data-theme="dark"] .hero-mock { box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), 0 0 44px rgba(248, 117, 117, 0.06); }

/* Шапка кабинета на средних ширинах: нав ужимается, не ломаясь на две строки */
@media (max-width: 1280px) {
  .cab-nav { gap: 15px; font-size: 13.5px; }
  .header-cta { gap: 10px; }
  .login-soon { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* Виджет ассистента узкий: быстрые кнопки переносятся, третья не прячется в скролле */
.chat-embed .quick-btns { flex-wrap: wrap; overflow: visible; }
.chat-embed .quick { font-size: 12px; padding: 7px 11px; }

/* Шапки на широких экранах ведут себя одинаково на лендинге и в кабинетах:
   лого слева, действия справа, между ними воздух - ничего не сплющено в центре */
.site-header:has(.cab-nav) .container { max-width: 1500px; }
.site-header .main-nav { margin: 0 18px; }

/* Полоска активного пункта «перетекает» к новому пункту при переходе:
   у полоски есть view-transition-name, и браузер морфит её позицию сам */
.cab-nav .nav-active { border-bottom-color: transparent; position: relative; }
.cab-nav .nav-active::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px;
  background: var(--coral); border-radius: 2px;
  view-transition-name: nav-underline;
}
::view-transition-group(nav-underline) {
  animation-duration: .4s;
  animation-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Нативные виджеты (скроллбары, календарики, resize-грип) следуют теме */
:root { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }

/* Speaking-бейджи: светлый фон-литерал не был переопределён в тёмной */
[data-theme="dark"] .skill-chip.sc-speaking, [data-theme="dark"] .b-s,
[data-theme="dark"] .status-contacted { background: #463A28; }

/* График в тёмной теме: сетка приглушается, «цель N» и оси читаемы
   (атрибут-селекторы бьют только служебные элементы, серии не трогают) */
[data-theme="dark"] svg line[stroke="#F3E3DC"] { stroke: #453C37; }
[data-theme="dark"] svg line[stroke="#2E2424"] { stroke: #CFC3BD; }
[data-theme="dark"] svg text[fill="#2E2424"] { fill: #CFC3BD; }
[data-theme="dark"] svg text[fill="#8A7370"] { fill: #A79A93; }

/* Поле Miro в карточке ученика — как остальные поля админки */
.miro-form input[type="url"] {
  font-family: inherit; font-size: 14px; color: var(--ink);
  background-color: #FFFDFC; border: 1.5px solid var(--line);
  border-radius: 11px; padding: 10px 13px;
}
[data-theme="dark"] .miro-form input[type="url"] { background-color: #2B2624; }

/* Якорные переходы: sticky-шапка не накрывает начало секции */
section[id], #trial { scroll-margin-top: 84px; }

/* График прогресса пошире — не болтается в левой половине карточки */
.chart-wrap svg { max-width: 860px; }

/* Чип «урок подтверждён» не накрывает заголовок мокапа */
.chip-lesson { right: -10px; top: -52px; }

/* Факты на мобиле: ровная сетка 2×2 вместо рваного переноса */
@media (max-width: 640px) {
  .facts-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 14px; }
  .fact { min-width: 0; }
}

/* Тёмная тема: полоса фактов отделяется от фона границами */
[data-theme="dark"] .facts-strip { border-top: 1px solid #453C37; border-bottom: 1px solid #453C37; }

/* Ресайз-уголок виджета ассистента (левый верхний угол панели) */
.fab-grip {
  position: absolute; left: 0; top: 0; width: 26px; height: 26px; z-index: 2;
  cursor: nwse-resize; border-radius: 18px 0 8px 0; touch-action: none;
  background:
    linear-gradient(135deg, transparent 8px, var(--line) 8px, var(--line) 10px, transparent 10px,
      transparent 13px, var(--line) 13px, var(--line) 15px, transparent 15px) no-repeat;
}
.fab-grip:hover { background-color: rgba(176, 74, 68, 0.08); }
.fab-panel.resizing iframe { pointer-events: none; }  /* iframe не ворует drag */

/* «Сегодня» на дашборде: одно главное действие дня */
.today-card {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  background: var(--card); border-left: 5px solid var(--coral);
  border-radius: var(--radius); padding: 20px 24px; margin-top: 20px;
  box-shadow: 0 6px 22px rgba(176, 74, 68, 0.09); flex-wrap: wrap;
}
.today-info { display: flex; flex-direction: column; gap: 3px; }
.today-info b { font-size: 17px; }
.today-label {
  font-size: 11.5px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase;
  color: #B04A44;
}
[data-theme="dark"] .today-label { color: #F5A19C; }
.today-btn { padding: 13px 24px; font-size: 15px; }

/* Занятия: строки записей и групп */
.lesson-row-divided { border-bottom: 1px solid #F6ECE7; padding-bottom: 12px; margin-bottom: 12px; }
[data-theme="dark"] .lesson-row-divided { border-color: #423A36; }
.group-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.group-info { display: flex; flex-direction: column; gap: 2px; }

/* Справка */
.help-btn { text-decoration: none; font-weight: 800; font-size: 16px; }
.help-btn.help-active { border-color: var(--coral); color: var(--coral); }
.help-page .cab-card { max-width: 860px; }
.help-steps { padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.help-list { padding-left: 22px; display: flex; flex-direction: column; gap: 9px; font-size: 15px; list-style: disc; }
.help-steps li::marker { font-weight: 800; color: #B04A44; }
[data-theme="dark"] .help-steps li::marker { color: #F5A19C; }

/* Смена темы не двигает layout: рамка-призрак в светлой теме занимает
   те же 1px, что цветная рамка в тёмной */
.card, .cab-card, .step, .stat-tile, .trial-box, .login-card, .quiz-card,
.practice-pane, .report-section, .faq-wrap details, .leads-table,
.login-dialog, .bell-panel, .cmp-row { border: 1px solid transparent; }

/* Переключатель языка */
.lang-switch {
  font-weight: 800; font-size: 13px; letter-spacing: 0.04em; cursor: pointer;
  border: 1.5px solid var(--line); border-radius: 10px; padding: 7px 10px;
  color: var(--ink-soft); line-height: 1;
}
.lang-switch:hover { border-color: var(--melon); color: var(--ink); }

/* Анимация смены языка: страница мягко «выдыхает» */
html.lang-out body {
  opacity: 0; filter: blur(7px); transform: scale(0.988);
  transition: opacity .24s ease, filter .24s ease, transform .24s ease;
}

/* Цветные лёгкие подсветки (точечные, вне var-системы карточек) */
.ai-review { box-shadow: 0 6px 20px rgba(107, 79, 160, 0.10); }
.today-card { box-shadow: 0 8px 26px rgba(176, 74, 68, 0.13); }
[data-theme="dark"] .today-card { box-shadow: 0 10px 28px rgba(248, 117, 117, 0.10); }
[data-theme="dark"] .ai-review { box-shadow: 0 10px 26px rgba(179, 163, 232, 0.09); }
[data-theme="dark"] .stat-hot { box-shadow: 0 10px 26px rgba(248, 117, 117, 0.09); }
[data-theme="dark"] .about-photo { box-shadow: 0 14px 34px rgba(248, 117, 117, 0.14); }

/* Иконки date/time-пикеров в тёмной теме — ярче */
[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1); opacity: .8;
}

/* Подписи-кэпшены: один вид везде (вес и размер не скачут) */
.portrait-caption, .hm-chart-caption, .fact-label, .draft-note, .chat-note {
  font-weight: 600; letter-spacing: 0;
}
.portrait-caption { font-size: 13.5px; color: var(--ink-faint); }

/* Ссылки в пузырях чата + перенос длинных строк */
.bubble { overflow-wrap: anywhere; }
.bubble-link { color: var(--corn); text-decoration: underline; font-weight: 700; }
.msg.user .bubble .bubble-link { color: #CFE0FF; }

/* Мобильный hero: чип «урок подтверждён» не болтается сиротой под мокапом */
@media (max-width: 640px) {
  .chip-lesson { display: none; }
}

/* Бейдж очереди проверки в шапке админки */
.review-queue {
  font-size: 13px; font-weight: 800; white-space: nowrap;
  background: var(--coral-soft); color: #B04A44;
  border-radius: 999px; padding: 8px 14px;
}
.review-queue:hover { background: var(--melon); color: #5C3532; }
[data-theme="dark"] .review-queue { background: #46362F; color: #F5A19C; }
[data-theme="dark"] .review-queue:hover { background: #5E463F; color: #F6ECE7; }

/* Селект статуса заявки: цвет соответствует статусу, сохранение по выбору */
.status-select { font-weight: 700; border-radius: 999px !important; }
.status-select.st-new { background-color: var(--coral-soft) !important; color: #B04A44; border-color: transparent !important; }
.status-select.st-contacted { background-color: var(--sun-soft) !important; color: #9A5B2B; border-color: transparent !important; }
.status-select.st-trial_scheduled { background-color: var(--sky-soft) !important; color: #2B5E8C; border-color: transparent !important; }
.status-select.st-active { background-color: var(--ok-bg) !important; color: var(--ok-ink); border-color: transparent !important; }
.status-select.st-closed { background-color: #EFE9E6 !important; color: var(--ink-faint); border-color: transparent !important; }
[data-theme="dark"] .status-select.st-new { color: #F5A19C; }
[data-theme="dark"] .status-select.st-contacted { color: #E0A662; }
[data-theme="dark"] .status-select.st-trial_scheduled { color: #8FC1E8; }
[data-theme="dark"] .status-select.st-closed { background-color: #3A332F !important; }

/* Таблицы админки на телефоне: второстепенные колонки прячутся */
@media (max-width: 640px) {
  /* мобилка: остаются самое нужное — заявкам статус и «В ученики», ученикам работы и «Открыть» */
  .t-leads th:nth-child(1), .t-leads td:nth-child(1),
  .t-leads th:nth-child(3), .t-leads td:nth-child(3),
  .t-leads th:nth-child(4), .t-leads td:nth-child(4) { display: none; }
  .t-students th:nth-child(2), .t-students td:nth-child(2),
  .t-students th:nth-child(3), .t-students td:nth-child(3),
  .t-students th:nth-child(4), .t-students td:nth-child(4),
  .t-students th:nth-child(5), .t-students td:nth-child(5),
  .t-students th:nth-child(7), .t-students td:nth-child(7) { display: none; }
}

/* Тренировка словаря: перевод и пример скрыты до клика по карточке */
#vocab-list.trainer .vocab-card { cursor: pointer; }
#vocab-list.trainer .vocab-card:not(.revealed) .vocab-back,
#vocab-list.trainer .vocab-card:not(.revealed) .vocab-example {
  filter: blur(7px); user-select: none; transition: filter var(--t-fast) var(--ease);
}
#vocab-list.trainer .vocab-card.revealed .vocab-back,
#vocab-list.trainer .vocab-card.revealed .vocab-example { filter: none; }

/* ===== Свечения по семействам: базовые правила читают var(--glow*),
   здесь только назначения цвета — специфичность больше не воюет ===== */
.card:has(> .card-ico.i1) { --glow: rgba(248, 117, 117, 0.11); --glow-h: rgba(248, 117, 117, 0.17); }
.card:has(> .card-ico.i2) { --glow: rgba(43, 94, 140, 0.10); --glow-h: rgba(43, 94, 140, 0.16); }
.card:has(> .card-ico.i3) { --glow: rgba(154, 91, 43, 0.10); --glow-h: rgba(154, 91, 43, 0.16); }
.card:has(> .card-ico.i4) { --glow: rgba(107, 79, 160, 0.10); --glow-h: rgba(107, 79, 160, 0.16); }
.review.bg1 { --glow: rgba(211, 122, 78, 0.13); --glow-h: rgba(211, 122, 78, 0.19); }
.review.bg2 { --glow: rgba(43, 94, 140, 0.12); --glow-h: rgba(43, 94, 140, 0.18); }
.review.bg0 { background: #EAF4EE; --glow: rgba(63, 122, 76, 0.11); --glow-h: rgba(63, 122, 76, 0.16); }

[data-theme="dark"] .card:has(> .card-ico.i1) { --glow-d: rgba(248, 117, 117, 0.08); --glow-dh: rgba(248, 117, 117, 0.12); }
[data-theme="dark"] .card:has(> .card-ico.i2) { --glow-d: rgba(92, 149, 255, 0.07); --glow-dh: rgba(92, 149, 255, 0.11); }
[data-theme="dark"] .card:has(> .card-ico.i3) { --glow-d: rgba(224, 166, 98, 0.07); --glow-dh: rgba(224, 166, 98, 0.11); }
[data-theme="dark"] .card:has(> .card-ico.i4) { --glow-d: rgba(179, 163, 232, 0.08); --glow-dh: rgba(179, 163, 232, 0.12); }
[data-theme="dark"] .review.bg1 { --glow-d: rgba(248, 117, 117, 0.07); --glow-dh: rgba(248, 117, 117, 0.11); }
[data-theme="dark"] .review.bg2 { --glow-d: rgba(92, 149, 255, 0.07); --glow-dh: rgba(92, 149, 255, 0.11); }
[data-theme="dark"] .review.bg0 { background: #2C3A31; --glow-d: rgba(154, 211, 174, 0.07); --glow-dh: rgba(154, 211, 174, 0.10); }
[data-theme="dark"] .review { box-shadow: 0 10px 28px var(--glow-d, transparent); }
[data-theme="dark"] .trial-box { --glow-d: rgba(248, 117, 117, 0.05); }

/* Точечные свечения кнопок */
.header-cta > .btn-small { box-shadow: 0 6px 16px rgba(248, 117, 117, 0.28); }
.header-cta > .btn-small:hover { box-shadow: 0 8px 20px rgba(248, 117, 117, 0.38); }
[data-theme="dark"] .header-cta > .btn-small { box-shadow: 0 6px 16px rgba(248, 117, 117, 0.18); }
.btn-convert { box-shadow: 0 5px 14px rgba(43, 94, 140, 0.16); }
[data-theme="dark"] .btn-convert { box-shadow: 0 5px 14px rgba(92, 149, 255, 0.12); }

/* ===== Сравнение форматов (лендинг, #why) ===== */
.cmp-table { max-width: 880px; margin-top: 30px; display: flex; flex-direction: column; gap: 10px; }
.cmp-head, .cmp-row { display: grid; grid-template-columns: 1fr 108px 108px 108px; gap: 10px; align-items: center; }
.cmp-head { padding: 0 20px; }
.cmp-head span {
  font-size: 11.5px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--ink-faint); text-align: center; line-height: 1.3;
}
.cmp-head span:first-child { text-align: left; }
.cmp-head .ch-here { color: #B04A44; }
.cmp-row {
  background: var(--card); border-radius: 15px; padding: 14px 20px;
  box-shadow: 0 3px 12px rgba(176, 74, 68, 0.06);
}
.cmp-crit b { display: block; font-size: 15px; font-weight: 700; }
.cmp-crit small { display: block; font-size: 13px; color: var(--ink-soft); line-height: 1.45; margin-top: 2px; }
.cmp-cell { display: flex; justify-content: center; }
.cmp-mark { width: 30px; height: 30px; border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.cmp-mark svg { width: 15px; height: 15px; }
.m-yes { background: var(--ok-bg); color: var(--ok-ink); }
.m-mid { background: var(--sun-soft); color: #9A5B2B; }
.m-no { background: #EFE9E6; color: var(--ink-faint); }
.m-na { background: #EFE9E6; color: var(--ink-faint); opacity: 0.75; }
.cmp-cell-here .cmp-mark { box-shadow: 0 4px 12px rgba(63, 122, 76, 0.18); }
.cmp-note { font-size: 13.5px; color: var(--ink-faint); margin-top: 14px; max-width: 620px; }
/* min-width:0 — иначе min-content подписей распирает грид шире экрана */
.cmp-crit, .cmp-cell, .cmp-head span { min-width: 0; }
@media (max-width: 640px) {
  .cmp-head, .cmp-row { grid-template-columns: 1fr 62px 62px 62px; gap: 5px; }
  .cmp-row { padding: 12px 12px; }
  .cmp-head { padding: 0 12px; }
  .cmp-head span { font-size: 9px; letter-spacing: 0.02em; overflow-wrap: anywhere; }
  .cmp-mark { width: 26px; height: 26px; }
  .cmp-mark svg { width: 13px; height: 13px; }
  .cmp-cell-here .cmp-mark { width: 30px; height: 30px; }
}
[data-theme="dark"] .cmp-head .ch-here { color: #F5A19C; }
[data-theme="dark"] .m-mid { color: #E0A662; }
[data-theme="dark"] .m-no { background: #3D3531; }
[data-theme="dark"] .m-na { background: #3D3531; }
[data-theme="dark"] .cmp-cell-here .cmp-mark { box-shadow: 0 4px 12px rgba(154, 211, 174, 0.10); }
#why .container { max-width: 928px; }
.zoom-btn { display: inline-block; }
/* Дашборд: зум — главное действие на всю ширину, «Перенести» отдельной строкой под ним */
.next-lesson-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; margin: 14px 0 8px; }
.next-lesson-actions .zoom-btn { width: 100%; text-align: center; box-sizing: border-box; }
/* Страница занятий: постоянная кнопка отделена от заголовка и первого блока */
.zoom-row { margin: -8px 0 22px; }
/* Контакты в футере: иконка + подпись, юр-ссылки отделены воздухом */
.f-contact { display: flex; align-items: center; gap: 9px; }
.f-contact svg { width: 15px; height: 15px; flex-shrink: 0; opacity: 0.75; }
.f-contact:hover svg { opacity: 1; }
.f-legal { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; margin-top: 10px; padding-top: 12px; border-top: 1px solid rgba(120, 100, 95, 0.18); align-self: stretch; }
/* Фото преподавателя в блоке about */
.about-photo { overflow: hidden; }
.about-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Конструктор сайта (админка) */
.builder-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 6px; }
.builder-head .muted { max-width: 560px; }
.site-anchors { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 22px; }
.site-anchors a {
  font-size: 13px; font-weight: 700; color: var(--ink-soft);
  background-color: var(--card); border: 1.5px solid var(--line);
  border-radius: 999px; padding: 7px 14px;
}
.site-anchors a:hover { color: var(--ink); border-color: var(--coral); }
.where-hint { font-size: 13px; margin-bottom: 12px; }
.photo-row { display: flex; gap: 18px; align-items: flex-start; }
.photo-preview {
  width: 108px; height: 108px; border-radius: 18px; flex-shrink: 0; overflow: hidden;
  background: linear-gradient(145deg, var(--melon), var(--coral));
  display: flex; align-items: center; justify-content: center;
}
.photo-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo-preview .portrait-initials { font-size: 30px; }
.photo-forms { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
.cab-card[id] { scroll-margin-top: 84px; }
[data-theme="dark"] .site-anchors a { background-color: #332D2B; }
/* Длинные списки конструктора скроллятся внутри карточки, а не тянут страницу */
.scroll-list {
  max-height: 400px; overflow-y: auto; scrollbar-width: thin;
  padding-right: 8px; margin-bottom: 6px;
  border-bottom: 1px solid var(--line);
  mask-image: linear-gradient(to bottom, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, #000 92%, transparent);
}
.count-chip {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 26px; height: 22px; padding: 0 8px; margin-left: 6px;
  border-radius: 999px; background: var(--coral-soft); color: #B04A44;
  font-size: 12.5px; font-weight: 800; vertical-align: 3px;
}
[data-theme="dark"] .count-chip { background: #46362F; color: #F5A19C; }
/* Блок «Усвоение курса» в карточке ученика */
.mastery-grid { display: grid; grid-template-columns: 1fr auto; gap: 26px; align-items: start; }
.mastery-nums { display: flex; gap: 22px; }
.mastery-num { display: flex; flex-direction: column; gap: 2px; min-width: 86px; }
.mastery-num b { font-size: 24px; font-weight: 800; }
.mastery-num span { font-size: 12.5px; color: var(--ink-faint); }
@media (max-width: 960px) { .mastery-grid { grid-template-columns: 1fr; } }

/* ===== Мобильный кабинет ученика (опрос: «тяжело с телефона» ×3) ===== */
@media (max-width: 640px) {
  .cab { padding-left: 14px; padding-right: 14px; }
  .cab-title { font-size: 24px; }
  /* практика: компактная панель, поле на полэкрана */
  .practice-bar { padding: 8px 12px; gap: 10px; font-size: 13px; flex-wrap: nowrap; overflow-x: auto; }
  .practice-bar .timer, .practice-bar .wordcount { font-size: 14px; white-space: nowrap; }
  .practice-pane { padding: 14px; }
  #answer { min-height: 52vh; font-size: 15px; }
  .marker-tools { display: flex; overflow-x: auto; gap: 8px; padding-bottom: 4px; }
  /* словарь */
  .vocab-head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .vocab-head .lesson-actions { width: 100%; }
  .vocab-head .lesson-actions .btn { flex: 1; text-align: center; }
  .vocab-card { padding: 14px; }
  /* занятия: слоты под палец, действия брони переносятся */
  .slot-btn { min-height: 44px; min-width: 74px; font-size: 15px; }
  .lesson-row { flex-direction: column; align-items: flex-start; gap: 10px; }
  .lesson-actions { flex-wrap: wrap; gap: 8px; row-gap: 8px; }
  .zoom-row .zoom-btn { width: 100%; text-align: center; box-sizing: border-box; }
  .group-row { flex-direction: column; align-items: flex-start; gap: 8px; }
  /* план/домашка/материалы: заголовок на всю строку, чип и кнопка под ним —
     иначе несжимаемые соседи давили его в столбик по одной букве */
  .task-list li { flex-wrap: wrap; row-gap: 6px; }
  .task-title { flex-basis: 100%; min-width: 0; overflow-wrap: anywhere; }
  /* чат на всю высоту экрана */
  .chat-log { max-height: calc(100dvh - 300px); }
  .chat-input input { min-width: 0; }
  /* отчёт: таблица моков скроллится внутри */
  .report { padding: 14px; }
  .report-section { overflow-x: auto; }
  /* дашборд: сегодня-карточка в колонку */
  .today-card { flex-direction: column; align-items: flex-start; }
  .today-btn { width: 100%; text-align: center; box-sizing: border-box; }
}
@media (max-width: 640px) {
  /* форма добавления слова — над списком, а не под 36 карточками */
  .vocab-grid { display: flex; flex-direction: column; }
  .vocab-grid > div:last-child { order: -1; }
}
/* Тренировка повторения */
.training-wrap { display: flex; flex-direction: column; align-items: center; }
.training-wrap > .cab-link { align-self: flex-start; margin-bottom: 14px; }
.tr-card { margin-top: 6px; }
.quiz-opt.correct { border-color: #3F7A4C; background: var(--ok-bg); color: var(--ok-ink); }
.quiz-opt.wrong { border-color: #B04A44; background: var(--coral-soft); color: #B04A44; }
.quiz-opt:disabled { cursor: default; transform: none; }
.tr-fixed { cursor: default; }
.tr-note { margin-top: 14px; background: #FBF4EF; border-radius: 13px; padding: 12px 15px; font-size: 14px; }
.tr-orig { margin-top: 8px; color: var(--ink-faint); font-size: 13px; }
.tr-actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.tr-score { font-size: 19px; margin-bottom: 12px; }
.tr-recap { list-style: none; margin: 0 0 18px; display: flex; flex-direction: column; gap: 7px; }
.tr-recap li { font-size: 13.5px; padding-left: 22px; position: relative; color: var(--ink-soft); }
.tr-recap li.ok::before { content: "✓"; position: absolute; left: 0; color: var(--ok-ink); font-weight: 800; }
.tr-recap li.bad::before { content: "✗"; position: absolute; left: 0; color: #B04A44; font-weight: 800; }
[data-theme="dark"] .quiz-opt.correct { background: #2C3A31; border-color: #3F7A4C; color: #9AD3AE; }
[data-theme="dark"] .quiz-opt.wrong { background: #46362F; border-color: #B04A44; color: #F5A19C; }
[data-theme="dark"] .tr-note { background: #2B2725; }
/* [hidden] должен побеждать display у классов (.btn и т.п.) */
[hidden] { display: none !important; }
/* Календарь занятий ученика */
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.cal-nav { display: flex; align-items: center; gap: 12px; font-size: 15px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin-bottom: 4px; }
.cal-week-head span { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-faint); text-align: center; padding: 4px 0; }
.cal-cell { min-height: 52px; border-radius: 10px; background: #FBF4EF; padding: 6px 7px; display: flex; flex-direction: column; gap: 3px; }
.cal-empty { background: transparent; }
.cal-past .cal-day { color: var(--ink-faint); }
.cal-today { outline: 2px solid var(--coral); outline-offset: -2px; background: #FFF0EC; }
.cal-day { font-size: 12.5px; font-weight: 700; }
.cal-dots { display: flex; gap: 3px; flex-wrap: wrap; }
.cal-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.d-lesson { background: var(--coral); }
.d-group { background: var(--corn); }
.d-done { background: #B9AFA9; }
.cal-total { margin-top: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cal-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
[data-theme="dark"] .cal-cell { background: #2B2725; }
[data-theme="dark"] .cal-today { background: #3A2F2C; }
[data-theme="dark"] .d-done { background: #5A4E48; }
@media (max-width: 640px) {
  .cal-cell { min-height: 40px; padding: 4px 5px; }
  .cal-dot { width: 6px; height: 6px; }
}
/* Блок оплаты по СБП в занятиях ученика */
.pay-box { margin-top: 14px; background: #FBF4EF; border-radius: 13px; padding: 12px 15px; font-size: 14px; display: flex; flex-direction: column; gap: 4px; }
.pay-text { color: var(--ink-soft); white-space: pre-line; }
[data-theme="dark"] .pay-box { background: #2B2725; }
/* Кликабельный календарь: ховер, панель деталей дня */
.cal-clickable { cursor: pointer; transition: border-color var(--t-fast) var(--ease), transform var(--t-fast) var(--ease); border: 1.5px solid transparent; }
.cal-clickable:hover { border-color: var(--coral); transform: translateY(-1px); }
.cal-detail { margin-top: 10px; background: #FBF4EF; border-radius: 13px; padding: 12px 15px; }
.cal-detail-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.cal-detail ul { list-style: none; margin: 0 0 6px; display: flex; flex-direction: column; gap: 4px; }
.cal-detail li { font-size: 14px; padding-left: 16px; position: relative; }
.cal-detail li::before { content: ""; position: absolute; left: 0; top: 6px; width: 8px; height: 8px; border-radius: 50%; }
.cal-detail li.k-lesson::before { background: var(--coral); }
.cal-detail li.k-group::before { background: var(--corn); }
.cal-detail li.k-done::before { background: #B9AFA9; }
[data-theme="dark"] .cal-detail { background: #2B2725; }
/* Тренировка: шире и плотнее — карточка тонула в пустоте */
.tr-card { max-width: 780px; width: 100%; padding: 30px 32px; }
.tr-score { margin-top: -4px; }
.tr-recap li { font-size: 14px; }
.tr-card > .btn-primary { font-size: 15px; padding: 13px 24px; }
/* Фото-форма конструктора: кнопка не налезает на file-инпут */
.photo-forms form { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }
/* Выпадающие списки всегда нейтральны — цветным остаётся только сам селект */
select option { color: var(--ink); background-color: var(--card); font-weight: 400; }
[data-theme="dark"] select option { color: #F5EEE9; background-color: #332D2B; }

/* ===== Аудит-фиксы: глобальное ===== */
.btn:disabled { opacity: 0.55; cursor: default; transform: none; }
/* намёк, что нав-строка скроллится (мобила: пункты за краем «не существовали») */
@media (max-width: 960px) {
  .cab-nav { -webkit-mask-image: linear-gradient(to right, #000 88%, transparent); mask-image: linear-gradient(to right, #000 88%, transparent); padding-right: 26px; }
}
/* синие ссылки в согласии/диалогах: было 2.9:1 */
.consent a, .dialog-alt a, .legal-list a { color: #3D6FD6; }
[data-theme="dark"] .consent a, [data-theme="dark"] .dialog-alt a, [data-theme="dark"] .legal-list a { color: #8FC1E8; }
/* крестик модалки крупнее и темнее */
.dialog-close { font-size: 26px; padding: 8px 10px; color: var(--ink-soft); }
/* Бургер-меню: шапке нужна одна строка — нав скрывается раньше (ломался 961-1150) */
.nav-burger { position: relative; display: none; }
.nav-burger summary { list-style: none; cursor: pointer; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border-radius: 12px; border: 1.5px solid var(--line); background-color: var(--card); }
.nav-burger summary::-webkit-details-marker { display: none; }
.nav-burger svg { width: 21px; height: 21px; }
.nav-burger-panel {
  position: absolute; right: 0; top: 50px; z-index: 60; min-width: 230px;
  background: var(--card); border: 1px solid var(--line); border-radius: 15px;
  box-shadow: 0 14px 40px rgba(59, 46, 46, 0.16); padding: 10px;
  display: flex; flex-direction: column;
}
.nav-burger-panel a { padding: 11px 14px; border-radius: 10px; font-weight: 700; font-size: 15px; }
.nav-burger-panel a:hover { background: var(--coral-soft); }
@media (max-width: 1150px) {
  .main-nav { display: none; }
  .nav-burger { display: block; }
}
[data-theme="dark"] .nav-burger summary { background-color: #332D2B; }
[data-theme="dark"] .nav-burger-panel { box-shadow: 0 14px 40px rgba(0, 0, 0, 0.5); }
[data-theme="dark"] .nav-burger-panel a:hover { background: #46362F; }
/* Сравнение на мобиле: критерий на всю строку, метки с подписями под ним */
@media (max-width: 640px) {
  .cmp-head { display: none; }
  .cmp-row { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .cmp-crit { grid-column: 1 / -1; }
  .cmp-cell { flex-direction: column; align-items: center; gap: 3px; }
  .cmp-cell .cmp-mini { display: block; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.03em; color: var(--ink-faint); }
}
.cmp-mini { display: none; }
/* Интро-цитата отзывов на мобиле: без гигантского левого отступа */
@media (max-width: 640px) {
  .reviews-intro { padding: 26px 20px 22px 24px; }
  .hero .cta-row .btn { width: 100%; text-align: center; box-sizing: border-box; }
  .trial-form .btn-primary { width: 100%; box-sizing: border-box; }
}
.goal-label { font-size: 13.5px; margin-bottom: -6px; }
/* Аудит: календарь и занятия */
[data-theme="dark"] .cal-empty { background: transparent; }  /* фантомные дни месяца */
.cal-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.cal-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; }
@media (max-width: 640px) { .cal-cell { min-height: 44px; } }
.pay-box.cab-card { font-size: 14.5px; }
.pay-box .pay-text { color: var(--ink); font-size: 15px; }
.tr-ans { display: block; margin-top: 2px; color: var(--ok-ink); font-size: 13px; }
[data-theme="dark"] .tr-ans { color: #9AD3AE; }
.ai-est { display: inline-block; background: #EDE8FF; color: #5A4A9E; font-weight: 800; border-radius: 9px; padding: 3px 10px; margin: 4px 0; }
[data-theme="dark"] .ai-est { background: #2E2839; color: #B3A3E8; }
.after-review { display: flex; gap: 8px 22px; flex-wrap: wrap; align-items: center; margin: 12px 0; padding-top: 10px; border-top: 1px solid var(--line); }
.after-review p { margin: 0; }
.view-body-label { font-size: 13px; margin-bottom: 4px; }
.timer-hint { font-size: 12px; white-space: nowrap; opacity: 0.85; }
.plan-done-cta { margin-top: 14px; }

/* График прогресса: синие серии в тёмной теме были 1.9-2.9:1 */
[data-theme="dark"] .cab-card svg polyline[stroke="#3D6FD6"], [data-theme="dark"] .report-section svg polyline[stroke="#3D6FD6"] { stroke: #7FA8FF; }
[data-theme="dark"] .cab-card svg polyline[stroke="#33549E"], [data-theme="dark"] .report-section svg polyline[stroke="#33549E"] { stroke: #93A9E8; }
[data-theme="dark"] .cab-card svg circle[fill="#3D6FD6"], [data-theme="dark"] .report-section svg circle[fill="#3D6FD6"] { fill: #7FA8FF; }
[data-theme="dark"] .cab-card svg circle[fill="#33549E"], [data-theme="dark"] .report-section svg circle[fill="#33549E"] { fill: #93A9E8; }
/* Мобила: график скроллится, а не сжимается в полосу */
@media (max-width: 640px) {
  .chart-wrap { overflow-x: auto; }
  .chart-wrap svg { min-width: 620px; }
  .chat-page .quick-btns { flex-wrap: wrap; overflow: visible; }
}
.today-chip { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; background: var(--coral-soft); color: #B04A44; border-radius: 999px; padding: 3px 9px; }
[data-theme="dark"] .today-chip { background: #46362F; color: #F5A19C; }
.fab-close { position: absolute; top: 6px; right: 8px; z-index: 5; width: 30px; height: 30px; border: none; background: transparent; color: var(--ink-faint); font-size: 20px; cursor: pointer; border-radius: 8px; }
.fab-close:hover { background: var(--coral-soft); color: #B04A44; }
/* ===== Аудит: админка ===== */
/* мобильная карточка ученика распиралась до 658px */
.teacher-grid > div { min-width: 0; }
.sub-body, .view-body { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .leads-table td, .leads-table th { min-width: 0; }
  .teacher .inline-form { flex-wrap: wrap; }
  .teacher .inline-form input[type="text"], .teacher .inline-form input[type="url"] { min-width: 0; flex: 1 1 160px; }
  input[type="file"] { max-width: 100%; }
  /* строка занятия в расписании не сплющивает дату */
  .teacher .task-list li { flex-wrap: wrap; }
  .teacher .task-list .task-title { flex-basis: 100%; }
  /* «На сайт» возвращается: с телефона нельзя было открыть свой сайт */
  .site-header:has(.cab-nav) .login-soon { display: inline; }
}
.miro-hint { margin-bottom: 14px; }
/* подписи-лейблы форм конструктора */
.form-label { font-size: 13px; color: var(--ink-faint); margin-bottom: -4px; }
/* интерактивные галочки плана у препода */
.check-btn.teacher-toggle { cursor: pointer; }