/* =====================================================================================================================
   ОФОРМЛЕНИЕ 4.0 (08.10.2026; НА ПРОВЕРКЕ — по умолчанию у всех 3.0). Файл загружается только в версии 4
   (?skdesign=4 или настройка «Оформление платформы»), у страницы тогда классы sk-v2 sk-v3 sk-v4: всё оформление 3.0
   остаётся, здесь — только поправки по итогам обхода всех страниц (docs/оформление-4). Выбранное 3.0 этот файл не видит.
   Главное:
   - ширина по смыслу страницы: списки, пульт и уроки — до 1180 точек, урок и досье — до 1000, формы — как раньше;
   - без серой подложки под содержимым: карточки лежат прямо на молочном фоне;
   - верхнее меню администрации не прячется в «Дополнительно» (переключатель «Режим редактирования» — только в курсах);
   - ночная «Главная»: луна не закрывает «Слово дня» и дату;
   - страницы оплат и остатков — со своим заголовком, без вкладок администрирования платформы;
   - урок: вход и подсказка — сверху карточки, сведения — во всю ширину;
   - отметки посещаемости — крупные цветные кнопки П · О · У · Н и «Все присутствовали» (js/design4.js);
   - телефон: таблицы списков — карточками, вкладки — в одну строку, «слово дня» — компактно;
   - телефон и iPad (09.10.2026, раздел в конце файла): нижняя панель разделов на сенсорных экранах до 1280 точек,
     всё нажимаемое — не ниже 44 точек, сообщения на телефоне — одной колонкой, таблицы до 1024 точек — карточками.
   ===================================================================================================================== */

/* ---------- Ширина: по смыслу страницы ---------- */
@media (min-width: 768px) {
  .sk-v4:is(#page-local-shangke-home, #page-local-shangke-lessons, #page-local-shangke-groups, #page-local-shangke-trials,
      #page-local-shangke-admission_list, #page-local-shangke-timezones, #page-local-shangke-requirements,
      [id^="page-admin-local-shangke-"]) :is(#page.drawers .main-inner, #page-header.header-maxwidth) {
    max-width: 1180px; margin-left: auto; margin-right: auto; }
  .sk-v4:is(#page-local-shangke-lesson, #page-local-shangke-trial, #page-local-shangke-admission, #page-local-shangke-schedule,
      #page-local-shangke-my) :is(#page.drawers .main-inner, #page-header.header-maxwidth) {
    max-width: 1000px; margin-left: auto; margin-right: auto; }
}

/* ---------- Без серой подложки под содержимым ---------- */
.sk-v4 #page #topofscroll, .sk-v4 #page #region-main { background: transparent !important; box-shadow: none; }

/* ---------- Верхнее меню ---------- */
/* переключатель «Режим редактирования» нужен в курсах, а на страницах школы он лишь вытеснял разделы меню
   в «Дополнительно» (у администрации оставались только «Личный кабинет» и «Дополнительно») */
.sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) .editmode-switch-form { display: none !important; }
.sk-v4 .primary-navigation .navigation .nav-link { padding: 0 .8rem; }
@media (min-width: 992px) and (max-width: 1399.98px) {
  .sk-v4 .sk-clock { gap: .4rem; padding: .25rem .65rem; font-size: .88rem; }
}

/* ---------- Заголовки: длинные — чуть меньше и ровными строками ---------- */
.sk-v4 #page-header h1, .sk-v4 .page-header-headings h1 { font-size: clamp(1.7rem, 1.15rem + 1.45vw, 2.4rem); text-wrap: balance; }

/* ---------- Главная: ночь и вечер — луна не закрывает текст ---------- */
.sk-v4 .sk3-hero-night { background-image:
    radial-gradient(1.6px 1.6px at 18% 22%, rgba(255, 255, 255, .85) 1px, transparent 2px),
    radial-gradient(1.4px 1.4px at 34% 70%, rgba(255, 255, 255, .7) 1px, transparent 2px),
    radial-gradient(1.8px 1.8px at 52% 18%, rgba(255, 255, 255, .8) 1px, transparent 2px),
    radial-gradient(1.6px 1.6px at 46% 54%, rgba(255, 255, 255, .75) 1px, transparent 2px),
    radial-gradient(2.4rem 2.4rem at 63% 30%, rgba(255, 244, 214, .92) 45%, rgba(255, 244, 214, .14) 52%, transparent 60%),
    linear-gradient(135deg, #12304f 0%, #081a2c 100%); }
.sk-v4 :is(.sk3-hero-night, .sk3-hero-evening) .sk3-word { background: rgba(3, 16, 28, .42); border-color: rgba(255, 255, 255, .18); }
/* утром и днём за «Словом дня» — светлое пятно солнца: подложка карточки чуть темнее, подпись читается */
.sk-v4 :is(.sk3-hero-morning, .sk3-hero-day) .sk3-word { background: rgba(3, 40, 30, .26); }
@media (max-width: 767.98px) {
  /* на телефоне «слово дня» под приветствием во всю ширину — луна маленькая, в правом верхнем углу */
  .sk-v4 .sk3-hero-night { background-image:
      radial-gradient(1.6px 1.6px at 18% 22%, rgba(255, 255, 255, .85) 1px, transparent 2px),
      radial-gradient(1.4px 1.4px at 34% 70%, rgba(255, 255, 255, .7) 1px, transparent 2px),
      radial-gradient(1.8px 1.8px at 72% 12%, rgba(255, 255, 255, .8) 1px, transparent 2px),
      radial-gradient(1.3rem 1.3rem at 90% 11%, rgba(255, 244, 214, .9) 45%, rgba(255, 244, 214, .12) 52%, transparent 60%),
      linear-gradient(135deg, #12304f 0%, #081a2c 100%); }
}

/* ---------- Главная: «слово дня» на телефоне — одной строкой, ближайший урок виден сразу ---------- */
@media (max-width: 575.98px) {
  .sk-v4 .sk3-word { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: .9rem;
    padding: .7rem 1rem; text-align: left; }
  .sk-v4 .sk3-word-label { grid-column: 1 / -1; margin-bottom: .1rem; }
  .sk-v4 .sk3-word-hanzi { grid-row: 2 / span 2; margin: 0; font-size: 2rem; }
  .sk-v4 .sk3-word-pinyin, .sk-v4 .sk3-word-meaning { grid-column: 2; }
  .sk-v4 .sk3-word .sk3-say { grid-column: 3; grid-row: 2 / span 2; margin: 0; }
}

/* ---------- Главная преподавателя: напоминание об уроках без отметок ---------- */
.sk-v4 .sk4-todo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin: 0 0 1.25rem;
  padding: .9rem 1.2rem; border-radius: var(--sk3-r); background: #fff6f1; border: 1px solid #f6c8b6; color: #7a2b12; font-weight: 600; }

/* ---------- Пульт администрации: плитки ровными рядами ---------- */
/* 20rem: на iPad 10/11" в портрете — две плитки в ряд (при 22rem была одна во всю ширину) */
.sk-v4 .shangke-board { grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: 1.1rem; align-items: stretch; }
.sk-v4 .shangke-board-tile { display: flex; flex-direction: column; }
.sk-v4 .shangke-board-actions { margin-top: auto; padding-top: .9rem; display: flex; flex-wrap: wrap; gap: .5rem; }

/* ---------- Таблицы ---------- */
/* шапка — сплошной полосой: у колонки действий заголовка нет, и там был белый разрыв */
.sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) table.generaltable > thead > tr { background: #eef6f1; }
.sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) #region-main table.generaltable { width: 100%; }
.sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) table.generaltable :is(th, td) { padding: .7rem .85rem; vertical-align: middle; }

/* ---------- Пометки уроков: у каждой свой цвет ---------- */
.sk-v4 .shangke-chip.shangke-l-extra { background: #f1ecfb; border-color: #d9cdf3; color: #5b3f99; }   /* дополнительный */
.sk-v4 .shangke-chip.shangke-l-moved { background: #eaf1fb; border-color: #c7d8f2; color: #234f86; }   /* перенесён */

/* ---------- Дни в расписании и уроках: точка вместо значка календаря ---------- */
.sk-v4 .shangke-day::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--sk3-peach-deep);
  box-shadow: 0 0 0 3px rgba(255, 185, 138, .32); }

/* карточка урока не «приподнимается» при наведении: нажимаются её кнопки, а не она сама */
.sk-v4 .shangke-lesson:hover { transform: none; box-shadow: var(--sk3-shadow); }

/* ---------- Урок и пробный урок: вход сверху карточки, сведения — во всю ширину ---------- */
.sk-v4 .shangke-trial-teacher { display: flex; flex-direction: column-reverse; gap: 1rem; }
.sk-v4 .shangke-trial-teacher .shangke-trial-side { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem;
  padding-bottom: 1rem; border-bottom: 1px dashed rgba(6, 57, 43, .14); }
.sk-v4 .shangke-trial-teacher .shangke-trial-side:empty { display: none; }
.sk-v4 .shangke-dl { grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr); gap: .6rem 1.4rem; }
.sk-v4 .shangke-dl dd > div + div { margin-top: .3rem; }
.sk-v4 .shangke-wait { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem .95rem; border-radius: 999px;
  background: #fff4ec; color: #8a3f1b; font-weight: 600; }
.sk-v4 .shangke-wait::before { content: "🔒"; font-size: .95rem; }
@media (max-width: 575.98px) { .sk-v4 .shangke-dl { grid-template-columns: minmax(0, 1fr); gap: .15rem; } .sk-v4 .shangke-dl dd { margin-bottom: .6rem; } }

/* ---------- Отметки посещаемости: крупные цветные кнопки ---------- */
.sk-v4 .shangke-mark-options { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .45rem; }
.sk-v4 .shangke-mark { justify-content: center; min-height: 2.75rem; padding: .35rem .6rem; border-radius: .95rem; text-align: center;
  border: 1.5px solid rgba(6, 57, 43, .14); background: #fff; font-size: .92rem; line-height: 1.2; }
.sk-v4 .shangke-mark input { position: absolute; opacity: 0; pointer-events: none; }
.sk-v4 .shangke-mark b { font: 700 1.1rem/1 Jost, Manrope, sans-serif; margin-right: .15rem; }
.sk-v4 .shangke-mark:focus-within { outline: 3px solid rgba(243, 154, 92, .65); outline-offset: 2px; }
.sk-v4 .shangke-mark.sk4-p:has(input:checked) { background: #e3f3ea; border-color: #2f9a74; color: #06392b; }
.sk-v4 .shangke-mark.sk4-o:has(input:checked) { background: #fff3e0; border-color: #e7a33c; color: #7a4a06; }
.sk-v4 .shangke-mark.sk4-u:has(input:checked) { background: #eaf1fb; border-color: #5d8fd4; color: #1d4a7c; }
.sk-v4 .shangke-mark.sk4-n:has(input:checked) { background: #fbe9ee; border-color: #d0567b; color: #8f1239; }
.sk-v4 .shangke-mark-row { padding: .8rem 0; border-bottom: 1px solid rgba(6, 57, 43, .07); }
.sk-v4 .sk4-markbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; }
.sk-v4 .sk4-markdone { color: var(--sk3-jade); font-weight: 600; }
@media (max-width: 575.98px) { .sk-v4 .shangke-mark-options { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* до 1200 точек кнопки отметок — под именем ученика во всю ширину: рядом с именем на iPad в портрете и на телефоне
   в альбомной ориентации надписи «Присутствовал», «Уважительная причина» не помещались и наезжали друг на друга */
@media (max-width: 1199.98px) { .sk-v4 .shangke-mark-row { grid-template-columns: minmax(0, 1fr); gap: .45rem; } }

/* ---------- Пусто: спокойная карточка с иероглифом 空 («пусто») ---------- */
.sk-v4[id^="page-local-shangke-"] #region-main .alert-info:not(.alert-dismissible) { display: flex; align-items: center; gap: 1rem;
  padding: 1.1rem 1.35rem; border: 1px dashed rgba(11, 90, 67, .28); border-radius: var(--sk3-r); background: rgba(255, 255, 255, .72);
  color: #31463d; }
.sk-v4[id^="page-local-shangke-"] #region-main .alert-info:not(.alert-dismissible)::before { content: "空"; flex: none;
  font: 700 2.2rem/1 "Noto Serif SC", "Songti SC", "SimSun", serif; color: rgba(11, 90, 67, .28); }

/* ---------- Оплаты, остатки, перенос сведений: свой заголовок, без вкладок администрирования платформы ---------- */
.sk-v4[id^="page-admin-local-shangke-"] .secondary-navigation,
.sk-v4[id^="page-admin-local-shangke-"] #page-header .page-header-headings { display: none; }
.sk-v4[id^="page-admin-local-shangke-"] [role="main"] > h2:first-of-type { margin: .1rem 0 1.25rem;
  font: 600 clamp(1.7rem, 1.15rem + 1.45vw, 2.4rem)/1.15 Jost, Manrope, sans-serif; letter-spacing: -.01em; color: var(--sk3-jade-deep); }
.sk-v4[id^="page-admin-local-shangke-"] [role="main"] > h2:first-of-type::after { content: ""; display: block; width: 3.5rem; height: .4rem;
  margin-top: .55rem; border-radius: 999px; background: linear-gradient(90deg, var(--sk3-peach), #c98aa0); }

/* ---------- Левое меню курса: тёплое, как страницы платформы ---------- */
.sk-v4 .drawer.drawer-left { background-color: #fffcf7; border: 1px solid var(--sk3-line); box-shadow: var(--sk3-shadow); }

/* ---------- Восстановление пароля: карточка, как у входа ---------- */
.sk-v4#page-login-forgot_password [role="main"] { max-width: 34rem; margin: 0 auto; }

/* ---------- Телефон ---------- */
@media (max-width: 767.98px) {
  /* вкладки разделов — одной строкой с прокруткой, а не в три ряда */
  .sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) [role="main"] .nav-tabs { flex-wrap: nowrap; overflow-x: auto;
    scrollbar-width: none; padding-bottom: .2rem; background: transparent; }
  .sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) [role="main"] .nav-tabs::-webkit-scrollbar { display: none; }
  .sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) [role="main"] .nav-tabs .nav-link { white-space: nowrap; }
  /* кнопки над списком уроков — компактнее, неделя — одной строкой */
  .sk-v4 .shangke-filter { gap: .45rem; }
  .sk-v4 .shangke-filter .btn { padding: .42rem .95rem; font-size: .92rem; }
  .sk-v4 .shangke-weeknav { gap: .45rem; }
  .sk-v4 .shangke-weeknav .shangke-weeklabel { order: -1; flex-basis: 100%; font-size: 1.05rem; }
  .sk-v4 .shangke-weeknav .btn { white-space: nowrap; }
}

/* ---------- Телефон и iPad до 1024 точек: таблицы списков школы — карточками ---------- */
/* (на iPad 10/11" в портрете таблица «Ученики и группы» была шире страницы — колонки «Осталось» и «Открыть ·
   Редактировать» обрезались); подписи колонок добавляет js/design4.js: класс sk4-cards и data-label */
@media (max-width: 1023.98px) {
  .sk-v4 table.generaltable.sk4-cards, .sk-v4 table.sk4-cards > tbody, .sk-v4 table.sk4-cards > tbody > tr,
  .sk-v4 table.sk4-cards > tbody > tr > td { display: block; width: 100%; }
  .sk-v4 table.generaltable.sk4-cards { overflow: visible; border: 0 !important; background: transparent !important; box-shadow: none !important; }
  .sk-v4 table.sk4-cards > tbody { border: 0; }
  .sk-v4 table.sk4-cards > thead { display: none; }
  .sk-v4 table.sk4-cards > tbody > tr { margin: 0 0 .8rem; padding: .75rem .95rem; background: #fff; border: 1px solid var(--sk3-line);
    border-radius: 1.15rem; box-shadow: var(--sk3-shadow); }
  /* подпись колонки — слева, содержимое ячейки (js/design4.js собирает его в один блок .sk4-cell) — справа */
  .sk-v4 #region-main table.sk4-cards > tbody > tr > td { display: grid; grid-template-columns: 7.2rem minmax(0, 1fr); column-gap: .7rem;
    align-items: start; min-width: 0; padding: .34rem 0; border: 0; background: transparent; text-align: left; }
  .sk-v4 table.sk4-cards > tbody > tr > td::before { content: attr(data-label); color: #6b7570; font-size: .8rem; font-weight: 700;
    line-height: 1.3; padding-top: .12rem; }
  .sk-v4 #region-main table.sk4-cards > tbody > tr > td.sk4-nolabel { grid-template-columns: minmax(0, 1fr); }
  .sk-v4 table.sk4-cards > tbody > tr > td.sk4-nolabel::before { content: none; }
  .sk-v4 table.sk4-cards > tbody > tr > td:first-child { font-size: 1.05rem; }
  .sk-v4 table.sk4-cards > tbody > tr:hover > td { background: transparent; }
  /* ячейка действий («Открыть · Редактировать», 09.10.2026): ссылки — кнопками под пальцем, «Открыть» — главная;
     разделители «·» между ссылками скрыты (размер шрифта блока — 0, у ссылок — свой) */
  .sk-v4 #region-main table.sk4-cards > tbody > tr > td.sk4-actions .sk4-cell { display: flex; flex-wrap: wrap; gap: .5rem;
    padding-top: .35rem; font-size: 0; }
  .sk-v4 table.sk4-cards td.sk4-actions a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 1.15rem;
    border-radius: 999px; border: 1.5px solid rgba(11, 90, 67, .2); background: #fff; color: var(--sk3-jade); font-size: .95rem;
    font-weight: 700; text-decoration: none; }
  .sk-v4 table.sk4-cards td.sk4-actions a:first-child { border-color: transparent; color: #fff;
    background: linear-gradient(135deg, var(--sk3-jade), var(--sk3-jade-glow)); }
}

/* =====================================================================================================================
   ТЕЛЕФОН И iPad (09.10.2026). Обход 22 страниц всех ролей на 12 экранах (docs/оформление-4/devices.sh): телефоны
   360–430 точек и в альбомной ориентации, iPad mini, iPad 10/11 и Air 11", iPad Pro 11" и 13" — в портрете и в альбомной.
   - На iPad в портрете (а также на iPad mini и iPad 11" в альбомной и на телефоне в альбомной) верхнее меню целиком
     пряталось в «Дополнительно», нижней панели не было — теперь на сенсорном экране до 1280 точек, как на телефоне,
     нижняя панель разделов и кнопка меню.
   - 29 % нажимаемых элементов были ниже 44 точек (Apple: не меньше 44 × 44 pt; Google: 48 × 48 dp; WCAG 2.2 — 2.5.8 и 2.5.5):
     на сенсорном экране кнопки, вкладки, пункты меню, «Послушать», значки и часы верхней строки — от 44 точек.
   - Поля ввода на сенсорном экране — не мельче 16 px (иначе Safari на iPhone и iPad увеличивает страницу при вводе).
   - На сенсорном экране карточки не «приподнимаются» при наведении (после касания эффект залипал).
   - Телефон: сообщения — одной колонкой (список бесед → переписка, «×» — назад); время пробного урока — одной строкой.
   - iPad: карточки уроков преподавателя и администрации — в две строки (кнопки — отдельной строкой снизу), таблицы
     списков — карточками в две колонки, «Слово дня» — справа от приветствия.
   - Закреплённая верхняя строка не закрывает начало раздела при переходе по ссылке «#…» (например, к отметкам).
   Сенсорный экран — (pointer: coarse): так определяется и iPad, который представляется браузеру компьютером Mac;
   с подключённой мышью или трекпадом iPad работает как компьютер (верхнее меню, обычные размеры).
   ===================================================================================================================== */

/* переход по ссылке «#раздел» — с отступом под закреплённую верхнюю строку */
html:has(> body.sk-v4) { scroll-padding-top: 5rem; }

/* ---------- Нижняя панель на телефоне и iPad mini в портрете: по центру и не шире 38rem ---------- */
@media (max-width: 767.98px) {
  .sk-v4 .sk3-tabbar { left: 50%; right: auto; width: min(38rem, calc(100% - 1.2rem)); transform: translateX(-50%); }
}

/* ---------- Сенсорный экран 768–1279 точек: нижняя панель разделов и кнопка меню вместо верхнего меню ---------- */
/* (все iPad в портрете, iPad mini, iPad 10/11, Air 11" и Pro 11" — и в альбомной: 1133–1210 точек; телефон в альбомной;
   iPad 13" в альбомной — 1366–1376 точек — остаётся с верхним меню, оно там помещается) */
@media (pointer: coarse) and (min-width: 768px) and (max-width: 1279.98px) {
  .sk-v4 .primary-navigation { display: none; }
  .sk-v4 .sk3-tabbar { position: fixed; left: 50%; bottom: calc(.75rem + env(safe-area-inset-bottom)); z-index: 1040; display: flex;
    justify-content: space-around; width: min(38rem, calc(100% - 1.5rem)); padding: .35rem .3rem; transform: translateX(-50%);
    border-radius: 1.4rem; border: 1px solid var(--sk3-line); background: rgba(255, 253, 249, .92);
    -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px);
    box-shadow: 0 16px 40px -18px rgba(4, 38, 29, .55); }
  .sk-v4 .sk3-tab { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem;
    min-height: 3.1rem; padding: .35rem 0 .3rem; border-radius: 1rem; color: #6b7570; font-size: .76rem; font-weight: 700;
    text-decoration: none; }
  .sk-v4 .sk3-tab svg { width: 1.5rem; height: 1.5rem; fill: currentColor; }
  .sk-v4 .sk3-tab-active { color: var(--sk3-jade); background: #e7f3ed; }
  /* отступ под панелью — у всей страницы; у нижнего блока платформы (#page-footer) — нет: на iPad он пустой и был белой полосой */
  .sk-v4 #page { padding-bottom: 6rem; }
  .sk-v4 #page-footer { padding-bottom: 0; }
  .sk-v4 .btn-footer-popover, .sk-v4 [data-region="footer-container-popover"] { bottom: 6.6rem !important; }
}

/* ---------- Телефон в альбомной ориентации (высота до 500 точек): панель — одной строкой, «герой» — ниже ---------- */
@media (pointer: coarse) and (max-height: 500px) {
  .sk-v4 .sk3-tabbar { bottom: calc(.4rem + env(safe-area-inset-bottom)); width: min(36rem, calc(100% - 1.5rem)); padding: .25rem; }
  .sk-v4 .sk3-tab { flex-direction: row; gap: .45rem; min-height: 2.75rem; padding: .2rem .45rem; font-size: .8rem; }
  .sk-v4 .sk3-tab svg { width: 1.2rem; height: 1.2rem; }
  .sk-v4 #page { padding-bottom: 4.4rem; }
  .sk-v4 #page-footer { padding-bottom: 0; }
  .sk-v4 .btn-footer-popover, .sk-v4 [data-region="footer-container-popover"] { bottom: 4.7rem !important; }
  .sk-v4 .sk3-hero { padding: 1rem 1.5rem; margin-bottom: 1rem; }
  .sk-v4 .sk3-hero-title { font-size: 1.6rem; }
  .sk-v4 .sk3-word { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: .9rem;
    padding: .6rem 1rem; text-align: left; }
  .sk-v4 .sk3-word-label { grid-column: 1 / -1; margin-bottom: .1rem; }
  .sk-v4 .sk3-word-hanzi { grid-row: 2 / span 2; margin: 0; font-size: 2rem; }
  .sk-v4 .sk3-word-pinyin, .sk-v4 .sk3-word-meaning { grid-column: 2; }
  .sk-v4 .sk3-word .sk3-say { grid-column: 3; grid-row: 2 / span 2; margin: 0; }
}

/* ---------- Сенсорный экран: всё нажимаемое — не ниже 44 точек, поля ввода — от 16 px ---------- */
@media (pointer: coarse) {
  .sk-v4 { -webkit-tap-highlight-color: rgba(11, 90, 67, .12); }
  .sk-v4 .btn { min-height: 2.75rem; padding-top: .6rem; padding-bottom: .6rem; }
  .sk-v4 :is(.btn-sm, .btn-group-sm > .btn) { padding-top: .66rem; padding-bottom: .66rem; }
  .sk-v4 .btn.btn-icon { min-width: 2.75rem; }
  .sk-v4 .shangke-filter .btn { padding-top: .6rem; padding-bottom: .6rem; }
  /* верхняя строка: кнопка меню, колокольчик, сообщения, часы, разделы меню (на iPad Pro 13" в альбомной) */
  .sk-v4 .navbar :is(.navbar-toggler, .popover-region-toggle) { min-width: 2.75rem; min-height: 2.75rem; }
  .sk-v4 .sk-clock { min-height: 2.75rem; }
  .sk-v4 .primary-navigation .navigation .nav-link { height: 2.75rem; margin-top: .5rem; margin-bottom: .5rem; }
  /* меню-«гамбургер»: пункты выше */
  .sk-v4 .drawer-primary .drawercontent .list-group .list-group-item { min-height: 3rem; padding-top: .8rem; padding-bottom: .8rem; }
  /* вкладки разделов школы («По неделям · Без отметок…») */
  .sk-v4:is([id^="page-local-shangke-"], [id^="page-admin-local-shangke-"]) [role="main"] .nav-tabs .nav-link {
    display: flex; align-items: center; min-height: 2.75rem; }
  /* «Послушать» в «Слове дня», «×» в переписке, значок календаря у дат */
  .sk-v4 .sk3-say { min-height: 2.75rem; padding: .55rem 1.1rem; }
  .sk-v4 .section-collapsemenu { padding-top: .875rem; padding-bottom: .875rem; }   /* курс: «Свернуть всё / Развернуть всё» */
  .sk-v4 .message-app [data-route-back] { min-width: 2.75rem; min-height: 2.75rem; justify-content: center; }
  .sk-v4.jsenabled :is(.fdate_selector, .fdate_time_selector) a.visibleifjs { display: inline-flex; align-items: center;
    justify-content: center; min-width: 2.75rem; min-height: 2.75rem; }
  /* поля: 16 px и больше — Safari на iPhone и iPad тогда не увеличивает страницу при вводе */
  .sk-v4 :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"]), select, textarea) {
    font-size: max(16px, 1em); }
  .sk-v4 .sk3-tab:active { background: #eef6f1; }
}

/* ---------- Сенсорный экран без наведения: карточки и кнопки не «приподнимаются» (эффект залипал после касания) ---------- */
@media (hover: none) {
  .sk-v4 :is(.shangke-lesson, .shangke-tile, .shangke-board-tile, .dashboard-card, .course-card, .sk3-course, .btn):hover { transform: none; }
}

/* ---------- Телефон и сенсорный экран до 1280 точек: кнопка меню видна (на iPad — вместо верхнего меню), значок по центру;
   на страницах оплат и остатков нет кнопки панели «Закладки администратора» — она закрывала поля формы ---------- */
@media (max-width: 767.98px), (pointer: coarse) and (max-width: 1279.98px) {
  .sk-v4 .navbar .navbar-toggler[data-target="theme_boost-drawers-primary"] { display: inline-flex !important; align-items: center;
    justify-content: center; }
  .sk-v4[id^="page-admin-local-shangke-"] .drawer-toggles .drawer-right-toggle { display: none !important; }
  /* переключатель «Режим редактирования» в верхней строке — только в курсе: на сообщениях, профиле и т. п. он лишь
     теснил часы и значки администрации */
  .sk-v4:not([id^="page-course-view"]) .editmode-switch-form { display: none !important; }
}

/* ---------- Телефон ---------- */
@media (max-width: 575.98px) {
  /* время пробного урока — одной строкой (на 360 точках «22:57 — 23:27» переносилось на две) */
  .sk-v4 .sk-when-time { font-size: clamp(1.6rem, 8.2vw, 2.3rem); white-space: nowrap; }
  /* кнопки урока — ровным рядом во всю ширину карточки */
  .sk-v4 .shangke-l-row .shangke-l-actions { max-width: none; gap: .5rem; }
  .sk-v4 .shangke-l-row .shangke-l-actions .btn { flex: 1 1 auto; }
}
@media (max-width: 767.98px) {
  /* кнопки над списком уроков и групп — ровными рядами */
  .sk-v4 .shangke-filter > .btn { flex: 1 1 auto; }
}

/* ---------- Телефон: сообщения — одной колонкой (в ядре платформы всегда две, список был шириной 117 точек) ---------- */
@media (max-width: 699.98px), (pointer: coarse) and (max-height: 500px) {
  /* окно сообщений — на высоту экрана (за вычетом верхней строки и нижней панели), а не 400 точек */
  .sk-v4#page-message-index .message-app.main { min-height: max(25rem, calc(100vh - 12.5rem)); min-height: max(25rem, calc(100dvh - 12.5rem)); }
  .sk-v4#page-message-index .message-app .row > .col-4 { flex: 0 0 100%; width: 100%; max-width: 100%; }
  .sk-v4#page-message-index .message-app .row > .col-8 { display: none !important; }
  /* открыта беседа, собеседники или настройки (правая часть экрана) — показываем её во всю ширину, список скрываем */
  .sk-v4#page-message-index .message-app .row:has(> .col-8 > .header-container > [data-region]:not(.hidden)) > .col-4 { display: none !important; }
  .sk-v4#page-message-index .message-app .row:has(> .col-8 > .header-container > [data-region]:not(.hidden)) > .col-8 {
    display: flex !important; flex: 0 0 100%; width: 100%; max-width: 100%; }
}

/* ---------- 576 точек и шире: «Слово дня» справа от приветствия ---------- */
/* длинная строка даты («пятница 9 октября 2026 · Новосибирск 18:27 · По Москве 14:27») теперь переносится, а не сталкивает
   карточку слова вниз — на iPad 10/11" в портрете «герой» был вдвое выше */
@media (min-width: 576px) {
  .sk-v4 .sk3-hero { flex-wrap: nowrap; }
  .sk-v4 .sk3-hero-text { flex: 1 1 auto; min-width: 0; }
  .sk-v4 .sk3-word { flex: none; }
}

/* ---------- 576–1199 точек: время пробного урока в двух карточках «По Москве / У тебя» — одной строкой ---------- */
/* (на iPad 10/11" в портрете «22:57 — 23:27» переносилось на две строки в каждой карточке) */
@media (min-width: 576px) and (max-width: 1199.98px) {
  .sk-v4 .sk-when-time { font-size: clamp(1.8rem, 1rem + 2.2vw, 2.6rem); white-space: nowrap; }
}

/* ---------- До 1200 точек: досье поступления — сведения во всю ширину, куратор и кнопки — строкой под ними ---------- */
/* (на iPad 10/11" в портрете колонка куратора справа сжимала «Путь абитуриента» до слова в строке) */
@media (max-width: 1199.98px) {
  .sk-v4 .shangke-adm-head { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .sk-v4 .shangke-adm-head > .shangke-trial-side { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem;
    padding-top: 1rem; border-top: 1px dashed rgba(6, 57, 43, .14); }
}

/* ---------- iPad и телефон в альбомной (576–1023 точки) ---------- */
@media (min-width: 576px) and (max-width: 1023.98px) {
  /* карточка урока преподавателя и администрации — в две строки: время и состав, ниже — кнопки (на iPad в портрете имя
     ученика и состав группы сжимались до слова в строке) */
  .sk-v4 .shangke-l-row, .sk-v4 .shangke-l-row:has(.sk-t-local) { grid-template-columns: minmax(0, 13.5rem) minmax(0, 1fr); }
  .sk-v4 .shangke-l-row > .shangke-l-actions { grid-column: 1 / -1; max-width: none; justify-content: flex-start; gap: .5rem;
    padding-top: .65rem; border-top: 1px dashed rgba(6, 57, 43, .12); }
  .sk-v4 .shangke-l-row > .shangke-l-actions:empty { display: none; }
  /* таблицы-карточки — в две колонки, подпись колонки — уже */
  .sk-v4 table.sk4-cards > tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; align-items: start; }
  .sk-v4 table.sk4-cards > tbody > tr { margin: 0; }
  .sk-v4 #region-main table.sk4-cards > tbody > tr > td { grid-template-columns: 6.4rem minmax(0, 1fr); }
}