/* ═══════════════════════════════════════════════════════════
   Rocket CDN · демо-полёт, оформление

   Полёт - отдельная сцена поверх сайта: чёрный кадр, холст на
   весь экран, тонкий HUD в фирменной палитре и панель кабины
   снизу. Всё движение холста считает rc-flight.js, здесь только
   вид и переходы входа-выхода.

   ── Одна комната на три сцены ────────────────────────────────
   Аудит финальной сцены поймал главное: салон рубки, секция пульта
   и кабина игры шли подряд и читались как три разных сайта. У них
   не совпадали ни цвет стен, ни цветовая температура: рубка синяя
   и насыщенная, кабина игры - серо-бирюзовая и вымытая.

   Поэтому здесь больше нет собственных чисел цвета. Палитра рубки
   объявлена ровно один раз в rc-interior.js (объект COL) и оттуда
   публикуется в CSS: --int-deep / --int-hull / --int-wall /
   --int-panel / --int-emis / --int-cyan / --int-vio / --int-lit,
   плюс те же с суффиксом -rgb для rgba(). Кабина берёт те же числа,
   значит физически не может разойтись с рубкой по тону. Запасное
   значение через запятую оставлено на случай, если объёмный слой
   не поднялся: rc-interior.js грузится перед rc-flight.js, но
   оформление обязано быть в тон даже без него.

   Своими остаются только сигнальные цвета - зелёный «готово» и
   янтарный сканер. Это не отделка комнаты, а показания приборов:
   они и должны выбиваться из стенового тона, иначе их не заметить.
   ═══════════════════════════════════════════════════════════ */

/* Две ступени фирменного циана - блик и тень на выпуклых клавишах.
   Считаются из --int-cyan, чтобы правка палитры доезжала и сюда.
   Литералы объявлены первыми и остаются в старом браузере: если
   color-mix не поддержан, @supports просто не сработает. */
.rc-flight, .rcf-fab, .rcf-cta {
  --rcf-cy-hi: #7BD1EC;   /* циан, подсвеченный светом остекления */
  --rcf-cy-lo: #2C8FB8;   /* циан в тени, нижняя ступень клавиши */
}
@supports (color: color-mix(in srgb, red, blue)) {
  .rc-flight, .rcf-fab, .rcf-cta {
    --rcf-cy-hi: color-mix(in srgb, var(--int-cyan, #42B2DC) 58%, var(--int-lit, #CFE9F5));
    --rcf-cy-lo: color-mix(in srgb, var(--int-cyan, #42B2DC) 74%, var(--int-deep, #050C15));
  }
}

.rc-flight {
  position: fixed; inset: 0; z-index: 220;
  background: var(--int-deep, #050C15);
  opacity: 0; visibility: hidden;
  pointer-events: none;
  transition: opacity .7s var(--ease), visibility 0s linear .7s;
  overscroll-behavior: contain;
  touch-action: none;
  cursor: crosshair;
}
.rc-flight.on {
  opacity: 1; visibility: visible;
  pointer-events: auto;
  transition: opacity .7s var(--ease);
}

/* Reliability holograms finish before the pressure door exposes the
   tunnel. Leaving them in the aperture made readable content look
   pasted to the rocket and hid the very geometry the camera enters. */
html.rc-gate-out .rc-gate,
html.rc-gate-out #reliability .cin-world > .cin-item.cin-holo {
  opacity: 0 !important;
  pointer-events: none !important;
  filter: blur(5px) brightness(1.65) !important;
  transition: opacity .28s linear, filter .28s linear !important;
}
/* Стык из финала обязан быть бесшовным: человек уже сидит в этой
   кабине, перед этим же остеклением, и «проявление» игры поверх
   сайта выдаёт подмену - на полсекунды видны два кадра сразу.
   Из акта отлёта включаем игру мгновенно: рамка на экране уже
   стоит, меняется только то, что за стеклом. */
html[data-act="egress"] .rc-flight.on {
  transition: none;
}
/* И сам сайт под ней гасим сразу, а не ждём конца проявления */
html[data-act="egress"].rc-flying #rocketCanvas,
html[data-act="egress"].rc-flying .rc-cockpit {
  opacity: 0 !important;
  transition: opacity .25s linear;
}
.rcf-cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* ── Оптика остекления ───────────────────────────────────────
   Слой лежит между космосом и корпусом кабины: это поведение
   стекла и объектива, а не украшение поверх корабля. Корпус выше
   по стопке и остаётся резким.

   Постпроцессинга здесь нет намеренно. Полноценный проход по кадру
   (bloom, аберрация, зерно) на телефоне стоит трети бюджета, а весь
   нужный эффект набирается двумя заливками и одним спрайтом,
   которые браузер растрирует один раз и дальше только меняет
   прозрачность. Управляют ими три переменные, которые кадр игры
   обновляет: --rcf-warp (ход корабля), --rcf-glow и --rcf-gx/gy
   (положение и сила блика от светила). */
.rcf-fx {
  position: absolute; inset: 0;
  pointer-events: none;
  overflow: hidden;
  /* Слой перерисовывается каждый кадр по переменным: изолируем его
     от остальной страницы, чтобы браузер не пересчитывал раскладку
     соседей. Размер не изолируем - он берётся из inset. */
  contain: layout paint;
}
/* Виньетка. На дрейфе она едва заметна - просто края объектива;
   на разгоне поджимается и сужает кадр, отчего скорость читается
   даже на неподвижной картинке. */
.rcf-fx::before {
  content: ''; position: absolute; inset: -2%;
  background: radial-gradient(ellipse 86% 76% at 50% 50%,
    transparent 40%, rgba(2, 6, 14, .55) 78%, rgba(2, 6, 14, .95) 100%);
  /* Сглаживание делает игра (значение доводится лениво в кадре), а
     не CSS-переход: перезапускать переход шестьдесят раз в секунду
     значит держать браузер в вечном пересчёте анимации. */
  opacity: calc(.16 + var(--rcf-warp, 0) * .74);
}
/* Расхождение цвета по краям кадра: у широкоугольной оптики
   короткие волны уходят к одному краю, длинные к другому. Держим
   очень слабым - заметная аберрация читается поломкой экрана, а не
   скоростью. Режимов смешивания нет: на тёмном космосе обычная
   заливка складывается визуально так же, а стоит вчетверо дешевле. */
.rcf-fx::after {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 46% 108% at -6% 50%, rgba(96, 198, 255, .55), transparent 64%),
    radial-gradient(ellipse 46% 108% at 106% 50%, rgba(255, 132, 96, .48), transparent 64%);
  opacity: calc(var(--rcf-warp, 0) * .26);
}
/* Блик от светила: пролетая мимо звезды, ловим её в остекление.
   Ядро засветки плюс анаморфный луч поперёк - так ведёт себя
   реальный объектив, и именно по этому лучу глаз узнаёт «солнце
   в кадре», а не просто светлое пятно. */
.rcf-glare {
  position: absolute;
  left: var(--rcf-gx, 50%); top: var(--rcf-gy, 50%);
  width: 54vmax; height: 54vmax; margin: -27vmax 0 0 -27vmax;
  display: block;
  background: radial-gradient(circle,
    rgba(255, 246, 224, .55) 0%,
    rgba(255, 214, 152, .20) 16%,
    rgba(255, 172, 96, .06) 38%,
    transparent 66%);
  opacity: var(--rcf-glow, 0);
}
.rcf-glare::after {
  content: ''; position: absolute; left: 4%; right: 4%; top: 50%;
  height: 2px; margin-top: -1px;
  background: linear-gradient(90deg, transparent,
    rgba(180, 222, 255, .55) 26%, rgba(255, 255, 255, .9) 50%,
    rgba(180, 222, 255, .55) 74%, transparent);
  filter: blur(1px);
  transform: scaleY(calc(1 + var(--rcf-glow, 0) * 3));
}
/* Упрощённые режимы страницы и просьба меньше движения: слоя нет
   вовсе, чтобы не платить за него ни одной заливкой. Порог тот же,
   что у фонового космоса и у шлейфа в rc-flight.js. */
@media (prefers-reduced-motion: reduce) {
  .rcf-fx { display: none; }
}
html[data-degrade="2"] .rcf-fx,
html[data-degrade="3"] .rcf-fx,
html.rc-reduced .rcf-fx { display: none; }

/* Пока сайт в полёте, страница под ним не прокручивается и не
   тратит ни кадра на свои сцены */
html.rc-flying { overflow: hidden; }
html.rc-flying body { overflow: hidden; }

/* ── Кабина ──────────────────────────────────────────────────
   Присутствие корабля: тонкий силуэт панели снизу и лёгкое
   затемнение углов, будто смотришь из рубки. Панель оседает на
   разгоне на пару пикселей - перегрузка. */
.rcf-cockpit {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 140% 100% at 50% 42%, transparent 64%, rgba(var(--int-deep-rgb, 5,12,21), .85) 100%);
}
.rcf-cockpit::after {
  /* The lower console is RC_CABIN geometry. The former WebP strip
     was a second panel pasted over that geometry. */
  content: none;
}
/* Стойки кабины по краям: едва заметные тёмные рёбра */
.rcf-cockpit::before {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(100deg, rgba(var(--int-deep-rgb, 5,12,21), .8) 0%, transparent 7%),
    linear-gradient(260deg, rgba(var(--int-deep-rgb, 5,12,21), .8) 0%, transparent 7%);
}

/* ── HUD ─────────────────────────────────────────────────────ы */
.rcf-hud {
  position: absolute; left: 0; right: 0; bottom: 0; top: 0;
  pointer-events: none;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
/* Титул сцены - голограмма: проекция из приборов, а не плашка
   интерфейса. Сканлайны маской, циановое свечение, тонкие скобки
   по краям и лёгкое дыхание яркости. Появление - разворачивание
   по вертикали, как включение проектора. */
.rcf-cap {
  position: absolute; left: 50%; top: clamp(14px, 4vh, 40px);
  transform: translateX(-50%);
  color: var(--int-lit, #CFE9F5);
  font-size: clamp(11px, 1.4vw, 14px);
  letter-spacing: .18em;
  white-space: nowrap;
  padding: 10px 22px;
  background: linear-gradient(180deg, rgba(var(--int-cyan-rgb, 66,178,220), .10), rgba(var(--int-cyan-rgb, 66,178,220), .03) 55%, rgba(var(--int-cyan-rgb, 66,178,220), .08));
  border-top: 1px solid rgba(var(--int-lit-rgb, 207,233,245), .5);
  border-bottom: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .25);
  text-shadow: 0 0 12px rgba(var(--int-cyan-rgb, 66,178,220), .9), 0 0 30px rgba(var(--int-cyan-rgb, 66,178,220), .4);
  -webkit-mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.62) 2px 3px);
  mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.62) 2px 3px);
  opacity: 0;
}
/* Скобки титра стояли ВНЕ коробки, на девять точек в каждую сторону,
   и упирались в срез HUD: колонка титра выходила за свою ширину на
   восемь точек, а скобки уходили под кромку. Убираем их внутрь -
   места в отступе 22 точки на это хватает с запасом. */
.rcf-cap::before, .rcf-cap::after {
  content: ''; position: absolute; top: -1px; bottom: -1px; width: 8px;
  border: 1px solid rgba(var(--int-lit-rgb, 207,233,245), .7);
}
.rcf-cap::before { left: 3px; border-right: 0; }
.rcf-cap::after { right: 3px; border-left: 0; }
.rcf-cap.in { animation: rcfCap .55s var(--ease) forwards, rcfHoloBreath 3.4s ease-in-out .55s infinite; }
@keyframes rcfCap {
  from { opacity: 0; transform: translateX(-50%) scaleY(.4); filter: brightness(2.2); }
  55%  { opacity: 1; transform: translateX(-50%) scaleY(1.04); }
  to   { opacity: 1; transform: translateX(-50%) scaleY(1); filter: brightness(1); }
}
@keyframes rcfHoloBreath {
  0%, 100% { opacity: 1; } 50% { opacity: .82; }
}

.rcf-track {
  position: absolute; left: 50%; bottom: 1.6%;
  transform: translateX(-50%);
  width: min(380px, 48vw); height: 2px;
  background: rgba(var(--int-lit-rgb, 207,233,245), .16);
  border-radius: 2px;
}
.rcf-track i {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--int-cyan, #42B2DC), var(--int-vio, #8A59F6));
  border-radius: 2px;
  box-shadow: 0 0 12px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}

/* Подсказка управления стоит в остеклении, а не на приборной
   панели: на 16% строка ложилась ровно на тумблеры кабины и
   переставала читаться - тёмный текст на тёмных клавишах. */
.rcf-hint {
  position: absolute; left: 50%; bottom: 23%;
  transform: translateX(-50%);
  color: rgba(var(--int-lit-rgb, 207,233,245), .75);
  font-size: clamp(11px, 1.3vw, 13px);
  letter-spacing: .06em;
  white-space: nowrap;
  animation: rcfPulse 2.4s ease-in-out infinite;
  transition: opacity .6s var(--ease);
  /* Подсказка стоит ровно там, где человек ведёт пальцем, - ловить
     касания она не имеет права */
  pointer-events: none;
}
/* Гасим вместе с анимацией. Без снятия анимации подсказка не гасла
   вовсе: пульсация тоже ведёт прозрачность, а анимация сильнее
   обычного объявления - класс off ставился, а надпись продолжала
   мигать поперёк кадра всю игру. */
.rcf-hint.off {
  animation: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .6s var(--ease), visibility 0s linear .6s;
}
@keyframes rcfPulse { 0%,100% { opacity: .55 } 50% { opacity: 1 } }

.rcf-speed {
  position: absolute; right: clamp(14px, 4vw, 60px); bottom: 3.4%;
  color: var(--int-lit, #CFE9F5); text-align: right;
  font-variant-numeric: tabular-nums;
}
.rcf-speed b {
  display: block;
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(18px, 2.6vw, 28px);
  font-weight: 600;
  text-shadow: 0 0 18px rgba(var(--int-cyan-rgb, 66,178,220), .6);
}
.rcf-speed span { font-size: 10px; letter-spacing: .22em; opacity: .6; }

/* ── Кнопки ──────────────────────────────────────────────────ы */
.rcf-close {
  position: absolute; top: clamp(12px, 3vh, 28px); right: clamp(12px, 3vw, 28px);
  width: 44px; height: 44px;
  display: grid; place-items: center;
  color: var(--int-lit, #CFE9F5);
  background: rgba(var(--int-deep-rgb, 5,12,21), .6);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .35);
  border-radius: 50%;
  cursor: pointer;
  transition: border-color .25s, box-shadow .25s;
}
.rcf-close:hover { border-color: rgba(var(--int-cyan-rgb, 66,178,220), .8); box-shadow: 0 0 24px -6px rgba(var(--int-cyan-rgb, 66,178,220), .7); }
.rcf-close svg { width: 18px; height: 18px; }


.rcf-fade {
  position: absolute; inset: 0; pointer-events: none;
  background: var(--int-deep, #050C15);
  opacity: 0; transition: opacity .6s;
}

/* ── Плавающая кнопка на сайте ───────────────────────────────
   Живёт слева снизу, чтобы не спорить с кнопкой «наверх». В кадре
   только после первого экрана: на площадке старт ещё не объявлен. */
.rcf-fab {
  position: fixed; left: clamp(12px, 2.6vw, 28px); bottom: clamp(12px, 3vh, 28px);
  z-index: 90;
  display: flex; align-items: center; gap: 9px;
  padding: 12px 18px 12px 14px;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 13px; font-weight: 600; letter-spacing: .1em;
  color: var(--int-lit, #CFE9F5);
  background: linear-gradient(158deg, rgba(var(--int-hull-rgb, 10,21,36), .92), rgba(var(--int-deep-rgb, 5,12,21), .96));
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .4);
  border-radius: 999px;
  cursor: pointer;
  opacity: 0; pointer-events: none;
  transform: translateY(14px);
  transition: opacity .45s var(--ease), transform .45s var(--ease), box-shadow .3s;
  box-shadow: 0 14px 34px -14px rgba(0,0,0,.9), 0 0 30px -12px rgba(var(--int-cyan-rgb, 66,178,220), .55);
}
.rcf-fab.on { opacity: 1; pointer-events: auto; transform: translateY(0); }
.rcf-fab:hover { box-shadow: 0 14px 34px -12px rgba(0,0,0,.9), 0 0 42px -8px rgba(var(--int-cyan-rgb, 66,178,220), .85); }
.rcf-fab svg { width: 19px; height: 19px; color: var(--int-cyan, #42B2DC); }
html.rc-flying .rcf-fab { opacity: 0; pointer-events: none; }

/* На широком экране кнопка переезжает вправо, к «наверх». Слева
   внизу лежит подпись раздела, и круглая плашка садилась ровно на
   строку - в кадре посадки она перечёркивала титр сцены. Справа же
   вертикаль из двух кнопок читается как один блок управления. */
@media (min-width: 901px) {
  .rcf-fab {
    left: auto;
    right: clamp(12px, 2.6vw, 28px);
    bottom: calc(clamp(12px, 3vh, 28px) + 58px);
  }
}

html[data-theme="light"] .rcf-fab {
  color: #0A2A40;
  background: linear-gradient(158deg, rgba(var(--int-lit-rgb, 207,233,245), .95), rgba(238,246,252,.98));
  border-color: rgba(10,88,151,.35);
}
html[data-theme="light"] .rcf-fab svg { color: #0A5897; }

/* Большая кнопка в середине сайта: вход в полёт по сценарию */
.rcf-cta {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-align: center;
  padding: clamp(30px, 6vh, 64px) 20px;
}
.rcf-cta .rcf-cta-btn {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 18px 34px;
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(14px, 1.8vw, 18px); font-weight: 600; letter-spacing: .1em;
  color: var(--int-deep, #050C15);
  background: linear-gradient(135deg, var(--int-cyan, #42B2DC), var(--rcf-cy-hi, #7BD1EC));
  border: 0; border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(var(--int-lit-rgb, 207,233,245), .25), 0 20px 50px -18px rgba(var(--int-cyan-rgb, 66,178,220), .8);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.rcf-cta .rcf-cta-btn:hover { transform: translateY(-3px); box-shadow: 0 0 0 1px rgba(var(--int-lit-rgb, 207,233,245), .4), 0 26px 60px -16px rgba(var(--int-cyan-rgb, 66,178,220), 1); }
.rcf-cta .rcf-cta-btn svg { width: 22px; height: 22px; }
/* Подпись под кнопкой полёта стоит на СТРАНИЦЕ, а не в кабине,
   поэтому и цвет обязана брать у страницы. Прежний светлый тон был
   рассчитан на тёмный космос и на светлой теме давал контраст
   ниже единицы к двум - строку было физически не прочитать. */
.rcf-cta .rcf-cta-note {
  color: var(--tx-2, rgba(var(--int-lit-rgb, 207,233,245), .7));
  font-size: 13px; letter-spacing: .04em;
}

/* Слабое устройство и просьба меньше движения: полёта нет, кнопки
   не обещают того, чего не будет */
/* Список закрывает ВСЕ входы в полёт, а не два из трёх. Третья
   кнопка живёт в эпилоге (.epi-btn.js-flight), и её тут не было:
   в режиме покоя человек нажимал большую подсвеченную кнопку, слой
   игры при этом стоял display: none, страница запиралась (overflow
   уходил в hidden), заигрывала музыка - и ни одной кнопки выхода на
   экране. То же самое при отказе трёхмерного слоя. */
/* ── Кнопка стола сюда же ─────────────────────────────────────
   Правило пряталo три входа в игру: плавающую кнопку, призыв в
   рубке и кнопку в финале страницы. Четвёртого входа тогда не
   существовало - экран на стекле с кнопкой «Начать полёт»
   (.dsk-b-fly) появился позже, и под правило не попал.

   А ведь именно он и есть тот вход, которым пользуются: замер
   прокрутки показал, что до самого низа страницы в кадр попадает
   ТОЛЬКО он, остальные три к этому моменту либо за кадром, либо
   свёрнуты. То есть на устройстве, которому полёт не по силам,
   пряталось всё, кроме единственной кнопки, которую человек видит.

   Проверено живым кликом мышью: слой на третьей ступени упрощения
   честно отказывает и говорит причину, но кнопку при этом
   предлагает. Предлагать то, что не сработает, нельзя. */
/* ── Ступень качества больше не прячет вход в игру ────────────
   Здесь в списке условий стояла ещё и третья ступень упрощения
   (data-degrade="3"). Она отличается от двух других принципиально, и
   именно на этом всё сломалось.

   rc-reduced и rc-no3d - приговоры на весь визит: человек попросил
   меньше движения, либо объёмного слоя на устройстве нет вовсе.
   Прятать вход по ним честно.

   Третья ступень - НЕ приговор, а показание счётчика кадров.
   rc-motion поднимает её после трёх секунд тяжёлых кадров и сам
   опускает после семи спокойных. Замер прокруткой мелким шагом:
   обычное устройство доходит до тройки за 1.7 тысячи точек от
   старта, тремя шагами подряд, и держит её до низа страницы. А до
   низа в кадр попадает ровно один вход - экран на стекле. Так
   единственная видимая кнопка запуска и пропадала. Заказчик увидел
   это на своих кадрах: «в какой-то момент кнопка запуска игры
   пропадает».

   Прятать вход по мгновенной ступени неправильно и по существу: у
   самого полёта есть свой регулятор плавности, он снимает плотность
   кадра ступенями и в крайнем случае убирает украшения. То есть
   тяжёлое устройство игра обслуживает сама, а не отказом на входе. */
html.rc-reduced .rcf-fab, html.rc-reduced .rcf-cta, html.rc-reduced .epi-btn.js-flight,
html.rc-reduced .dsk-b-fly,
html.rc-no3d .rcf-fab, html.rc-no3d .rcf-cta, html.rc-no3d .epi-btn.js-flight,
html.rc-no3d .dsk-b-fly {
  display: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .rcf-fab, .rcf-cta, .rc-flight, .epi-btn.js-flight, .dsk-b-fly { display: none !important; }
}

@media (max-width: 760px) {
  .rcf-fab { padding: 11px 15px 11px 12px; font-size: 12px; }
  .rcf-cap { max-width: 92vw; white-space: normal; text-align: center; letter-spacing: .1em; }
  .rcf-speed { display: none; }
  .rcf-cockpit::after { background-size: 190% auto; }
}

/* ── Видеофоны секций ────────────────────────────────────────
   Луп лежит под содержимым секции и растворяется к краям, чтобы
   врастать в общий космос страницы, а не выглядеть телевизором. */
section.has-vidbg { position: relative; }
section.has-vidbg > .wrap { position: relative; z-index: 1; }
.rc-vidbg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0; pointer-events: none;
  opacity: 0; transition: opacity 2s var(--ease);
  mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
}
.rc-vidbg.on { opacity: .38; }
html[data-theme="light"] .rc-vidbg.on { opacity: .16; }
@media (max-width: 760px) {
  .rc-vidbg.on { opacity: .3; }
}
/* Кен-бёрнс убран: масштаб растягивал и без того небольшой луп, от
   чего он мылился ещё сильнее, а браузер пересобирал слой видео в
   каждом кадре. Живость фону даёт само видео. */
.rc-vidbg.on { animation: none; }
@keyframes rcVbKen {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
  .rc-vidbg.on { animation: none; }
}

/* ── Рамка кабины ────────────────────────────────────────────
   Настоящая панель-окно корабля: сгенерированный кадр с чистыми
   краями, чёрное окно которого вырезано в прозрачность. Своя
   картинка для альбома и для портрета.

   Это картинка, а не разметка, поэтому в палитру рубки её можно
   свести только фильтром. Замеры показали, в чём была разница:
   тон у кадра и у рубки почти совпадал (203° против 209°), а вот
   насыщенность отличалась вдвое - стена рубки s≈0.94 при v≈0.26,
   корпус кабины s≈0.50 при v≈0.27. То есть рубка - синяя комната,
   а кабина - серая, и глаз читал это как переезд на другой сайт.

   Отсюда состав фильтра:
   · saturate(2.1) - главный шаг, поднимает s с 0.50 до 0.82 и
     вычищает из корпуса серый (красный канал падает с 34 до 13);
   · hue-rotate(5deg) - добирает недостающие градусы, вместе с
     плёнкой стены тон садится на 210° при 209° у стены рубки;
   · brightness(.86) contrast(1.1) - выводит светлоту на v≈0.27,
     как у стены рубки: раньше кабина была ещё и темнее комнаты.
   Пересветов при этом меньше процента пикселей, а разброс светлоты
   внутри корпуса (0.122) остался ровно таким же, как до правки -
   приборы и диоды на панели читаются, мутного пятна не вышло.
   Значения фильтра статичны: анимировать filter нельзя, это
   пересчёт всего кадра на каждом тике. */
.rcf-cab {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  pointer-events: none;
  opacity: 0;
  /* Поправки цвета сняты. Трёхмерный корпус в салоне рисуется той
     же картинкой, но без CSS-фильтра, и на старте полёта корпус
     менял тон - в этом и была видимая часть подмены. Тон теперь
     один: то, что нарисовано в файле. */
  filter: none;
  transform: translateY(calc(var(--rcf-g, 0) * 1px));
  transition: opacity .8s var(--ease), transform .3s var(--ease);
}
.rc-flight.has-cab .rcf-cab { opacity: calc(1 - var(--rcf-away, 0)); }

/* Свободный обзор: пока мышь тянут, курсор показывает, что кадр
   схвачен рукой */
.rc-flight.rcf-drag { cursor: grabbing; }
/* Бесшовный старт из финала: рамка кабины уже стоит перед глазами
   человека, она же остаётся в игре - и проявляться ей неоткуда.
   Восьмая доля секунды перехода читалась провалом: кабина исчезала
   и возвращалась. Здесь она просто продолжается. */
.rc-flight.rcf-seam .rcf-cab { transition: none; }
.rc-flight.rcf-seam.has-cab .rcf-cab { opacity: calc(1 - var(--rcf-away, 0)); }

/* Стеновой тон поверх корпуса кабины.
   Фильтр правит температуру, но числа палитры в него не подставить,
   и глубокие тени корпуса остаются чуть холоднее стены рубки.
   Поэтому сверху лежит тонкая заливка --int-wall - тем же цветом,
   что стеновая панель рубки.

   Слой вырезан по силуэту самой кабины: маска - та же картинка, у
   неё окно уже прозрачное, значит на космос заливка не попадает и
   звёзды не сереют. Живого размытия нет намеренно: backdrop-filter
   на весь экран - это лишний проход по кадру каждый тик, а здесь
   достаточно статичной плёнки, которую браузер растрирует один раз.

   Слой висит на ::before у .rcf-hud - это единственный способ
   положить что-то поверх <img> без правки разметки (разметку
   строит rc-flight.js). Порядок сложения соблюдён: .rcf-hud идёт
   после картинки, а собственные узлы HUD рисуются после своего
   ::before, поэтому плёнка ложится строго между кабиной и HUD. */
.rc-flight.has-cab .rcf-hud::before {
  content: ''; position: absolute; inset: 0;
  pointer-events: none;
  background: var(--int-wall, #0E1D2E);
  opacity: .18;
  -webkit-mask-image: url("gen/cockpit-wide-v2.webp");
  mask-image: url("gen/cockpit-wide-v2.webp");
  -webkit-mask-size: cover; mask-size: cover;
  -webkit-mask-position: 50% 50%; mask-position: 50% 50%;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
/* В портрете rc-flight.js подставляет вертикальный кадр - маска
   обязана быть той же картинкой, иначе плёнка ляжет мимо корпуса.

   Заодно вертикальному кадру нужен свой фильтр: он снят темнее и
   почти обесцвеченным (средний цвет корпуса 18,24,26 против
   34,55,68 у горизонтального), из-за чего на телефоне кабина
   уходила в серо-зелёный - замер давал тон 189° и s≈0.28, а рубка
   держит 209° и s≈0.80. Тот же состав, но с большим запасом по
   насыщенности и яркости, сводит и его: 205° при s≈0.78, и снова
   без единого пересвеченного пикселя. */
@media (orientation: portrait) {
  .rcf-cab {
    filter: brightness(1.2) contrast(1.14) saturate(3.2) hue-rotate(10deg);
  }
  .rc-flight.has-cab .rcf-hud::before {
    -webkit-mask-image: url("gen/cockpit-tall-v2.webp");
    mask-image: url("gen/cockpit-tall-v2.webp");
  }
}

/* ── Пульт навигации: блок клавиш ВНУТРИ консоли ─────────────
   Не кнопки поверх кадра, а физический блок панели: металлическая
   ниша с фаской и винтами по углам, лежащая в перспективе консоли
   (наклонена от зрителя, как и нарисованная), внутри - клавиши с
   LED-полосой. Нажатие вдавливает клавишу в панель.

   Плита пульта была нейтрально-серой (#1c2632), и рядом с синими
   приборами рубки это читалось как деталь из другого корабля.
   Теперь ниша набрана тем же стеком, что и приборная стойка рубки:
   лицевая плита --int-panel сверху, корпус --int-hull в середине,
   дальний воздух --int-deep у нижней кромки. */
.rcf-deck {
  position: absolute; left: 50%; bottom: 2.6%;
  transform: translateX(-50%) perspective(760px) rotateX(33deg);
  transform-origin: 50% 100%;
  pointer-events: auto;
  padding: 10px 14px 12px;
  border-radius: 12px;
  background:
    radial-gradient(circle at 8px 8px, rgba(var(--int-lit-rgb, 207,233,245), .35) 1.6px, transparent 2.4px),
    radial-gradient(circle at calc(100% - 8px) 8px, rgba(var(--int-lit-rgb, 207,233,245), .35) 1.6px, transparent 2.4px),
    radial-gradient(circle at 8px calc(100% - 8px), rgba(var(--int-lit-rgb, 207,233,245), .35) 1.6px, transparent 2.4px),
    radial-gradient(circle at calc(100% - 8px) calc(100% - 8px), rgba(var(--int-lit-rgb, 207,233,245), .35) 1.6px, transparent 2.4px),
    /* Свет из-под плиты - тот же приём, что у приборной стойки рубки:
       панель не просто тёмная, она подсвечена собственным свечением */
    radial-gradient(ellipse 72% 100% at 50% 100%,
      rgba(var(--int-cyan-rgb, 66,178,220), .13), transparent 74%),
    linear-gradient(180deg,
      var(--int-panel, #14283D) 0%,
      var(--int-hull, #0A1524) 52%,
      var(--int-deep, #050C15) 100%);
  border: 1px solid rgba(var(--int-deep-rgb, 5,12,21), .95);
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .1),
    /* Внутренняя тень взята цветом дальнего воздуха, а не чёрным:
       чистый чёрный вымывает синеву и плита опять становится серой */
    inset 0 0 26px rgba(var(--int-deep-rgb, 5,12,21), .75),
    0 -1px 0 rgba(var(--int-lit-rgb, 207,233,245), .06),
    0 10px 26px -8px rgba(0,0,0,.95);
}
/* Светящаяся щель по верхней кромке ниши: пульт встроен, не приклеен */
.rcf-deck::before {
  content: ''; position: absolute; left: 6%; right: 6%; top: -2px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--int-cyan-rgb, 66,178,220), .55), transparent);
}
.rcf-nav {
  display: flex; gap: 7px; flex-wrap: wrap; justify-content: center;
  max-width: min(720px, 84vw);
}
.rcf-nav button {
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 10.5px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(var(--int-lit-rgb, 207,233,245), .92);
  /* Клавиша - тот же материал, что и ниша, только приподнята к свету:
     верхний слой светом остекления (--int-lit) даёт выпуклое темя,
     нижний повторяет стек плиты. Раньше здесь стоял серый #303c4b,
     из-за него пульт игры выпадал из синевы рубки. */
  background:
    linear-gradient(180deg, rgba(var(--int-lit-rgb, 207,233,245), .10) 0%, transparent 46%),
    /* внутреннее свечение плиты - им же светятся приборы рубки */
    linear-gradient(180deg, rgba(var(--int-emis-rgb, 18,60,92), .55), transparent 62%),
    linear-gradient(180deg,
      var(--int-panel, #14283D) 0%,
      var(--int-hull, #0A1524) 52%,
      var(--int-deep, #050C15) 100%);
  border: 1px solid rgba(var(--int-deep-rgb, 5,12,21), .95);
  border-radius: 6px;
  padding: 9px 13px 10px;
  cursor: pointer;
  position: relative;
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .18),
    inset 0 -4px 7px rgba(var(--int-deep-rgb, 5,12,21), .75),
    0 2px 0 var(--int-deep, #050C15),
    0 4px 7px -2px rgba(0,0,0,.9);
  text-shadow: 0 0 8px rgba(var(--int-cyan-rgb, 66,178,220), .6);
  transition: color .16s, box-shadow .16s, transform .1s, background .16s;
}
/* LED-полоска клавиши */
.rcf-nav button::after {
  content: ''; position: absolute; left: 22%; right: 22%; top: 3px; height: 2px;
  border-radius: 1px;
  background: rgba(var(--int-cyan-rgb, 66,178,220), .35);
  box-shadow: 0 0 6px rgba(var(--int-cyan-rgb, 66,178,220), .3);
  transition: background .2s, box-shadow .2s;
}
.rcf-nav button:hover { color: var(--int-lit, #CFE9F5); }
.rcf-nav button:hover::after { background: rgba(var(--int-lit-rgb, 207,233,245), .85); box-shadow: 0 0 10px rgba(var(--int-cyan-rgb, 66,178,220), .8); }
.rcf-nav button:active {
  transform: translateY(2px);
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .1),
    inset 0 3px 8px rgba(0,0,0,.7),
    0 0 0 var(--int-deep, #050C15),
    0 1px 3px -1px rgba(0,0,0,.9);
}
/* Нажатая клавиша горит фирменным цианом - тем же, что кромки
   приборов рубки. Три ступени гнутся из одного цвета: свет сверху,
   сам циан в теле, его теневая ступень у основания. */
.rcf-nav button.cur {
  color: var(--int-deep, #050C15);
  background: linear-gradient(180deg,
    var(--rcf-cy-hi, #7BD1EC) 0%,
    var(--int-cyan, #42B2DC) 60%,
    var(--rcf-cy-lo, #2C8FB8) 100%);
  text-shadow: none;
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .55),
    inset 0 -3px 6px rgba(var(--int-deep-rgb, 5,12,21), .5),
    0 0 22px -3px rgba(var(--int-cyan-rgb, 66,178,220), .95),
    0 2px 0 var(--int-emis, #123C5C),
    0 4px 7px -2px rgba(0,0,0,.9);
}
.rcf-nav button.cur::after { background: var(--int-emis, #123C5C); box-shadow: none; }

/* ── Автопилот ───────────────────────────────────────────────ы */
.rcf-auto {
  position: absolute; top: clamp(12px, 3vh, 28px); left: clamp(12px, 3vw, 28px);
  display: flex; align-items: center; gap: 9px;
  padding: 10px 16px;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 12px; font-weight: 600; letter-spacing: .12em;
  color: rgba(var(--int-lit-rgb, 207,233,245), .85);
  background: rgba(var(--int-deep-rgb, 5,12,21), .6);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .35);
  border-radius: 999px;
  cursor: pointer;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.rcf-auto i {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(var(--int-lit-rgb, 207,233,245), .35);
  transition: background .25s, box-shadow .25s;
}
.rcf-auto[aria-pressed="true"] i {
  background: #35E08F;
  box-shadow: 0 0 10px #35E08F;
  animation: rcfPulse 1.8s ease-in-out infinite;
}

/* ── Бортовой справочник ─────────────────────────────────────
   Наведи на планету - корабль расскажет, что это. */
/* Справочник - тоже голограмма, ярусом ниже титула */
.rcf-info {
  position: absolute; left: 50%; top: clamp(58px, 11vh, 100px);
  transform: translateX(-50%) translateY(-6px) scaleY(.5);
  max-width: min(560px, 92vw);
  text-align: center;
  font-size: clamp(11px, 1.3vw, 13px);
  letter-spacing: .1em;
  color: var(--int-lit, #CFE9F5);
  padding: 8px 18px;
  background: linear-gradient(180deg, rgba(var(--int-vio-rgb, 138,89,246), .09), rgba(var(--int-cyan-rgb, 66,178,220), .03) 55%, rgba(var(--int-cyan-rgb, 66,178,220), .07));
  border-top: 1px solid rgba(var(--int-lit-rgb, 207,233,245), .4);
  border-bottom: 1px solid rgba(var(--int-vio-rgb, 138,89,246), .3);
  text-shadow: 0 0 10px rgba(var(--int-cyan-rgb, 66,178,220), .8);
  -webkit-mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.62) 2px 3px);
  mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.62) 2px 3px);
  opacity: 0; pointer-events: none;
  transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.rcf-info.on { opacity: 1; transform: translateX(-50%) translateY(0) scaleY(1); }
/* Когда справочник говорит - титул отступает: две проекции разом
   дублируют друг друга, клиент прислал это скрином */
.rcf-hud.has-info .rcf-cap { opacity: 0 !important; animation: none; }

/* ── Голограмма логотипа ─────────────────────────────────────
   Стоит над панелью справа, как проекция из приборов: циановая,
   прозрачная, с бегущей полосой скана и лёгким дыханием. */
.rcf-holo {
  position: absolute; right: clamp(16px, 6vw, 90px); bottom: clamp(60px, 15vh, 150px);
  /* Размер марки держим в переменной: по ней развёртка знает длину
     своего пути и не спрашивает её у браузера. */
  --rcf-holo-разм: clamp(54px, 7vw, 92px);
  width: var(--rcf-holo-разм);
  aspect-ratio: 1;
  pointer-events: none;
  animation: rcfHolo 5s ease-in-out infinite;
}
.rcf-holo img {
  width: 100%; height: 100%;
  object-fit: contain;
  filter: brightness(1.6) sepia(1) hue-rotate(160deg) saturate(3.4) drop-shadow(0 0 14px rgba(var(--int-cyan-rgb, 66,178,220), .8));
  opacity: .8;
  -webkit-mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.55) 2px 4px);
  mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.55) 2px 4px);
}
.rcf-holo::after {
  content: ''; position: absolute; left: -8%; right: -8%; top: 0; height: 3px;
  background: linear-gradient(90deg, transparent, rgba(var(--int-lit-rgb, 207,233,245), .9), transparent);
  /* Путь развёртки - высота самой марки. Считаем в единицах контейнера,
     чтобы не зависеть от того, какого она сейчас размера. */
  --rcf-scan-путь: var(--rcf-holo-разм, 72px);
  will-change: transform;
  animation: rcfScan 2.6s linear infinite;
}
.rcf-holo i {
  position: absolute; left: 12%; right: 12%; bottom: -12px; height: 10px;
  background: radial-gradient(ellipse 50% 100% at 50% 0%, rgba(var(--int-cyan-rgb, 66,178,220), .55), transparent 70%);
  filter: blur(1px);
}
@keyframes rcfHolo {
  0%, 100% { transform: translateY(0); opacity: .95; }
  50%      { transform: translateY(-5px); opacity: .8; }
}
/* Развёртка по марке идёт сдвигом, а не свойством top: top не
   композитится, и каждый кадр этой вечной анимации был пересчётом
   раскладки. Полоса высотой 3px, поэтому путь считаем в долях высоты
   РОДИТЕЛЯ - для этого ниже у неё height: 3px и своя переменная. */
@keyframes rcfScan {
  from { transform: translateY(0); opacity: 0; }
  12%  { opacity: 1; }
  88%  { opacity: 1; }
  to   { transform: translateY(var(--rcf-scan-путь, 100px)); opacity: 0; }
}

@media (max-width: 760px) {
  /* На телефоне пульт компактнее и почти анфас: сильная перспектива
     на узком экране ломает читаемость клавиш. Лента с прокруткой
     пальцем, как строка приборов. */
  .rcf-deck {
    bottom: 3%;
    max-width: 94vw;
    padding: 7px 9px 8px;
    transform: translateX(-50%) perspective(620px) rotateX(18deg);
  }
  .rcf-nav {
    gap: 5px;
    max-width: 88vw;
    flex-wrap: nowrap; justify-content: flex-start;
    overflow-x: auto; overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%);
  }
  .rcf-nav::-webkit-scrollbar { display: none; }
  .rcf-nav button { font-size: 9.5px; padding: 8px 10px 9px; flex: 0 0 auto; }
  .rcf-auto { padding: 8px 12px; font-size: 11px; }
  .rcf-holo { right: 8px; bottom: 12.5%; --rcf-holo-разм: 44px; width: 44px; }
  .rcf-info { top: clamp(64px, 12vh, 110px); }
  /* Подсказка стоит внутри остекления, а не на панели приборов:
     на телефоне кабина занимает низ кадра, и на 17% строка ложилась
     ровно на тумблеры - читать её было нечем */
  .rcf-hint { bottom: 28%; font-size: 10.5px; max-width: 78vw; white-space: normal; text-align: center; }
  .rcf-speed { display: none; }
  .rcf-track { bottom: 1.2%; }
}

/* ── Сканер: рамка захвата цели ──────────────────────────────
   Четыре уголка и строка данных под ними. Стоит на экранной
   проекции объекта и дышит, как настоящий прибор наведения. */
.rcf-lock {
  position: absolute; width: 84px; height: 84px;
  transform: translate(-50%, -50%);
  pointer-events: none;
  opacity: 0; transition: opacity .25s linear;
}
.rcf-lock.on { opacity: 1; animation: rcfLock 2.2s ease-in-out infinite; }

/* ── Развёртка скана ──────────────────────────────────────────
   Заказчик: «какая-то визуальная анимация должна быть во время
   скана, чтобы было понятно, что это работает вообще». Пульсации
   рамки для этого мало: она дышит и в покое, и по ней не отличить
   работающий прибор от просто наведённого прицела.

   Полоса идёт сверху вниз внутри рамки и повторяется. Это тот же
   приём, которым показывают работу сканера в жизни: луч бежит по
   предмету. Рисуется одним градиентом на псевдоэлементе, своих
   узлов не заводит и ничего не стоит.

   Отсечка по рамке обязательна: без неё полоса светила бы за её
   пределами и налезала на приборы. */
.rcf-lock.on::before {
  content: '';
  position: absolute;
  left: 2px; right: 2px; top: 0; height: 26%;
  background: linear-gradient(180deg,
    rgba(var(--int-cyan-rgb, 66,178,220), 0) 0%,
    rgba(var(--int-cyan-rgb, 66,178,220), .55) 55%,
    rgba(var(--int-lit-rgb, 207,233,245), .9) 100%);
  box-shadow: 0 0 12px rgba(var(--int-cyan-rgb, 66,178,220), .7);
  animation: rcfScanСвип 1.35s linear infinite;
}
/* Ход подобран так, чтобы полоса не вышла за рамку САМА, без
   отсечки. Отсечкой тут пользоваться нельзя: подпись цели висит
   под рамкой снаружи, и overflow: hidden срезал бы её вместе с
   именем тела. Полоса высотой 26 процентов рамки может уехать
   вниз ровно на (100-26)/26, то есть на 284 процента своей
   высоты - и упрётся нижним краем в нижнюю кромку прицела. */
@keyframes rcfScanСвип {
  0%   { transform: translateY(0); opacity: 0; }
  12%  { opacity: 1; }
  88%  { opacity: 1; }
  100% { transform: translateY(284%); opacity: 0; }
}
@keyframes rcfLock {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50%      { transform: translate(-50%, -50%) scale(1.07); }
}
.rcf-lock b {
  position: absolute; width: 16px; height: 16px;
  border: 2px solid var(--int-lit, #CFE9F5);
  filter: drop-shadow(0 0 6px rgba(var(--int-cyan-rgb, 66,178,220), .9));
}
.rcf-lock b:nth-child(1) { left: 0; top: 0; border-right: 0; border-bottom: 0; }
.rcf-lock b:nth-child(2) { right: 0; top: 0; border-left: 0; border-bottom: 0; }
.rcf-lock b:nth-child(3) { left: 0; bottom: 0; border-right: 0; border-top: 0; }
.rcf-lock b:nth-child(4) { right: 0; bottom: 0; border-left: 0; border-top: 0; }
.rcf-lock span {
  position: absolute; left: 50%; top: calc(100% + 8px);
  transform: translateX(-50%);
  white-space: nowrap;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 10.5px; font-weight: 600; letter-spacing: .16em;
  color: var(--int-lit, #CFE9F5);
  padding: 3px 8px;
  background: linear-gradient(180deg, rgba(var(--int-cyan-rgb, 66,178,220), .12), rgba(var(--int-cyan-rgb, 66,178,220), .04));
  border-top: 1px solid rgba(var(--int-lit-rgb, 207,233,245), .45);
  text-shadow: 0 0 8px rgba(var(--int-cyan-rgb, 66,178,220), .9);
  -webkit-mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.66) 2px 3px);
  mask-image: repeating-linear-gradient(180deg, #000 0 2px, rgba(0,0,0,.66) 2px 3px);
}

/* Клавиша сканера в активном положении - янтарная: приборы
   наведения на пультах всегда выделены другим цветом. Это показание
   прибора, а не отделка комнаты, поэтому янтарь остаётся своим и в
   палитру рубки его не сводим - иначе он перестанет отличаться.
   Фаска при этом общая: блик берётся из --int-lit, как у всех
   выпуклых клавиш пульта. */
.rcf-nav button.rcf-scan-key.cur {
  background: linear-gradient(180deg, #FFD9A0 0%, #F0A85A 60%, #C9853E 100%);
  color: #241303;
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .55),
    inset 0 -3px 6px rgba(60,30,6,.35),
    0 0 22px -3px rgba(240,168,90,.95),
    0 2px 0 #4a3010,
    0 4px 7px -2px rgba(0,0,0,.9);
}
.rcf-nav button.rcf-scan-key.cur::after { background: #4a3010; box-shadow: none; }

/* ── Журнал исследователя ────────────────────────────────────ы */
.rcf-prog {
  position: absolute; left: clamp(14px, 3vw, 40px); bottom: 3.4%;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 10.5px; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase;
  /* Счётчик стоит поверх нижнего края кокпита, и на светлых
     приборах прежняя полупрозрачность его съедала. Держим текст
     светлым, а читаемость даёт короткая тень, а не подложка:
     плашка в углу кабины смотрелась бы наклейкой поверх кино. */
  color: rgba(var(--int-lit-rgb, 207,233,245), .92);
  text-shadow: 0 1px 3px rgba(2,6,12,.95), 0 0 12px rgba(2,6,12,.75);
}
.rcf-prog.full { color: #35E08F; text-shadow: 0 0 10px rgba(53,224,143,.6); }
@media (max-width: 760px) {
  /* В портрете низ кадра занят пультом во всю ширину, и оба
     счётчика ложились прямо на клавиши: «СЕТЬ 0/32» читалось
     поверх кнопки «ЗЕМЛЯ». Переносим их наверх, в свободный левый
     угол над остеклением, и ставим строго друг под другом. */
  .rcf-prog { left: 12px; top: 12px; bottom: auto; font-size: 9.5px; }
  .rcf-lock { width: 64px; height: 64px; }
  .rcf-cap { font-size: 10.5px; }
}

/* ── Брифинг старта ──────────────────────────────────────────
   Полёт начинается по решению пилота, а не сам: карта миссии с
   двумя режимами. Стоит поверх кадра, пока не сделан выбор. */
.rcf-brief {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  /* Затемнение мягче прежнего: карта миссии не должна гасить космос
     за стеклом - человек уже в кабине и обязан видеть, куда попал */
  background: radial-gradient(ellipse 74% 64% at 50% 46%, rgba(var(--int-deep-rgb, 5,12,21), .10), rgba(var(--int-deep-rgb, 5,12,21), .55));
  opacity: 1; visibility: visible;
  transition: opacity .6s var(--ease), visibility 0s;
  z-index: 4;
}
/* Убранный брифинг перестаёт ловить касания сразу, а не через
   полсекунды растворения: первый клик после старта должен уйти в
   рубку, а не в исчезающую карточку */
.rcf-brief.off { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .6s var(--ease), visibility 0s linear .6s; }
.rcf-brief-card {
  max-width: min(480px, 88vw);
  text-align: center;
  padding: 30px 30px 26px;
  border-radius: 16px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .35);
  background: linear-gradient(165deg, rgba(var(--int-hull-rgb, 10,21,36), .92), rgba(var(--int-deep-rgb, 5,12,21), .96));
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.95), 0 0 60px -20px rgba(var(--int-cyan-rgb, 66,178,220), .4);
}
/* ── Луч проектора ───────────────────────────────────────────
   Заказчик записал отдельным дефектом: «нет проекторов голограмм».
   Карточка висела на стекле сама по себе и читалась наклейкой, а не
   проекцией: у света не было источника.

   Конус идёт вниз от карточки и книзу сужается - так рисуется луч,
   бьющий СНИЗУ, с панели: у основания он узкий, у карточки во всю её
   ширину. Трапецию режет clip-path, свет складывается со стеклом
   через screen - он прибавляется к виду из окна, а не закрашивает
   его. Дыхание еле заметное: проектор жив, но не мигает лампочкой.

   Луч висит на подложке брифинга, а не на самой карточке. Два
   прежних захода сгорели: на компактной карточке HUD стоит max-height
   с overflow и всё лишнее срезается, а у карточки брифинга ::after уже
   занят пятном проектора, ::before - развёрткой строк. У подложки
   псевдоэлементы свободны, и обрезки на ней нет. */
.rcf-brief::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(360px, 62vw);
  transform: translateX(-50%);
  top: calc(50% + 104px);
  height: clamp(54px, 11vh, 130px);
  pointer-events: none;
  clip-path: polygon(0 0, 100% 0, 62% 100%, 38% 100%);
  background: linear-gradient(180deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .22) 0%,
    rgba(var(--int-cyan-rgb, 66,178,220), .09) 44%,
    rgba(var(--int-cyan-rgb, 66,178,220), 0) 100%);
  mix-blend-mode: screen;
  animation: rcfLuch 4.6s ease-in-out infinite;
  z-index: 0;
}
@keyframes rcfLuch { 0%,100% { opacity: .76 } 50% { opacity: 1 } }
@media (prefers-reduced-motion: reduce) {
  .rcf-brief::after { animation: none; }
}
.rcf-brief-card b {
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(17px, 2.4vw, 24px); letter-spacing: .14em;
  color: var(--int-lit, #CFE9F5);
  text-shadow: 0 0 24px rgba(var(--int-cyan-rgb, 66,178,220), .7);
}
.rcf-brief-card p {
  margin: 12px 0 20px;
  font-size: 13px; line-height: 1.6;
  color: rgba(var(--int-lit-rgb, 207,233,245), .75);
}
.rcf-brief-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rcf-brief-btns button {
  flex: 1 1 170px; max-width: 210px;
  padding: 13px 16px;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 13px; font-weight: 700; letter-spacing: .1em;
  color: var(--int-deep, #050C15);
  background: linear-gradient(135deg, var(--int-cyan, #42B2DC), var(--rcf-cy-hi, #7BD1EC));
  border: 0; border-radius: 12px;
  cursor: pointer;
  transition: transform .2s var(--ease), box-shadow .2s;
  box-shadow: 0 0 30px -10px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rcf-brief-btns button span {
  display: block; margin-top: 3px;
  font-size: 10px; font-weight: 500; letter-spacing: .06em; opacity: .75;
}
/* Вторая кнопка брифинга - не подсвеченная, а просто плита прибора:
   тот же стек панель-корпус, что у ниши пульта, вместо прежнего
   нейтрального серого */
.rcf-brief-btns button:last-child {
  color: rgba(var(--int-lit-rgb, 207,233,245), .92);
  background: linear-gradient(180deg, var(--int-panel, #14283D), var(--int-hull, #0A1524));
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .4);
  box-shadow: none;
}
.rcf-brief-btns button:hover { transform: translateY(-2px); }

/* ── Меню вселенных ──────────────────────────────────────────
   Открывается клавишей «Галактика» над пультом: три вселенные с
   названиями, выбранная запускает гиперпрыжок. */
.rcf-uni {
  position: absolute; left: 50%; bottom: 17%;
  transform: translateX(-50%) translateY(10px);
  min-width: min(340px, 86vw);
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .35);
  background: linear-gradient(170deg, rgba(var(--int-hull-rgb, 10,21,36), .95), rgba(var(--int-deep-rgb, 5,12,21), .97));
  box-shadow: 0 24px 60px -20px rgba(0,0,0,.95), 0 0 40px -16px rgba(var(--int-cyan-rgb, 66,178,220), .5);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s linear .3s;
  z-index: 5;
}
.rcf-uni.on {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
  transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.rcf-uni i {
  display: block; text-align: center;
  font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: .3em;
  color: rgba(var(--int-lit-rgb, 207,233,245), .6);
  margin-bottom: 9px;
}
.rcf-uni button {
  display: block; width: 100%;
  text-align: left;
  padding: 10px 13px;
  margin-top: 6px;
  border-radius: 9px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .2);
  background: rgba(var(--int-panel-rgb, 20,40,61), .6);
  cursor: pointer;
  transition: border-color .2s, background .2s;
}
.rcf-uni button:first-of-type { margin-top: 0; }
.rcf-uni button:hover { border-color: rgba(var(--int-cyan-rgb, 66,178,220), .7); background: rgba(var(--int-panel-rgb, 20,40,61), .8); }
.rcf-uni button b {
  display: block;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 12.5px; font-weight: 700; letter-spacing: .12em;
  color: var(--int-lit, #CFE9F5);
}
.rcf-uni button span { display: block; margin-top: 2px; font-size: 10.5px; color: rgba(var(--int-lit-rgb, 207,233,245), .55); }

/* Клавиша АВТО на пульте: горит зелёным в автополёте. Зелёный, как
   и янтарь сканера, - показание прибора, а не цвет комнаты, поэтому
   он свой. Общей остаётся фаска: блик из --int-lit, как у всех
   клавиш пульта и у приборных плит рубки. */
.rcf-nav button.rcf-auto-key.cur {
  background: linear-gradient(180deg, #7FEBB4 0%, #35E08F 60%, #23A868 100%);
  color: #05231a;
  text-shadow: none;
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .55),
    inset 0 -3px 6px rgba(4,40,26,.35),
    0 0 20px -3px rgba(53,224,143,.9),
    0 2px 0 #0c3a26,
    0 4px 7px -2px rgba(0,0,0,.9);
}
.rcf-nav button.rcf-auto-key.cur::after { background: #0c3a26; box-shadow: none; }

/* Верхний чип автопилота уходит: управление живёт на пульте */
.rcf-auto { display: none; }

/* ── Кнопки планет в чужой вселенной ─────────────────────────
   Система задаёт группу, планеты идут под ней. Чтобы лента не
   превратилась в кашу одинаковых клавиш, планетные кнопки мельче
   и приглушённее: взгляд сначала находит систему, потом её миры. */
.rcf-nav button.rcf-pl {
  font-size: 9.5px;
  letter-spacing: .1em;
  padding: 7px 10px 8px;
  color: rgba(var(--int-lit-rgb, 207,233,245), .78);
  /* Тот же материал клавиши, но без светового темени: планетная
     кнопка утоплена в плиту, а не приподнята к свету */
  background: linear-gradient(180deg,
    var(--int-hull, #0A1524) 0%,
    var(--int-deep, #050C15) 100%);
}
.rcf-nav button.rcf-pl::after { left: 30%; right: 30%; background: rgba(var(--int-vio-rgb, 138,89,246), .32); }
.rcf-nav button.rcf-pl.cur { color: var(--int-lit, #CFE9F5); }
.rcf-nav button.rcf-pl.cur::after { background: rgba(var(--int-vio-rgb, 138,89,246), .9); box-shadow: 0 0 8px rgba(var(--int-vio-rgb, 138,89,246), .7); }

/* ── Развёртывание сети ──────────────────────────────────────
   Игровая цель: довести сеть до каждого мира. Счётчик стоит рядом
   с журналом исследователя, кнопка появляется только там, где есть
   что развернуть - на орбите тела, которого ещё нет в сети. */
.rcf-net {
  position: absolute; left: clamp(14px, 3vw, 40px); bottom: 6.4%;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 10.5px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(var(--int-cyan-rgb, 66,178,220), 1);
  /* Тёмная тень под фирменным цианом: счётчик читается и на светлой
     обшивке кокпита, и на чёрном космосе, без плашки под текстом */
  text-shadow: 0 1px 3px rgba(2,6,12,.95), 0 0 14px rgba(var(--int-cyan-rgb, 66,178,220), .45);
}
.rcf-net.full { color: #35E08F; text-shadow: 0 0 12px rgba(53,224,143,.65); }

/* Кнопка развёртывания узла стоит выше подсказки управления: на
   16,5% они приходились ровно друг на друга, и появившаяся кнопка
   закрывала строку «колесо или свайп - тяга» - человек терял
   единственное объяснение, как лететь. */
.rcf-deploy {
  position: absolute; left: 50%; bottom: 24%;
  transform: translate(-50%, 8px);
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--int-lit, #CFE9F5);
  padding: 12px 22px;
  background: linear-gradient(180deg, rgba(var(--int-panel-rgb, 20,40,61), .96), rgba(var(--int-hull-rgb, 10,21,36), .98));
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .6);
  border-radius: 999px;
  cursor: pointer;
  opacity: 0; pointer-events: none;
  box-shadow: 0 12px 30px -12px rgba(0,0,0,.9), 0 0 34px -10px rgba(var(--int-cyan-rgb, 66,178,220), .8);
  transition: opacity .35s var(--ease, ease), transform .35s var(--ease, ease), box-shadow .25s;
}
.rcf-deploy.on { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.rcf-deploy:hover { box-shadow: 0 14px 36px -12px rgba(0,0,0,.95), 0 0 52px -8px rgba(var(--int-cyan-rgb, 66,178,220), 1); }
/* Пульс приглашения: кнопка сама просит нажать, но не мигает в глаза */
.rcf-deploy.on::after {
  content: ''; position: absolute; inset: -2px;
  border-radius: inherit; border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45);
  animation: rcfDeployPulse 2.4s ease-out infinite;
  pointer-events: none;
}
@keyframes rcfDeployPulse {
  0% { opacity: .7; transform: scale(1); }
  70%, 100% { opacity: 0; transform: scale(1.16); }
}
@media (max-width: 760px) {
  /* Второй строкой под журналом исследователя: две цифры в одном
     столбце читаются как приборная строка, а не как две наклейки
     в разных углах */
  .rcf-net { left: 12px; top: 27px; bottom: auto; font-size: 9.5px; }
  .rcf-deploy { bottom: 21%; font-size: 10px; padding: 10px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .rcf-deploy.on::after { animation: none; }
}

/* Закрытый рукав в меню прыжков: виден, но пока недоступен. Цель
   должна быть на глазах - иначе её незачем достигать. */
.rcf-uni button.locked { opacity: .5; position: relative; }
/* Значок замка ушёл из строки в угол карточки.

   Он стоял в строке названия и на узкой колонке переносился на
   отдельную строку обрубком под словом - четвёртая карточка рукава
   выпадала из ряда трёх нормальных. Первая попытка запретить перенос
   вышла хуже: замер поймал, что на телефоне сетка рукавов стала шире
   своей коробки на девятнадцать точек, то есть название просто
   полезло за край. Значок в углу не участвует в переносе вовсе,
   стоит на одном месте у всех карточек и место под себя занимает
   отступом справа. */
.rcf-uni button.locked b { padding-right: 22px; }
.rcf-uni button.locked b::after {
  content: '';
  position: absolute; right: 11px; top: 12px;
  width: 11px; height: 13px;
  border: 1.5px solid currentColor; border-radius: 2px;
  border-top-width: 6px; border-top-color: transparent;
  box-shadow: inset 0 -3px 0 -1px currentColor;
}
.rcf-uni button.locked:hover { opacity: .72; }
/* Условие открытия рукава читается всегда, а не всплывает на секунду
   под уже открытым меню. */
.rcf-uni-need {
  display: block; margin-top: 4px;
  font-size: 10.5px; font-style: normal; letter-spacing: .04em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .9);
}
.rcf-uni button.locked .rcf-uni-need { color: #F2B657; }
.rcf-uni button.locked { opacity: .78; }

/* ── Приглашение в полёт после заявки ────────────────────────
   Раньше игра открывалась сама через полторы секунды после
   отправки. Человек, оставивший рабочую заявку, получал во весь
   экран космос, которого не просил. Теперь на его месте - короткое
   подтверждение и предложение, от которого легко отказаться. */
.rcf-after {
  margin-top: 18px;
  padding: 16px 18px;
  display: grid; gap: 8px; justify-items: start;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45);
  border-radius: 14px;
  background:
    repeating-linear-gradient(180deg,
      rgba(var(--int-cyan-rgb, 66,178,220), .05) 0 2px, transparent 2px 4px),
    linear-gradient(180deg,
      rgba(var(--int-cyan-rgb, 66,178,220), .10),
      rgba(var(--int-deep-rgb, 5,12,21), .5));
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.rcf-after.on { opacity: 1; transform: none; }
.rcf-after b {
  font: 700 15px/1.2 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .04em;
  color: rgba(var(--int-lit-rgb, 234,246,252), 1);
}
.rcf-after span {
  font: 400 13px/1.45 var(--f-body, "Golos Text", sans-serif);
  color: rgba(var(--int-lit-rgb, 207,233,245), .8);
}
.rcf-after-btn {
  margin-top: 4px;
  padding: 11px 20px;
  font: 700 13px/1 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .08em;
  color: rgba(var(--int-lit-rgb, 234,246,252), 1);
  background: linear-gradient(158deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .3),
    rgba(var(--int-hull-rgb, 10,21,36), .9));
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .6);
  border-radius: 999px;
  cursor: pointer;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.rcf-after-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 30px -8px rgba(var(--int-cyan-rgb, 66,178,220), .9);
}

/* ═══════════════════════════════════════════════════════════
   Режим сцены: кабина игры служит финалом сайта

   «Панель не та, которая в игре, я говорил - та панель (рамка),
   которая в игре, 1:1 она же в ракете, и фон тот же, космос с
   Землёй как в игре 1:1». Здесь это и сделано: в финале страницы
   работает ровно этот слой, тот же корпус кабины и тот же мир.
   Отличие одно - приборов нет и корабль стоит.

   Страница под слоем обязана листаться: подъезд к пульту ведёт
   прокрутка, а не тяга. Поэтому слой в этом режиме не ловит ни
   палец, ни колесо - всё уходит странице, а нажимать надо по
   голограмме, и она лежит отдельным слоем выше.
   ═══════════════════════════════════════════════════════════ */
.rc-flight.rcf-stage {
  pointer-events: none;
  touch-action: auto;
  cursor: default;
  /* Ниже голограммы пульта (.rc-desk, z-index 4) быть нельзя: слой
     занимает весь кадр и рисует космос. Но и поверх шапки сайта ему
     тоже не место - в финале она уже спрятана. */
  z-index: 3;
  background: transparent;
}
/* Приборов в режиме сцены нет: корабль стоит, лететь некуда, а
   владелец просил именно чистый кадр - «без текста, без ничего» */
/* Плоская рамка корпуса в салоне не нужна: там корпус настоящий,
   он часть помещения и виден только в проёме. Плоская подхватывает
   кадр в момент старта полёта, когда совпадает с ней в точности. */
.rc-flight.rcf-stage .rcf-cab,
.rc-flight.rcf-native-cab .rcf-cab { opacity: 0 !important; }
/* Плита приборов вынесена из слоя окна, и прежнее правило про
   режим сцены её больше не касалось: в финале сайта под голограммой
   вопросов зажигались клавиши полёта. Перечисляем её явно.

   Пробовал 27.08 дать плите дежурный свет вместо полного гашения:
   до старта на пульте ряд пустых тёмных плиток, и это читается как
   незагруженная текстура. Стало ХУЖЕ и вот почему. Клавиши и лента
   телеметрии стоят на плите не своей раскладкой, а проекцией на
   трёхмерную плиту (--rcf-phys-*), а считается проекция только в
   полёте. В режиме сцены она не считается, и подписи легли поперёк
   рамы: «0/45 ОТКРЫТО 0/42 КУРС РУЧНОЙ» через весь пульт, слова
   КУРС, СЕТЬ, ТЯГА по углам мимо ниш. Замер этого не показал бы -
   поймано кадром.

   Возвращаем полное гашение. Тёмные плитки до старта - осознанная
   цена: под голограммой вопросов клавиши полёта спорить за внимание
   не должны, а разгораются они ровно в тот кадр, где рама, стекло,
   Земля и сама плита не сдвинулись ни на точку. */
.rc-flight.rcf-stage .rcf-deck,
.rc-flight.rcf-stage .rcf-hud,
.rc-flight.rcf-stage .rcf-uni,
.rc-flight.rcf-stage .rcf-auto,
.rc-flight.rcf-stage .rcf-close,
.rc-flight.rcf-stage .rcf-brief,
.rc-flight.rcf-stage .rcf-deploy,
.rc-flight.rcf-stage .rcf-holo {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ── Погашенное не должно ловить клавиатуру ──────────────────
   Прозрачность убирает орган с глаз, но не из обхода табом. В
   финале страницы это давало пятнадцать невидимых остановок фокуса
   подряд: человек с клавиатуры уходил в «Закрыть досье», КУРС,
   СКАН, СТОП, «Выйти из полёта» - в органы корабля, которого он
   ещё не видел и куда не заходил. Снимаем видимостью: она и с глаз
   убирает, и из обхода.

   Исключений нет. Сначала я вывел из-под этого правила проектор
   RocketVPN, считая его рабочим в режиме сцены, - и был неправ.
   Нажатия в режиме сцены не получает НИКТО: ниже стоит
   `.rc-flight.rcf-stage * { pointer-events: none !important }`. А
   видимость проектора снимает это же правило: он объявлен кнопкой,
   и общий селектор его подбирает. Заодно исключение возвращало
   видимость двум кнопкам ЗАКРЫТОЙ голограммы - ровно то, против
   чего написано само правило. */
.rc-flight.rcf-stage button,
.rc-flight.rcf-stage a[href],
.rc-flight.rcf-stage input,
.rc-flight.rcf-stage select,
.rc-flight.rcf-stage textarea,
.rc-flight.rcf-stage [tabindex]:not([tabindex="-1"]) {
  visibility: hidden;
}
/* Салон виден всё время, пока мы внутри корабля, а не только на
   подъезде: человек вошёл в помещение и обходит его взглядом.
   Прежнее правило вязало прозрачность к доле подъезда, и весь
   оборот кадр оставался чёрным. */

/* Пока идёт режим сцены, объёмная рубка сайта уходит: два корабля в
   одном кадре - это и есть шов, которого быть не должно */
html.rc-stage .rc-int-canvas,
html.rc-stage .rc-int-air { opacity: 0 !important; transition: opacity .5s linear; }
html.rc-stage #spaceBg { opacity: 0 !important; }

/* ═══════════════════════════════════════════════════════════
   Приборная плита: один узел вместо наклеек по углам

   «Кнопки развернуть узел, сканировать и так далее - все они
   наклеены не красиво, не часть интерфейса, ещё и криво». Верно:
   счётчики стояли в левом нижнем углу, скорость в правом, пуск узла
   висел посреди кадра, а панель навигации уезжала за нижнюю кромку.

   Теперь это одна плита в три колонки - счётчики, навигация,
   скорость, - и она стоит в нише пульта, нарисованной на самой
   картинке кабины. Ничего не висит отдельно и ничего не обрезается.
   ═══════════════════════════════════════════════════════════ */
/* Плита садится ровно в нишу приборов, нарисованную на корпусе:
   её место приходит числами из cabGeom, а не подбирается на глаз */
.rc-flight .rcf-deck {
  left: var(--cab-dx, 4%);
  top: var(--cab-dy, 80%);
  bottom: auto;
  width: var(--cab-dw, 92%);
  height: var(--cab-dh, 19%);
  transform: none;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(8px, 1.6vw, 22px);
  padding: clamp(6px, 1vh, 12px) clamp(10px, 1.4vw, 18px);
  /* Плита не рисует себе фона: фон уже нарисован на корпусе.
     Остаётся лёгкое свечение приборов снизу вверх. */
  background: linear-gradient(0deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .07), transparent 72%);
  border: 0;
  box-shadow: none;
  border-radius: 0;
}
.rc-flight .rcf-deck::before { display: none; }
.rc-flight .rcf-gauges {
  display: flex;
  flex-direction: column;
  gap: 3px;
  justify-self: start;
}
.rc-flight .rcf-mid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
/* Счётчики и скорость внутри плиты стоят на своих местах, а не
   абсолютом по кадру */
.rc-flight .rcf-deck .rcf-prog,
.rc-flight .rcf-deck .rcf-net,
.rc-flight .rcf-deck .rcf-speed {
  position: static;
  left: auto; right: auto; bottom: auto; top: auto;
  transform: none;
}
.rc-flight .rcf-deck .rcf-speed {
  justify-self: end;
  text-align: right;
  display: flex;
  align-items: baseline;
  gap: 5px;
}
/* Навигация в одну строку с переносом только на узком экране */
.rc-flight .rcf-deck .rcf-nav {
  max-width: min(660px, 68vw);
}
/* Пуск узла стоит НАД рядом навигации, а не в нём: в ряду он
   закрывал кнопки целей, и до половины системы было не дотянуться */
.rc-flight .rcf-deck .rcf-deploy {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  transform: translateX(-50%);
  margin: 0;
  padding: 8px 20px;
  font-size: 10.5px;
  white-space: nowrap;
  display: none;
}
.rc-flight .rcf-deck .rcf-deploy.on {
  display: inline-block;
  transform: translateX(-50%);
}
.rc-flight .rcf-mid { position: relative; }

@media (max-width: 760px) {
  .rc-flight .rcf-deck {
    grid-template-columns: 1fr;
    gap: 6px;
    bottom: clamp(8px, 1.6vh, 18px);
    padding: 8px 10px 10px;
    max-width: 96vw;
  }
  .rc-flight .rcf-gauges { flex-direction: row; gap: 12px; justify-self: center; }
  .rc-flight .rcf-deck .rcf-speed { justify-self: center; }
  .rc-flight .rcf-deck .rcf-nav { max-width: 92vw; }
}

/* ── Досье объекта: голограмма на стекле ─────────────────────
   Тот же материал, что у панели вопросов в финале сайта: почти
   прозрачная подложка, циановая кромка, развёртка строк. Это не
   окно интерфейса поверх игры, а проекция на остеклении кабины -
   ровно как просил владелец. */
.rcf-dos {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(.94);
  width: min(560px, 78vw);
  max-height: 74vh;
  z-index: 6;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s var(--ease, ease), transform .3s var(--ease, ease);
}
.rcf-dos.on { opacity: 1; transform: translate(-50%, -50%) scale(1); pointer-events: auto; }
/* Закрытая карточка не должна ловить фокус. Прозрачность его не
   убирает, а атрибут hidden перебивается правилом с display ниже:
   вторая-третья остановка табом в полёте садилась на «Закрыть
   досье» карточки, растянутой на весь экран и невидимой. */
.rc-flight .rcf-dos:not(.on),
.rc-flight .rcf-help:not(.on),
.rc-flight .rcf-menu:not(.on) {
  visibility: hidden;
  /* Видимость снимаем ПОСЛЕ того, как доиграет растворение: иначе
     панель не гаснет, а исчезает рывком. */
  transition: opacity .3s var(--ease, ease), transform .3s var(--ease, ease), visibility 0s linear .3s;
}
.rc-flight .rcf-dos.on,
.rc-flight .rcf-help.on,
.rc-flight .rcf-menu.on { visibility: visible; }
.rcf-dos-in {
  position: relative;
  padding: clamp(14px, 2.4vh, 22px) clamp(14px, 2vw, 22px) clamp(12px, 2vh, 18px);
  border-radius: 14px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  /* Досье стало плотнее. Прежде за ним просвечивала планета, и
     заказчик сказал прямо: читать тяжело. Голограммой оно остаётся
     за счёт свечения, каймы и развёртки строк, а не за счёт того,
     что сквозь текст видно фон. */
  background: linear-gradient(168deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .16),
    rgba(5, 13, 24, .90) 44%,
    rgba(4, 11, 20, .95));
  backdrop-filter: blur(9px) saturate(1.25);
  -webkit-backdrop-filter: blur(9px) saturate(1.25);
  box-shadow: inset 0 1px 0 rgba(226,232,240,.16),
              0 0 56px -16px rgba(var(--int-cyan-rgb, 66,178,220), .9);
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 1.4vh, 13px);
  max-height: 74vh;
  overflow: hidden;
}
.rcf-dos-x {
  position: absolute; right: 8px; top: 8px;
  /* Кнопка закрытия держит форму жёстко. Заказчик увидел её
     сплющенной: в колонке досье она была обычным элементом и её
     сжимало содержимым. Теперь ни сжаться, ни растянуться не может,
     а на телефоне она ещё и крупнее - в неё надо попадать пальцем. */
  width: 34px; height: 34px;
  flex: 0 0 34px;
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .4);
  background: rgba(6,16,28,.5);
  color: var(--int-lit, #CFE9F5);
  cursor: pointer;
}

/* ── КРЕСТИК ДОСЬЕ ПОД ПАЛЕЦ ────────────────────────────────────
   Комментарий выше обещал: «а на телефоне она ещё и крупнее - в неё
   надо попадать пальцем». Правила, которое это делает, в файле не было
   ни одного: тридцать четыре точки стояли на всех устройствах. Досье
   закрывается ТОЛЬКО этой кнопкой, и промах оставляет человека в окне,
   из которого не выйти.

   Сам рисунок крестика не трогаем, он остаётся шестнадцатым: растёт
   зона нажатия, а не значок. */
@media (pointer: coarse), (max-width: 900px) {
  .rcf-dos-x { width: 44px; height: 44px; flex: 0 0 44px; }
}
.rcf-dos-x svg { width: 16px; height: 16px; flex: 0 0 16px; }
.rcf-dos-h {
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(19px, 3.2vh, 27px);
  letter-spacing: .1em;
  color: var(--int-lit, #CFE9F5);
  text-shadow: 0 0 18px rgba(var(--int-cyan-rgb, 66,178,220), .7);
  padding-right: 38px;
}
/* Обёртка карты: под холстом лежит ролик породы, холст рисует по
   нему приборную обвязку. Обоим один размер и одно скругление. */
.rcf-dos-wrap {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  line-height: 0;
}
.rcf-dos-vid {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: none;
  border-radius: 8px;
}
.rcf-dos-wrap .rcf-dos-map { position: relative; z-index: 1; }

.rcf-dos-map {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .3);
  /* Строка сканера пробегает по снимку: карта снимается сейчас, а
     не лежала заранее */
  -webkit-mask-image: linear-gradient(180deg, #000 0 100%);
  mask-image: linear-gradient(180deg, #000 0 100%);
}
.rcf-dos.on .rcf-dos-map { animation: rcfDosScan 2.6s linear infinite; }
@keyframes rcfDosScan {
  0%   { filter: brightness(1) contrast(1.05); }
  48%  { filter: brightness(1.16) contrast(1.12); }
  100% { filter: brightness(1) contrast(1.05); }
}
.rcf-dos-p {
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: clamp(11.5px, 1.6vh, 14px);
  line-height: 1.5;
  color: rgba(var(--int-lit-rgb, 207,233,245), .88);
  margin: 0;
}
.rcf-dos-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .26);
}
.rcf-dos-facts span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rcf-dos-facts i {
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-style: normal;
  font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .95);
}
.rcf-dos-facts b {
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: clamp(11px, 1.5vh, 13px); font-weight: 600;
  color: var(--int-lit, #CFE9F5);
}
.rcf-dos-facts b.ok { color: #35E08F; }
@media (max-width: 760px) {
  .rcf-dos { width: 90vw; top: 42%; }
  .rcf-dos-facts { grid-template-columns: 1fr 1fr; }
}

/* ── Консоли по бортам плиты ─────────────────────────────────
   Слева обзор системы, справа тяга и скорость. Обе садятся в ниши,
   нарисованные на корпусе: приборы часть кабины, а не наклейки. */
.rc-flight .rcf-left {
  display: flex;
  align-items: center;
  gap: clamp(8px, 1vw, 14px);
  justify-self: start;
  min-width: 0;
}
.rc-flight .rcf-radar {
  width: clamp(70px, 9.5vh, 118px);
  height: clamp(70px, 9.5vh, 118px);
  flex: none;
  border-radius: 50%;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45);
  background: radial-gradient(circle at 50% 50%, rgba(6,20,34,.9), rgba(3,10,18,.95));
  box-shadow: inset 0 0 22px rgba(var(--int-cyan-rgb, 66,178,220), .22);
}
.rc-flight .rcf-right {
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.1vw, 16px);
  justify-self: end;
  min-width: 0;
}

/* Рычаг тяги: настоящая ручка, которую тянут. Ход по вертикали,
   заливка снизу показывает текущее положение, рукоятка едет по
   пазу. Никаких кнопок - орган управления. */
.rc-flight .rcf-thr {
  position: relative;
  width: clamp(26px, 3vh, 38px);
  height: clamp(58px, 8.4vh, 104px);
  flex: none;
  border-radius: 999px;
  cursor: ns-resize;
  touch-action: none;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  background: linear-gradient(180deg, rgba(3,10,18,.9), rgba(8,22,36,.95));
  box-shadow: inset 0 2px 8px rgba(0,0,0,.8);
  overflow: hidden;
}
.rc-flight .rcf-thr-fill {
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 0%;
  background: linear-gradient(0deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .85),
    rgba(var(--int-vio-rgb, 138,89,246), .6));
  transition: height .08s linear;
}
.rc-flight .rcf-thr-grip {
  position: absolute; left: 3px; right: 3px;
  bottom: calc(var(--thr, 0%) );
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(180deg, #dbe9f7, #8ea6bd);
  box-shadow: 0 2px 6px rgba(0,0,0,.85);
  pointer-events: none;
  display: none;
}
.rc-flight .rcf-thr b {
  /* Подпись внутри паза: снаружи её срезала кромка ниши */
  position: absolute; left: 50%; bottom: 5px;
  transform: translateX(-50%) rotate(-90deg);
  transform-origin: 50% 100%;
  font: 700 8.5px/1 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .16em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .9);
  white-space: nowrap;
}
.rc-flight .rcf-thr.live { box-shadow: inset 0 2px 8px rgba(0,0,0,.8), 0 0 20px -4px rgba(var(--int-cyan-rgb, 66,178,220), .9); }
.rc-flight .rcf-thr:focus-visible { outline: 2px solid var(--int-cyan, #42B2DC); outline-offset: 2px; }

/* Навигация в один ряд: перенос читался поломкой панели */
.rc-flight .rcf-deck .rcf-nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  max-width: 100%;
  /* Края ряда растворяются: если кнопки не влезли, обрез читается
     продолжением списка, а не срезанной кнопкой */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
  padding: 0 6px;
}
.rc-flight .rcf-deck .rcf-nav::-webkit-scrollbar { display: none; }
.rc-flight .rcf-deck .rcf-nav button { white-space: nowrap; }

@media (max-width: 760px) {
  .rc-flight .rcf-deck {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 6px;
    padding: 6px 8px;
  }
  .rc-flight .rcf-left .rcf-gauges { display: none; }
  /* Радар на телефоне уходит: экран узкий, и кругляш съедал место у
     клавиш, ради которых плита и существует. Курс виден в меню. */
  .rc-flight .rcf-radar { display: none; }
  .rc-flight .rcf-deck .rcf-nav { max-width: 100%; }
  .rc-flight .rcf-radar { width: 52px; height: 52px; }
  .rc-flight .rcf-thr { width: 22px; height: 52px; }
  .rc-flight .rcf-right .rcf-speed b { font-size: 15px; }
}

/* ── Курсовая строка на верхней перемычке ────────────────────
   Куда идём, сколько осталось, в каком режиме. Место выбрано не
   случайно: на рисунке кабины это перемычка над остеклением, где в
   настоящих кораблях и стоит курсовое табло. */
.rc-flight .rcf-course {
  position: absolute;
  left: 50%;
  /* Под титром сцены, а не на нём: два текста в одной строке
     читались кашей */
  top: clamp(42px, 8.2vh, 78px);
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.4vw, 18px);
  padding: 4px clamp(10px, 1.4vw, 18px);
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: clamp(9px, 1.25vh, 11.5px);
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(var(--int-lit-rgb, 207,233,245), .92);
  text-shadow: 0 1px 3px rgba(2,6,12,.95), 0 0 14px rgba(var(--int-cyan-rgb, 66,178,220), .4);
  pointer-events: none;
  white-space: nowrap;
}
.rc-flight .rcf-course i {
  width: 1px; height: 11px;
  background: rgba(var(--int-cyan-rgb, 66,178,220), .55);
}
.rc-flight .rcf-c-goal { color: var(--int-cyan, #42B2DC); }
.rc-flight .rcf-c-mode { color: rgba(var(--int-vio-rgb, 138,89,246), 1); }

/* ── Бортовые стойки: заряд и корпус ─────────────────────────
   Столбики на скошенных боковинах корпуса - там, где на рисунке
   кабины идут вертикальные приборные панели. Заряд слева, корпус
   справа: разнесены нарочно, чтобы взгляд не путал их. */
.rc-flight .rcf-bars {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.rc-flight .rcf-bar {
  position: absolute;
  bottom: clamp(90px, 22vh, 210px);
  width: clamp(8px, 1vw, 12px);
  height: clamp(70px, 15vh, 150px);
  border-radius: 999px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .4);
  background: rgba(3, 10, 18, .78);
  overflow: hidden;
}
.rc-flight .rcf-bar-en { left: clamp(10px, 2.2vw, 34px); }
.rc-flight .rcf-bar-hull { right: clamp(10px, 2.2vw, 34px); }
.rc-flight .rcf-bar i {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(0deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .95),
    rgba(var(--int-lit-rgb, 207,233,245), .8));
  transition: height .25s linear, background .3s linear;
}
.rc-flight .rcf-bar-en i { height: var(--en, 100%); }
.rc-flight .rcf-bar-hull i {
  height: var(--hull, 100%);
  background: linear-gradient(0deg, rgba(53,224,143,.95), rgba(160,255,210,.8));
}
.rc-flight .rcf-bars.low .rcf-bar-en i { background: linear-gradient(0deg, #ff8a4c, #ffd08a); }
.rc-flight .rcf-bars.hurt .rcf-bar-hull i { background: linear-gradient(0deg, #ff5a5a, #ffb0b0); }
.rc-flight .rcf-bar b {
  position: absolute; left: 50%; bottom: -15px;
  text-shadow: 0 1px 3px rgba(2,6,12,.95);
  transform: translateX(-50%);
  font: 700 8px/1 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .14em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .85);
}
.rc-flight .rcf-bar u {
  position: absolute; left: 50%; top: -16px;
  transform: translateX(-50%);
  font: 700 10px/1 var(--f-body, "Golos Text", sans-serif);
  color: rgba(var(--int-lit-rgb, 207,233,245), .95);
  text-decoration: none;
  text-shadow: 0 1px 3px rgba(2,6,12,.95);
}

/* Сигнальная лампа сближения: корпус под нагрузкой, и кадр об этом
   говорит - красная кромка по краям, как аварийное освещение */
@keyframes rcfAlarm {
  0%, 100% { opacity: .18; }
  50%      { opacity: .5; }
}
.rc-flight.rcf-alarm::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 5;
  box-shadow: inset 0 0 130px -30px rgba(255, 70, 70, .95);
  animation: rcfAlarm .9s ease-in-out infinite;
}

@media (max-width: 760px) {
  .rc-flight .rcf-bar { bottom: clamp(80px, 20vh, 150px); height: clamp(56px, 12vh, 110px); width: 7px; }
  .rc-flight .rcf-bar-en { left: 6px; }
  .rc-flight .rcf-bar-hull { right: 6px; }
  /* Курсовая строка уходит под титр: на узком экране они стояли в
     одной точке и наезжали друг на друга. Имя цели там же не нужно -
     его показывает клавиша «Курс». */
  .rc-flight .rcf-course {
    font-size: 9px;
    gap: 8px;
    top: clamp(58px, 11vh, 92px);
  }
  .rc-flight .rcf-c-goal { display: none; }
  .rc-flight .rcf-course i:first-of-type { display: none; }
}

/* Мёртвые правила карточки задания сняты 27.08. Они требовали
   .rcf-hud > .rcf-mis, то есть прямого потомка, а карточка лежит
   через .rcf-top и .rcf-trow. Три media-блока подгонки не применялись
   ни разу и только сбивали с толку при следующей правке. Живая
   раскладка карточки - ниже, в блоке .rcf-trow. */

/* ── Текущее задание ─────────────────────────────────────────
   Одна строка: что делаем, зачем и сколько осталось. Стоит у
   левого борта, на вертикальной приборной панели корпуса - там же,
   где в кабине и положено висеть полётному заданию. */
/* Карточка задания стоит у левого борта, а по центру над ней висит
   строка состояния («САТУРН · 1,4 млрд км от ваших пользователей»).
   На четыре к трём они наезжали друг на друга: заказчик прислал кадр,
   где начало строки уходит под карточку. Строка тянется от центра в
   обе стороны и на широком экране до карточки не достаёт, а на
   квадратном экране достаёт. Опускаем карточку ниже строки - место
   слева от неё всё равно пустое. */
.rc-flight .rcf-mis {
  position: absolute;
  left: clamp(30px, 4.4vw, 68px);
  top: clamp(64px, 12vh, 118px);
  width: clamp(180px, 22vw, 290px);
  padding: 10px 13px 12px;
  border-radius: 10px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .34);
  /* Метки тел лежат слоем выше (z-index 12) и накрывали карточку:
     замер дал перекрытия до 162 на 17 точек, слово «ОСМОТРЕТЬСЯ»
     читалось сквозь имя планеты. Поднимаем карточку над метками и
     делаем подложку плотной - тогда сверху лежит то, что читают, а
     не смесь двух надписей.

     Размытие подложки убрано заодно: это отдельный слой композитора
     на каждый кадр, а плотный фон делает ту же работу даром. */
  z-index: 14;
  background: linear-gradient(165deg, rgba(var(--int-cyan-rgb, 66,178,220), .12), rgba(5, 14, 26, .94));
  font-family: var(--f-body, "Golos Text", sans-serif);
  pointer-events: none;
  box-shadow: 0 0 34px -14px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-mis b {
  display: block;
  font-size: clamp(11px, 1.5vh, 13px);
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--int-cyan, #42B2DC);
  margin-bottom: 3px;
}
.rc-flight .rcf-mis span {
  display: block;
  font-size: clamp(10px, 1.35vh, 12px);
  line-height: 1.4;
  color: rgba(var(--int-lit-rgb, 207,233,245), .82);
}
.rc-flight .rcf-mis i {
  display: block;
  height: 3px;
  margin-top: 8px;
  border-radius: 999px;
  background: rgba(var(--int-lit-rgb, 207,233,245), .16);
  overflow: hidden;
}
.rc-flight .rcf-mis u {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--int-cyan, #42B2DC), var(--int-vio, #8A59F6));
  transition: width .5s var(--ease, ease);
}
.rc-flight .rcf-mis em {
  display: block;
  margin-top: 5px;
  font-size: 9.5px;
  font-style: normal;
  letter-spacing: .16em;
  color: rgba(var(--int-lit-rgb, 207,233,245), .6);
}
.rc-flight .rcf-mis.full { border-color: rgba(53,224,143,.55); }
.rc-flight .rcf-mis.full b { color: #35E08F; }
.rc-flight.rcf-stage .rcf-mis { opacity: 0 !important; }

@media (max-width: 760px) {
  /* На телефоне задание уходит вниз, к приборам. Сверху идёт
     курсовая строка, и две надписи в одной точке кадра читались
     кашей - владелец увидел именно это наложение. */
  .rc-flight .rcf-mis {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    top: auto !important;
    bottom: 12px !important;
    width: min(92vw, 380px);
    padding: 7px 11px 9px;
  }
  .rc-flight .rcf-mis span { display: none; }
  .rc-flight .rcf-mis i { margin-top: 6px; }
  /* Меню открывается выше задания, чтобы не спорить с ним */
  .rc-flight .rcf-menu { bottom: calc(var(--cab-dh, 19%) + 58px); }
}

/* Кнопка снимка: маленький прибор на правой консоли, рядом с тягой */
.rc-flight .rcf-shot {
  width: clamp(28px, 3.4vh, 40px);
  height: clamp(28px, 3.4vh, 40px);
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 9px;
  cursor: pointer;
  color: rgba(var(--int-lit-rgb, 207,233,245), .9);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45);
  background: linear-gradient(180deg, rgba(20,40,61,.85), rgba(8,20,34,.95));
  transition: color .18s linear, border-color .18s linear, box-shadow .18s linear;
}
.rc-flight .rcf-shot svg { width: 58%; height: 58%; }
.rc-flight .rcf-shot:hover {
  color: #fff;
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .9);
  box-shadow: 0 0 20px -4px rgba(var(--int-cyan-rgb, 66,178,220), .9);
}
@media (max-width: 760px) {
  .rc-flight .rcf-shot { width: 26px; height: 26px; }
}

/* ── Табло аварии ────────────────────────────────────────────
   Узел упал, до него надо долететь. Строка стоит под курсовой, а
   кадр по краям тревожно пульсирует: это событие, а не подсказка. */
.rc-flight .rcf-fail {
  position: absolute;
  left: 50%;
  top: clamp(64px, 12.4vh, 108px);
  transform: translateX(-50%);
  padding: 5px 16px;
  border-radius: 999px;
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: clamp(9.5px, 1.3vh, 12px);
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #ffd7d7;
  background: rgba(60, 8, 8, .62);
  border: 1px solid rgba(255, 90, 90, .55);
  box-shadow: 0 0 26px -8px rgba(255, 70, 70, .9);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s linear;
  white-space: nowrap;
}
.rc-flight .rcf-fail.on { opacity: 1; }
@keyframes rcfOutage {
  0%, 100% { opacity: .1; }
  50%      { opacity: .32; }
}
.rc-flight.rcf-outage::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  z-index: 4;
  box-shadow: inset 0 0 110px -40px rgba(255, 90, 90, .9);
  animation: rcfOutage 1.6s ease-in-out infinite;
}
.rc-flight.rcf-stage .rcf-fail { opacity: 0 !important; }

/* ── Консоль сети: что построено ─────────────────────────────
   Список узлов у правого борта, на вертикальной приборной панели
   корпуса. Счётчик говорил сколько, список говорит каких - а это и
   есть результат игры. */
.rc-flight .rcf-netlist {
  position: absolute;
  right: clamp(30px, 4.4vw, 68px);
  top: clamp(64px, 12vh, 118px);
  width: clamp(120px, 13vw, 168px);
  padding: 9px 11px 10px;
  border-radius: 10px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .3);
  background: linear-gradient(195deg, rgba(var(--int-cyan-rgb, 66,178,220), .09), rgba(5, 14, 26, .58));
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  font-family: var(--f-body, "Golos Text", sans-serif);
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.rc-flight .rcf-netlist i {
  font-style: normal;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .95);
  margin-bottom: 2px;
}
.rc-flight .rcf-netlist span {
  font-size: clamp(9.5px, 1.25vh, 11.5px);
  font-weight: 600;
  letter-spacing: .04em;
  color: rgba(var(--int-lit-rgb, 207,233,245), .86);
  display: flex;
  align-items: center;
  gap: 6px;
}
.rc-flight .rcf-netlist span::before {
  content: "";
  width: 5px; height: 5px;
  border-radius: 50%;
  flex: none;
  background: #35E08F;
  box-shadow: 0 0 8px rgba(53,224,143,.9);
}
.rc-flight .rcf-netlist span.down { color: #ffb3b3; }
.rc-flight .rcf-netlist span.down::before { background: #ff5a5a; box-shadow: 0 0 8px rgba(255,90,90,.95); }
.rc-flight .rcf-netlist span.want { color: #ffe0a8; }
.rc-flight .rcf-netlist span.want::before { background: #ffc46a; box-shadow: 0 0 8px rgba(255,196,106,.9); }
.rc-flight .rcf-netlist span.more { color: rgba(var(--int-lit-rgb, 207,233,245), .55); }
.rc-flight .rcf-netlist span.more::before { background: rgba(var(--int-lit-rgb, 207,233,245), .4); box-shadow: none; }
.rc-flight.rcf-stage .rcf-netlist { opacity: 0 !important; }

@media (max-width: 760px) {
  .rc-flight .rcf-netlist { display: none; }
}

/* ── Карточка пилота: итог полёта ────────────────────────────
   Игра должна чем-то заканчиваться. Лист с итогом выезжает, когда
   сеть замкнута во всех рукавах, и предлагает сохранить кадр. */
.rc-flight .rcf-pilot {
  position: absolute;
  inset: 0;
  /* Выше панелей: меню, справка и досье стоят слоем 30, а карточка
     финала стояла восьмым, и награда за всю игру пряталась под
     открытым меню КУРС - из-под него торчали две кнопки и обрывок
     слова. Финал перекрывает всё. */
  z-index: 40;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse 70% 60% at 50% 50%,
    rgba(var(--int-deep-rgb, 5,12,21), .35), rgba(var(--int-deep-rgb, 5,12,21), .82));
  opacity: 0;
  transition: opacity .5s var(--ease, ease);
  pointer-events: none;
}
.rc-flight .rcf-pilot.on { opacity: 1; pointer-events: auto; }
.rc-flight .rcf-pilot-in {
  width: min(560px, 88vw);
  padding: clamp(20px, 3.4vh, 34px) clamp(20px, 3vw, 34px);
  border-radius: 16px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  background: linear-gradient(168deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .14),
    rgba(6, 16, 28, .84));
  backdrop-filter: blur(6px) saturate(1.2);
  -webkit-backdrop-filter: blur(6px) saturate(1.2);
  box-shadow: 0 0 90px -22px rgba(var(--int-cyan-rgb, 66,178,220), 1);
  text-align: center;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-pilot i {
  display: block;
  font-style: normal;
  font-size: 10px; font-weight: 700;
  letter-spacing: .3em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .95);
}
.rc-flight .rcf-pilot b {
  display: block;
  margin: 8px 0 16px;
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(26px, 5vh, 42px);
  letter-spacing: .1em;
  color: var(--int-lit, #CFE9F5);
  text-shadow: 0 0 26px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-pilot-g {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .28);
  border-bottom: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .28);
}
.rc-flight .rcf-pilot-g span {
  display: flex; flex-direction: column; gap: 3px;
  font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(var(--int-lit-rgb, 207,233,245), .62);
}
.rc-flight .rcf-pilot-g u {
  text-decoration: none;
  font-size: clamp(18px, 3.2vh, 26px);
  font-weight: 700;
  color: var(--int-lit, #CFE9F5);
}
.rc-flight .rcf-pilot p {
  margin: 14px 0 18px;
  font-size: clamp(11.5px, 1.6vh, 14px);
  line-height: 1.55;
  color: rgba(var(--int-lit-rgb, 207,233,245), .84);
}
.rc-flight .rcf-pilot-b { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rc-flight .rcf-pilot-b button {
  padding: 11px 22px;
  border-radius: 999px;
  cursor: pointer;
  font: 700 12px/1 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--int-lit, #CFE9F5);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .6);
  background: rgba(var(--int-cyan-rgb, 66,178,220), .16);
}
.rc-flight .rcf-pilot-b button:first-child {
  background: linear-gradient(180deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .4),
    rgba(var(--int-cyan-rgb, 66,178,220), .2));
}
.rc-flight .rcf-pilot-b button:hover { filter: brightness(1.2); }
@media (max-width: 760px) {
  .rc-flight .rcf-pilot-g { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   Меню курса: одна кнопка вместо ряда из тринадцати

   Ряд не помещался никуда: на телефоне было видно две кнопки, и до
   Млечного Пути с чужими рукавами человек просто не мог добраться.
   Теперь на плите три клавиши - курс, сканер, автопилот, - а всё
   остальное живёт в меню, которое открывается над ними.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-keys {
  display: flex;
  gap: clamp(4px, 1vw, 12px);
  align-items: stretch;
  justify-content: center;
  /* На узком телефоне пять клавиш в строку не помещаются, и левая
     уезжала за кромку кадра. Ряд сжимается и, если совсем тесно,
     листается пальцем - но ни одна клавиша не оказывается за
     экраном. */
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
  padding: 0 2px;
}
.rc-flight .rcf-keys::-webkit-scrollbar { display: none; }
.rc-flight .rcf-keys button { flex: 0 0 auto; }
.rc-flight .rcf-keys button {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: clamp(7px, 1.1vh, 11px) clamp(10px, 1.3vw, 16px);
  border-radius: 10px;
  cursor: pointer;
  font-family: var(--f-body, "Golos Text", sans-serif);
  color: rgba(var(--int-lit-rgb, 207,233,245), .9);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .42);
  background: linear-gradient(180deg, rgba(20,40,61,.9), rgba(8,20,34,.96));
  transition: color .18s linear, border-color .18s linear, box-shadow .18s linear;
  white-space: nowrap;
}
.rc-flight .rcf-keys button svg { width: 15px; height: 15px; flex: none; }
.rc-flight .rcf-keys button b {
  font-size: clamp(9.5px, 1.25vh, 11.5px);
  font-weight: 700;
  letter-spacing: .14em;
}
.rc-flight .rcf-keys button u {
  text-decoration: none;
  font-size: clamp(9px, 1.2vh, 11px);
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--int-cyan, #42B2DC);
  max-width: 12ch;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rc-flight .rcf-keys button:hover,
.rc-flight .rcf-keys button.cur,
.rc-flight .rcf-keys button[aria-pressed="true"] {
  color: #fff;
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .95);
  box-shadow: 0 0 20px -5px rgba(var(--int-cyan-rgb, 66,178,220), .95);
}

/* Прокручиваемое нутро меню. Панель держит рамку и фон, список ездит
   внутри неё. Растворение краёв живёт здесь же: маска на самой
   прокручиваемой коробке стоит на месте, а содержимое под ней едет.
   Верх растворяем так же, как низ - прокрученное меню рубило ряд
   кнопок ровно посередине, на кадре телефона видна половина строки
   УРАН/НЕПТУН. */
.rc-flight .rcf-menu-in {
  /* Высоту коробки ограничивает флекс, а не проценты: у панели стоит
     max-height, а собственной высоты нет, и доля от неё разрешается в
     «без ограничения» - коробка вырастала во всё содержимое (замер:
     690 точек при панели в 428), и ездила снова сама панель. Флекс с
     min-height: 0 сжимает коробку ровно по месту, которое панели
     оставил её потолок. */
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18px, #000 calc(100% - 28px), rgba(0,0,0,.15));
  mask-image: linear-gradient(180deg, transparent 0, #000 18px, #000 calc(100% - 28px), rgba(0,0,0,.15));
  padding: clamp(12px, 1.8vh, 18px);
  padding-top: calc(clamp(12px, 1.8vh, 18px) + 18px);
  padding-bottom: calc(clamp(12px, 1.8vh, 18px) + 30px);
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--int-cyan-rgb, 66,178,220), .55) rgba(4,12,22,.4);
  position: relative;
  z-index: 2;
}

/* Само меню: сетка целей и рукавов, открывается над плитой */
.rc-flight .rcf-menu {
  position: absolute;
  left: 50%;
  bottom: calc(var(--cab-dh, 19%) + clamp(6px, 1.4vh, 16px));
  transform: translateX(-50%) translateY(12px);
  width: min(620px, 92vw);
  /* Список длинный: тринадцать тел и четыре рукава. Он и прокручивался,
     но на телефоне полосы прокрутки нет, и обрезанные по нижней кромке
     «СОЛНЕЧНАЯ» и «МЕСТНЫЙ» читались поломкой, а не продолжением.

     Даём больше высоты и растворяем нижний край: край, уходящий в
     прозрачность, сам говорит, что ниже есть ещё. Плюс запас снизу,
     чтобы последняя строка не заканчивалась ровно на срезе. */
  max-height: min(64vh, 520px);
  /* Прокручивается ВНУТРЕННЯЯ коробка, а не сама панель: уголковая
     рамка и развёртка строк стоят в панели абсолютом, и в
     прокручиваемой панели они считались от всей высоты содержимого -
     прямоугольник рамки уезжал в середину списка. */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .42);
  background: linear-gradient(170deg, rgba(10,21,36,.96), rgba(5,12,21,.98));
  box-shadow: 0 30px 70px -22px rgba(0,0,0,.96), 0 0 46px -18px rgba(var(--int-cyan-rgb, 66,178,220), .7);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .28s var(--ease), transform .28s var(--ease), visibility 0s linear .28s;
  z-index: 6;
}
.rc-flight .rcf-menu.on {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
  transition: opacity .28s var(--ease), transform .28s var(--ease);
}
.rc-flight .rcf-menu-h {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 4px 0 8px;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-menu-h:not(:first-child) { margin-top: 16px; }
.rc-flight .rcf-menu-h i {
  font-style: normal;
  font-size: 9.5px; font-weight: 700; letter-spacing: .2em;
  color: var(--int-cyan, #42B2DC);
}
.rc-flight .rcf-menu-h span {
  font-size: 10px;
  color: rgba(var(--int-lit-rgb, 207,233,245), .5);
}
/* Цели сеткой: на любом экране всё видно целиком */
.rc-flight .rcf-menu .rcf-nav {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 6px;
  max-width: none;
  overflow: visible;
  -webkit-mask-image: none;
  mask-image: none;
  padding: 0;
}
.rc-flight .rcf-menu .rcf-nav button {
  width: 100%;
  justify-content: center;
  text-align: center;
}
.rc-flight .rcf-menu .rcf-uni {
  position: static;
  transform: none;
  opacity: 1; visibility: visible; pointer-events: auto;
  min-width: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 6px;
}
.rc-flight .rcf-menu .rcf-uni button { margin: 0; }
/* Кнопка рукава внутри меню: своя типографика, а не унаследованная от
   отдельной панели прыжков. На телефоне заказчика её заголовок шёл
   огромными буквами в две строки, «СОЛНЕЧНАЯ СИСТЕМА» и «МЕСТНЫЙ
   РУКАВ» срезало нижней кромкой, и до третьего рукава он не долистал. */
.rc-flight .rcf-menu .rcf-uni button {
  display: block; text-align: left;
  padding: 9px 12px; line-height: 1.3;
}
.rc-flight .rcf-menu .rcf-uni button b {
  display: block;
  font-size: 12px; font-weight: 700; letter-spacing: .08em;
}
.rc-flight .rcf-menu .rcf-uni button span {
  display: block; margin-top: 2px;
  font-size: 10px; line-height: 1.35;
  color: rgba(var(--int-lit-rgb, 207,233,245), .58);
}
/* Подзаголовок раздела переносится, а не обрывается на «прыжок через М...» */
.rc-flight .rcf-menu-h { flex-wrap: wrap; }
.rc-flight .rcf-menu-h span { flex: 1 1 100%; line-height: 1.4; }
@media (max-width: 760px) {
  .rc-flight .rcf-menu .rcf-uni { grid-template-columns: 1fr; }
  .rc-flight .rcf-menu .rcf-nav { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }
  .rc-flight .rcf-menu .rcf-nav button { padding: 8px 6px; font-size: 11px; }
  .rc-flight .rcf-menu .rcf-uni button b { font-size: 11.5px; }
}
.rc-flight.rcf-stage .rcf-menu { opacity: 0 !important; visibility: hidden !important; }

@media (max-width: 760px) {
  .rc-flight .rcf-keys button b { display: none; }
  .rc-flight .rcf-keys .rcf-navkey b { display: inline; }
  .rc-flight .rcf-keys button { padding: 8px 9px; gap: 5px; }
}
/* Совсем узкий экран: у кнопки курса остаётся только цель, подпись
   уходит - иначе ряд не влезает даже с прокруткой */
@media (max-width: 400px) {
  .rc-flight .rcf-keys .rcf-navkey b { display: none; }
  .rc-flight .rcf-keys button { padding: 8px 7px; }
  .rc-flight .rcf-keys .rcf-navkey u { max-width: 8ch; }
}
@media (max-width: 760px) {
  .rc-flight .rcf-menu { width: 94vw; max-height: 52vh; }
  .rc-flight .rcf-menu .rcf-nav { grid-template-columns: repeat(3, 1fr); }
  .rc-flight .rcf-menu .rcf-uni { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   Единый материал голограммы

   «Все всплывающие окна с описаниями выбиваются из стиля и должны
   появляться как голограмма из панели управления, как часть всего
   3D мира» - верно, и это касается всего: досье, задания, меню,
   списка сети, титров, брифинга.

   Материал один на всё: почти прозрачное стекло, циановая кромка,
   развёртка строк, уголки рамки и появление разрывом изображения.
   Ничего не «выезжает» и не «всплывает» - проекция включается.
   ═══════════════════════════════════════════════════════════ */
@keyframes rcfHoloIn {
  0%   { opacity: 0; clip-path: inset(46% 0 46% 0); filter: brightness(2.4) saturate(.4); }
  16%  { opacity: 1; clip-path: inset(6% 0 62% 0);  filter: brightness(1.6) saturate(1.6); }
  32%  { opacity: .6; clip-path: inset(58% 0 8% 0); filter: brightness(1.9) saturate(.7); }
  48%  { opacity: 1; clip-path: inset(18% 0 34% 0); filter: brightness(1.3) saturate(1.3); }
  64%  { opacity: .85; clip-path: inset(0 0 70% 0); filter: none; }
  100% { opacity: 1; clip-path: inset(0 0 0 0);     filter: none; }
}
/* Общий материал не трогает способ позиционирования: задание и
   список сети стоят абсолютом по кадру, и объявленный здесь relative
   сбрасывал им координаты - блок улетал за верхнюю кромку. */
.rc-flight .rcf-dos-in,
.rc-flight .rcf-brief-card,
.rc-flight .rcf-pilot-in { position: relative; }
.rc-flight .rcf-menu,
.rc-flight .rcf-dos-in,
.rc-flight .rcf-mis,
.rc-flight .rcf-netlist,
.rc-flight .rcf-brief-card,
.rc-flight .rcf-pilot-in {
  /* Стекло проекции: сквозь него читается космос, а не глухая плита */
  background:
    linear-gradient(168deg,
      rgba(var(--int-cyan-rgb, 66,178,220), .13),
      rgba(6, 16, 28, .52) 46%,
      rgba(6, 16, 28, .62)) !important;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45) !important;
  backdrop-filter: blur(4px) saturate(1.2);
  -webkit-backdrop-filter: blur(4px) saturate(1.2);
  box-shadow:
    inset 0 1px 0 rgba(226,232,240,.16),
    0 0 46px -16px rgba(var(--int-cyan-rgb, 66,178,220), .85),
    /* Пролив света вниз, к панели: у проекции есть направление, и
       свет от неё падает туда, откуда её бьют. Тень рисуется ЗА
       рамкой, поэтому обрезка самой карточки её не съедает - в
       отличие от псевдоэлемента, на котором первый заход сгорел. */
    0 30px 54px -26px rgba(var(--int-cyan-rgb, 66,178,220), .62) !important;
}

/* Досье - единственная панель, которую действительно ЧИТАЮТ: три
   абзаца текста и таблица чисел. Остальные проекции глазом ловят на
   лету, и полупрозрачное стекло им идёт. Заказчик написал прямо:
   «досье полупрозрачное, за ним просвечивает планета, читать тяжело»,
   и он прав - на светлой стороне Земли под шестьюдесятью процентами
   плотности контраст текста падает вдвое.

   Даём читаемую плотность и снимаем backdrop-filter: он тут больше не
   нужен (сквозь такую плотность всё равно ничего не разобрать), а
   стоит дорого - это самое большое стекло в кадре, и оно висит поверх
   трёхмерной сцены. Стеклянный характер держим кромкой, бликом сверху
   и свечением по контуру, а не прозрачностью. */
.rc-flight .rcf-dos-in {
  background:
    linear-gradient(168deg,
      rgba(var(--int-cyan-rgb, 66,178,220), .10),
      rgba(5, 13, 23, .955) 44%,
      rgba(4, 10, 19, .975)) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* Развёртка строк по всей поверхности проекции */
.rc-flight .rcf-menu::before,
.rc-flight .rcf-dos-in::before,
.rc-flight .rcf-mis::before,
.rc-flight .rcf-netlist::before,
.rc-flight .rcf-brief-card::before,
.rc-flight .rcf-pilot-in::before {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: repeating-linear-gradient(180deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .07) 0 1.4px,
    transparent 1.4px 3.4px);
  mix-blend-mode: screen;
  z-index: 0;
}
/* Уголки рамки: проекция собрана лучом, у неё есть габарит */
.rc-flight .rcf-menu::after,
.rc-flight .rcf-dos-in::after,
.rc-flight .rcf-mis::after,
.rc-flight .rcf-netlist::after,
.rc-flight .rcf-pilot-in::after {
  content: "";
  position: absolute;
  inset: 5px;
  pointer-events: none;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  border-radius: inherit;
  -webkit-mask-image:
    linear-gradient(90deg, #000 0 18px, transparent 18px calc(100% - 18px), #000 calc(100% - 18px) 100%),
    linear-gradient(180deg, #000 0 18px, transparent 18px calc(100% - 18px), #000 calc(100% - 18px) 100%);
  mask-image:
    linear-gradient(90deg, #000 0 18px, transparent 18px calc(100% - 18px), #000 calc(100% - 18px) 100%),
    linear-gradient(180deg, #000 0 18px, transparent 18px calc(100% - 18px), #000 calc(100% - 18px) 100%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
  z-index: 1;
}
.rc-flight .rcf-menu > *,
.rc-flight .rcf-dos-in > *,
.rc-flight .rcf-mis > *,
.rc-flight .rcf-netlist > *,
.rc-flight .rcf-pilot-in > * { position: relative; z-index: 2; }
/* Крестик закрытия из этого правила выведен обратно.

   Правило выше поднимает содержимое панели над развёрткой строк, и
   вместе со всеми оно роняло в поток кнопку закрытия: `position:
   absolute` у неё весом 0,1,0 проигрывал этому селектору весом
   0,2,0. Крестик уезжал в ЛЕВЫЙ верхний угол и вставал на кромку
   карточки, а `right: 8px` работал как относительный сдвиг. Замер:
   на телефоне крестик стоял на x=85,8 при карточке от 82,8, хотя
   должен на 287. Заодно это резало заголовок: под крестик
   зарезервировано место СПРАВА, а он был слева, и «АСТЕРОИДНЫЙ
   ПОЯС» уходил за кромку на восемь точек. */
.rc-flight .rcf-dos-in > .rcf-dos-x {
  position: absolute;
  right: 8px;
  left: auto;
  top: 8px;
  z-index: 3;
}

/* Включение проекции: разрыв изображения, а не выезд */
.rc-flight .rcf-menu.on,
.rc-flight .rcf-dos.on .rcf-dos-in,
.rc-flight .rcf-pilot.on .rcf-pilot-in {
  animation: rcfHoloIn .46s steps(1, end) 1;
}
.rc-flight .rcf-mis.rcf-flick,
.rc-flight .rcf-netlist.rcf-flick {
  animation: rcfHoloIn .38s steps(1, end) 1;
}

/* Титр сцены тоже проекция, а не системное уведомление поверх кадра.
   «Сверху какое-то всплывающее окно, оно выбивается по стилю, ни
   голограмма ни часть, а просто всплывающее уведомление поверх» -
   было именно так. */
.rc-flight .rcf-cap {
  padding: 6px 18px;
  border-radius: 999px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .34);
  background: linear-gradient(168deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .12),
    rgba(6, 16, 28, .5));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 0 30px -12px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}

/* ── Корпус по краям кадра ───────────────────────────────────
   «Панель управления на мобильном прозрачная по краям - как он
   может просвечивать внутри корабля? Только впереди, где окно.
   По краям и по углам не должно быть прозрачным».

   Верно: рисунок кабины выводится по object-fit: cover, и на узком
   экране его боковины уходят за кадр - по краям остаётся голый
   космос. Подкладываем корпус: тёмная обшивка по периметру,
   плотная в углах и сходящая на нет к середине окна. */
.rc-flight::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background:
    /* Боковины */
    linear-gradient(90deg,
      rgba(4, 11, 20, .98) 0%,
      rgba(6, 15, 26, .72) 4%,
      rgba(6, 15, 26, 0) 11%),
    linear-gradient(270deg,
      rgba(4, 11, 20, .98) 0%,
      rgba(6, 15, 26, .72) 4%,
      rgba(6, 15, 26, 0) 11%),
    /* Верх и низ */
    linear-gradient(180deg,
      rgba(4, 11, 20, .95) 0%,
      rgba(6, 15, 26, .5) 3%,
      rgba(6, 15, 26, 0) 9%),
    linear-gradient(0deg,
      rgba(4, 11, 20, .98) 0%,
      rgba(6, 15, 26, .6) 6%,
      rgba(6, 15, 26, 0) 16%);
}
/* Подложка работает и в режиме сцены. Отключать её там нельзя:
   в момент старта она включалась разом, и кадр по краям темнел
   рывком - это и была видимая часть подмены. Теперь по краям
   одинаково до и после, а в салоне затемнение ложится на стены и
   лишь добавляет им глубины. */

@media (max-width: 760px) {
  /* На телефоне боковины уходят за кадр сильнее - подложка шире */
  .rc-flight::before {
    background:
      linear-gradient(90deg,
        rgba(4, 11, 20, 1) 0%,
        rgba(5, 13, 23, .88) 6%,
        rgba(6, 15, 26, 0) 17%),
      linear-gradient(270deg,
        rgba(4, 11, 20, 1) 0%,
        rgba(5, 13, 23, .88) 6%,
        rgba(6, 15, 26, 0) 17%),
      linear-gradient(180deg,
        rgba(4, 11, 20, .98) 0%,
        rgba(6, 15, 26, .6) 4%,
        rgba(6, 15, 26, 0) 11%),
      linear-gradient(0deg,
        rgba(4, 11, 20, 1) 0%,
        rgba(5, 13, 23, .8) 8%,
        rgba(6, 15, 26, 0) 20%);
  }
}

/* ── Справка: как летать ─────────────────────────────────────
   Раньше об управлении говорила одна строка подсказки, которая
   гасла через семь секунд и больше не возвращалась. Теперь есть
   клавиша со знаком вопроса, и справка открывается той же
   голограммой, что и всё остальное. */
.rc-flight .rcf-help {
  position: absolute;
  inset: 0;
  z-index: 7;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse 70% 60% at 50% 50%,
    rgba(var(--int-deep-rgb, 5,12,21), .28), rgba(var(--int-deep-rgb, 5,12,21), .74));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .3s var(--ease, ease), visibility 0s linear .3s;
}
.rc-flight .rcf-help.on {
  opacity: 1; visibility: visible; pointer-events: auto;
  transition: opacity .3s var(--ease, ease);
}
.rc-flight .rcf-help-in {
  position: relative;
  width: min(520px, 90vw);
  max-height: 78vh;
  overflow-y: auto;
  padding: clamp(18px, 3vh, 28px) clamp(18px, 2.6vw, 28px);
  border-radius: 14px;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .45);
  background: linear-gradient(168deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .13),
    rgba(6, 16, 28, .78));
  backdrop-filter: blur(5px) saturate(1.2);
  -webkit-backdrop-filter: blur(5px) saturate(1.2);
  box-shadow: 0 0 70px -20px rgba(var(--int-cyan-rgb, 66,178,220), .95);
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-help.on .rcf-help-in { animation: rcfHoloIn .42s steps(1, end) 1; }
/* Крестик справки прилипает к верхней кромке панели.

   Панель прокручивается, а крестик стоял в ней `absolute` - уезжал
   вместе с содержимым. Замер: на телефоне после прокрутки на 238
   точек он оказывался на 227 точек ВЫШЕ панели, на мониторе на 152.
   Справку было нечем закрыть, кроме Escape, о котором никто не
   знает. Sticky держит его на месте в любом положении списка.

   Тридцать точек под палец мало (норма тридцать две) - подрос. */
.rc-flight .rcf-help-x {
  position: sticky;
  float: right;
  top: 0;
  margin: -6px -6px 0 0;
  width: 34px; height: 34px;
  flex: 0 0 34px;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .4);
  background: rgba(6,16,28,.6);
  color: var(--int-lit, #CFE9F5);
  cursor: pointer;
}
.rc-flight .rcf-help-x svg { width: 15px; height: 15px; }
.rc-flight .rcf-help b {
  display: block;
  /* Место под крестик: без отступа коробка заголовка уходила прямо
     под него - на телефоне перекрытие тридцать на тридцать точек. */
  padding-right: 42px;
  margin-bottom: 14px;
  font-family: var(--f-head, "Unbounded", sans-serif);
  font-size: clamp(20px, 3.4vh, 28px);
  letter-spacing: .12em;
  color: var(--int-lit, #CFE9F5);
  text-shadow: 0 0 22px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-help ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.rc-flight .rcf-help li {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 12px;
  align-items: baseline;
  padding-bottom: 9px;
  border-bottom: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .18);
}
.rc-flight .rcf-help li:last-child { border-bottom: 0; padding-bottom: 0; }
.rc-flight .rcf-help li i {
  font-style: normal;
  font-size: 9.5px; font-weight: 700; letter-spacing: .18em;
  color: var(--int-cyan, #42B2DC);
}
.rc-flight .rcf-help li span {
  font-size: clamp(11.5px, 1.6vh, 13.5px);
  line-height: 1.5;
  color: rgba(var(--int-lit-rgb, 207,233,245), .88);
}
.rc-flight.rcf-stage .rcf-help { display: none; }

/* Стоп и справка - клавиши того же ряда */
.rc-flight .rcf-stop-key svg,
.rc-flight .rcf-help-key svg { width: 15px; height: 15px; }
.rc-flight .rcf-help-key { padding-left: 10px; padding-right: 10px; }

@media (max-width: 760px) {
  .rc-flight .rcf-stop-key b { display: none; }
  /* На телефоне справка компактнее: иначе шесть строк не влезают в
     окно и последняя обрывается */
  .rc-flight .rcf-help li { grid-template-columns: 66px 1fr; gap: 8px; padding-bottom: 6px; }
  .rc-flight .rcf-help ul { gap: 6px; }
  .rc-flight .rcf-help li i { font-size: 9px; letter-spacing: .07em; }
  .rc-flight .rcf-help li span { font-size: 11px; line-height: 1.4; }
  .rc-flight .rcf-help b { font-size: 19px; margin-bottom: 10px; }
  .rc-flight .rcf-help-in { padding: 14px 14px 16px; }
}

/* ═══════════════════════════════════════════════════════════
   Окно корабля - граница для всего

   «У нас типа панель = окно корабля = экран с голограммами, за
   рамки панели надписи в корабль не могут попадать, накладываться.
   И чтобы окна и надписи друг на друга не накладывались тоже.»

   Значит у приборов ровно две области, и третьей быть не может:
     - остекление: всё, что светится на стекле - титры, задание,
       список сети, метки, досье, справка, меню;
     - ниша корпуса: плита с клавишами, радар, тяга, скорость.

   Ниже слой приборов приводится к границам остекления и обрезается
   по ним. Ни одна надпись физически не может выйти на корпус.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-hud {
  left: var(--cab-wx, 6%);
  top: var(--cab-hy, var(--cab-wy, 8%));
  right: auto;
  bottom: auto;
  width: var(--cab-ww, 88%);
  height: var(--cab-hh, var(--cab-wh, 68%));
  overflow: hidden;
  /* Скругление по форме остекления: свет проекции не должен
     доходить до самых углов рамы */
  border-radius: clamp(10px, 2vw, 28px);
}

/* Раскладка на стекле: три пояса сверху вниз, без пересечений.
   Каждый элемент знает свою полосу и не заходит в чужую. */
.rc-flight .rcf-hud .rcf-cap {
  top: 8px;
  max-width: 92%;
  white-space: normal;
  text-align: center;
}
.rc-flight .rcf-hud .rcf-course {
  top: auto;
  bottom: 8px;
  left: 50%;
}
.rc-flight .rcf-hud .rcf-mis {
  left: 10px;
  right: auto;
  top: 52px;
  bottom: auto;
  width: min(46%, 280px);
}
.rc-flight .rcf-hud .rcf-netlist {
  right: 10px;
  left: auto;
  top: 52px;
  width: min(34%, 170px);
}
.rc-flight .rcf-hud .rcf-fail {
  top: 44px;
  bottom: auto;
}
.rc-flight .rcf-hud .rcf-hint {
  /* Над курсовой строкой, а не на ней: два текста в одной точке
     кадра снова читались кашей */
  bottom: 30px;
  max-width: 86%;
}
.rc-flight .rcf-hud .rcf-course { bottom: 6px; }
.rc-flight .rcf-hud .rcf-prog,
.rc-flight .rcf-hud .rcf-net { display: none; }


/* ═══ Верхняя полоса стекла: колонка вместо трёх абсолютных плашек ═══
   Титул тела, плашка аварии и ряд «задание + список узлов» идут
   сверху вниз одной колонкой. Раньше у каждого был свой top, все три
   попадали в полосу 34..81 пикселя, и на телефоне заказчика они
   лежали друг на друге. Колонка убирает саму возможность наложения.

   Ширину держит сама полоса, поэтому длинное название тела больше не
   режется многоточием: оно переносится на вторую строку. */
.rc-flight .rcf-hud .rcf-top {
  position: absolute;
  /* Отступ сверху считается от строки состояния: она стоит первой
     строкой стекла, и колонка начинается под ней, а не на ней. */
  left: 6px; right: 6px; top: 28px;
  display: flex; flex-direction: column; align-items: center;
  gap: 8px;
  pointer-events: none;
  z-index: 4;
}
/* Здесь стоит important, и на то есть причина. Эти три плашки
   раскладывались абсолютными координатами в доброй дюжине мест файла,
   включая правила внутри медиазапросов ниже по тексту. Пока хоть одно
   из них доживало до телефона, колонка ломалась и карточки снова
   ложились друг на друга. Глушим ровно раскладку и ровно внутри
   колонки: оформление плашек не трогаем. */
.rc-flight .rcf-hud .rcf-top > *,
.rc-flight .rcf-hud .rcf-trow > * {
  position: relative !important;
  left: auto !important; right: auto !important;
  top: auto !important; bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
}
.rc-flight .rcf-hud .rcf-top .rcf-cap {
  /* Ширину берём всю, какая есть у полосы. При width: auto плашка
     ужималась по содержимому и последняя буква вместе с межбуквенным
     зазором вылезала за край. */
  max-width: 100% !important;
  width: 100% !important;
  white-space: normal !important;
  text-align: center;
  overflow: visible !important;
  text-overflow: clip;
  line-height: 1.35;
}
/* Появление титула вело transform с translateX, который в колонке уже
   не нужен и сдвигал плашку влево на пол-ширины. */
.rc-flight .rcf-hud .rcf-top .rcf-cap.in { animation: rcfCapCol .55s var(--ease) forwards, rcfHoloBreath 3.4s ease-in-out .55s infinite; }
@keyframes rcfCapCol {
  from { opacity: 0; transform: scaleY(.4); filter: brightness(2.2); }
  55%  { opacity: 1; transform: scaleY(1.04); }
  to   { opacity: 1; transform: scaleY(1); filter: brightness(1); }
}
/* Ряд под титулом: слева задание, справа список узлов. Не влезли по
   ширине - список уходит под задание, а не наезжает на него. */
.rc-flight .rcf-hud .rcf-trow {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 8px; width: 100%; flex-wrap: wrap;
}
/* Карточка задания занимает столько, сколько в ней есть.

   Здесь стояло flex: 1 1 180px, то есть «расти на всю строку». Список
   узлов справа пустой почти всю игру, и карточка растягивалась во всю
   ширину окна: на телефоне выходил широкий короб, в котором два слова
   и счётчик, а остальное - пустота поверх космоса. Заказчик назвал это
   «много лишних надписей на экране».

   Расти запрещаем, сжиматься разрешаем. Заголовок и счётчик садятся в
   одну строку: карточка становится строкой прибора, а не плитой. */
.rc-flight .rcf-hud .rcf-trow .rcf-mis {
  width: auto !important; flex: 0 1 auto;
  max-width: 100% !important; max-height: none !important;
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  column-gap: 10px;
}
.rc-flight .rcf-hud .rcf-trow .rcf-mis b { margin-bottom: 0; }
.rc-flight .rcf-hud .rcf-trow .rcf-mis em { margin-top: 0; justify-self: end; }
/* Пояснение и полоска идут во всю ширину карточки, под строкой. */
.rc-flight .rcf-hud .rcf-trow .rcf-mis span,
.rc-flight .rcf-hud .rcf-trow .rcf-mis i { grid-column: 1 / -1; }
/* Пустой счётчик не должен держать колонку: без него заголовок
   остаётся один и карточка сжимается до слова. */
.rc-flight .rcf-hud .rcf-trow .rcf-mis em:empty { display: none; }
.rc-flight .rcf-hud .rcf-trow .rcf-netlist {
  width: auto !important; flex: 0 1 auto; max-width: 46% !important;
}
/* Плашка аварии получила свою строку. Прежде она стояла абсолютно на
   top 44px, то есть ровно на карточке задания. */
.rc-flight .rcf-hud .rcf-top .rcf-fail { max-width: 100% !important; }
.rc-flight .rcf-hud .rcf-top .rcf-fail:empty { display: none; }

/* Курс без цели: расстояние прячем, иначе рядом стоят два прочерка.
   На узком экране убираем и саму ячейку: слово «КУРС», за которым
   ничего нет, это ровно та лишняя надпись, на которую жаловался
   заказчик. Появится цель - появится и ячейка. */
.rc-flight .rcf-d-course.is-empty .rcf-c-dist { display: none; }
.rc-flight .rcf-d-course.is-empty .rcf-c-goal { opacity: .62; }
@media (max-width: 760px) {
  .rc-flight .rcf-d-course.is-empty { display: none !important; }
}

/* Досье, справка и меню тоже живут на стекле и обрезаются им */
.rc-flight .rcf-dos,
.rc-flight .rcf-help {
  left: var(--cab-wx, 6%);
  top: var(--cab-hy, var(--cab-wy, 8%));
  right: auto;
  bottom: auto;
  width: var(--cab-ww, 88%);
  height: var(--cab-hh, var(--cab-wh, 68%));
  border-radius: clamp(10px, 2vw, 28px);
  overflow: hidden;
  /* Сброс базового сдвига на полразмера: без него окно, получив
     новые left/top, продолжало уезжать влево-вверх - владелец
     видел «окна кривые слева» при каждом скане планеты */
  transform: none !important;
}
.rc-flight .rcf-dos.on { transform: none !important; }
/* Центрирование сеткой переполняется в ОБЕ стороны: когда содержимое
   выше своей ячейки, верх уезжает за кадр и рамка обрезается. На
   лежачем 900x412 замер дал верхнюю кромку досье на одиннадцать точек
   ВЫШЕ экрана. Ключевое слово safe как раз про это - оно запрещает
   уезжать за начало и прижимает содержимое к верхней кромке, а
   дальше работает своя прокрутка. */
.rc-flight .rcf-dos {
  display: grid;
  justify-items: center;
  align-items: safe center;
}
.rc-flight .rcf-dos-in {
  width: min(92%, 520px);
  /* Не выше самого экрана: доля от родителя не спасает, если сам
     родитель выше кадра. */
  max-height: min(92%, calc(100vh - 16px));
  /* Динамическая высота обязательна. На телефоне 100vh это высота
     БЕЗ учёта панелей браузера: адресная строка сверху и полоса
     жестов снизу в неё не входят, и окно, посчитанное так,
     оказывается выше видимой области - хвост уходит под панель, а
     доскроллить до него внутри окна уже нельзя. Владелец увидел
     ровно это и назвал «липкая нижняя панель съедает хвост».
     В песочнице панелей нет, поэтому замером это не ловилось. */
  max-height: min(92%, calc(100dvh - 16px));
  overflow-y: auto;
}
.rc-flight .rcf-help-in {
  width: min(92%, 520px);
  max-height: min(92%, calc(100vh - 16px));
  /* Динамическая высота обязательна. На телефоне 100vh это высота
     БЕЗ учёта панелей браузера: адресная строка сверху и полоса
     жестов снизу в неё не входят, и окно, посчитанное так,
     оказывается выше видимой области - хвост уходит под панель, а
     доскроллить до него внутри окна уже нельзя. Владелец увидел
     ровно это и назвал «липкая нижняя панель съедает хвост».
     В песочнице панелей нет, поэтому замером это не ловилось. */
  max-height: min(92%, calc(100dvh - 16px));
  /* Растворяем ОБА края, а не только нижний.

     Снизу это признак продолжения: край, уходящий в прозрачность,
     сам говорит, что ниже есть ещё. Сверху растворения не было
     вовсе, и прокрученная панель рубила строку пополам ровной
     чертой - на кадрах видно обрубок «на все 360». Теперь верх
     тоже уходит в прозрачность, и обрубок читается продолжением, а
     не поломкой.

     Запас снизу и сверху под сами полосы растворения: без него
     последняя строка целиком лежит в полосе и не читается даже
     тогда, когда докрутили до конца. */
  padding-top: calc(clamp(18px, 3vh, 28px) + 20px);
  padding-bottom: calc(clamp(18px, 3vh, 28px) + 26px);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 20px, #000 calc(100% - 26px), transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 20px, #000 calc(100% - 26px), transparent 100%);
}
/* Пока открыта справка, метки объектов гаснут: читать поверх них
   нельзя, а спорить двум слоям на одном стекле незачем */
.rc-flight:has(.rcf-help.on) .rc-holo,
.rc-flight:has(.rcf-menu.on) .rc-holo,
.rc-flight:has(.rcf-dos.on) .rc-holo,
.rc-flight.rcf-modal .rc-holo { opacity: .12; transition: opacity .25s linear; }
/* И задание со списком сети тоже уступают: на одном стекле в один
   момент читается что-то одно */
.rc-flight:has(.rcf-help.on) .rcf-mis,
.rc-flight:has(.rcf-menu.on) .rcf-mis,
.rc-flight:has(.rcf-dos.on) .rcf-mis,
.rc-flight:has(.rcf-help.on) .rcf-netlist,
.rc-flight:has(.rcf-menu.on) .rcf-netlist,
.rc-flight:has(.rcf-dos.on) .rcf-netlist,
.rc-flight.rcf-modal .rcf-mis,
.rc-flight.rcf-modal .rcf-netlist { opacity: .16; transition: opacity .25s linear; }
.rc-flight .rcf-menu {
  left: 50%;
  top: auto;
  bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(86px, 11vh, 112px));
  transform: translateX(-50%);
  max-height: min(58vh, 520px);
}
.rc-flight .rcf-menu.on { transform: translateX(-50%); }

/* Виньетка снята. «Виньетка и затемнения по краям смотрится
   ужасно» - и правда: подложка съедала углы кадра и делала картинку
   грязной. Корпус на рисунке и так непрозрачен, а по самой кромке
   достаточно тонкой тени, чтобы кадр не обрывался в пустоту. */
.rc-flight::before {
  background:
    linear-gradient(90deg, rgba(4, 11, 20, .9) 0%, rgba(6, 15, 26, 0) 2.2%),
    linear-gradient(270deg, rgba(4, 11, 20, .9) 0%, rgba(6, 15, 26, 0) 2.2%),
    linear-gradient(0deg, rgba(4, 11, 20, .9) 0%, rgba(6, 15, 26, 0) 2.6%) !important;
}
/* В режиме сцены кромка чуть плотнее: там за корпусом стоят стены
   салона, и по самому краю они просвечивали светлой полосой */
.rc-flight.rcf-stage::before {
  background:
    linear-gradient(90deg, rgba(4, 11, 20, .96) 0%, rgba(6, 15, 26, 0) 4.5%),
    linear-gradient(270deg, rgba(4, 11, 20, .96) 0%, rgba(6, 15, 26, 0) 4.5%),
    linear-gradient(180deg, rgba(4, 11, 20, .9) 0%, rgba(6, 15, 26, 0) 3.5%),
    linear-gradient(0deg, rgba(4, 11, 20, .9) 0%, rgba(6, 15, 26, 0) 3%) !important;
}

@media (max-width: 760px) {
  .rc-flight::before {
    background:
      linear-gradient(90deg, rgba(4, 11, 20, .95) 0%, rgba(6, 15, 26, 0) 4%),
      linear-gradient(270deg, rgba(4, 11, 20, .95) 0%, rgba(6, 15, 26, 0) 4%),
      linear-gradient(0deg, rgba(4, 11, 20, .95) 0%, rgba(6, 15, 26, 0) 5%) !important;
  }
  .rc-flight .rcf-hud .rcf-mis { width: min(64%, 240px); top: 46px; }
  .rc-flight .rcf-hud .rcf-netlist { display: none; }
  .rc-flight .rcf-hud .rcf-cap { font-size: 10px; }
}

/* ═══════════════════════════════════════════════════════════
   Плита приборов, окончательная сборка

   Требования владельца дословно: панель НЕ прозрачная (корпус
   корабля не может просвечивать), высота не больше десятой доли
   экрана, кнопки ровные, всё по местам. Ниже перекрываются все
   прежние правила плиты - это последнее слово по ней.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-deck {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  width: auto;
  max-width: min(97vw, 1180px);
  height: auto;
  min-height: 0;
  top: auto;
  bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(8px, 1.6vh, 18px));
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.2vw, 18px);
  padding: clamp(7px, 1vh, 10px) clamp(10px, 1.4vw, 18px);
  border-radius: 14px;
  /* Металл, не стекло: плотная непрозрачная плита с холодной
     кромкой сверху - интерфейс вшит в корпус, космос сквозь него
     не просвечивает */
  background:
    linear-gradient(180deg, #17293c 0%, #0d1b2b 42%, #081221 100%);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .30);
  border-top-color: rgba(var(--int-cyan-rgb, 66,178,220), .55);
  box-shadow:
    inset 0 1px 0 rgba(207,233,245,.14),
    0 14px 34px -12px rgba(0,0,0,.95),
    0 0 34px -14px rgba(var(--int-cyan-rgb, 66,178,220), .5);
}
.rc-flight .rcf-deck::before { display: none; }
.rc-flight .rcf-left,
.rc-flight .rcf-right { display: flex; align-items: center; gap: clamp(7px, 1vw, 12px); }
.rc-flight .rcf-radar {
  width: clamp(44px, 5.6vh, 58px);
  height: clamp(44px, 5.6vh, 58px);
}
.rc-flight .rcf-left .rcf-gauges { display: flex; flex-direction: column; gap: 2px; }
.rc-flight .rcf-deck .rcf-prog,
.rc-flight .rcf-deck .rcf-net { display: block; position: static; font-size: 9px; letter-spacing: .12em; }

/* Клавиши: один ряд, одна высота, одна ширина иконки */
.rc-flight .rcf-keys { flex: 0 1 auto; }
.rc-flight .rcf-keys button {
  height: clamp(36px, 4.6vh, 44px);
  padding: 0 clamp(9px, 1.1vw, 15px);
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Тяга: горизонтальный ползунок в один рост с клавишами */
.rc-flight .rcf-thr {
  width: clamp(84px, 9vw, 128px);
  height: clamp(36px, 4.6vh, 44px);
  border-radius: 10px;
  cursor: ew-resize;
}
.rc-flight .rcf-thr-fill {
  left: 0; top: 0; bottom: 0;
  right: auto;
  height: 100%;
  width: 0%;
  border-radius: 9px 0 0 9px;
  background: linear-gradient(90deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .5),
    rgba(var(--int-cyan-rgb, 66,178,220), .95));
  transition: width .08s linear;
}
.rc-flight .rcf-thr b {
  position: absolute; left: 50%; top: 50%; bottom: auto;
  transform: translate(-50%, -50%);
  font-size: 9px;
  letter-spacing: .22em;
  color: rgba(226,240,252,.85);
  text-shadow: 0 1px 2px rgba(0,0,0,.8);
  pointer-events: none;
}
.rc-flight .rcf-deck .rcf-speed {
  position: static;
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 7ch;
  justify-content: flex-end;
}
.rc-flight .rcf-deck .rcf-speed b { font-size: clamp(15px, 2.2vh, 19px); }

/* Пуск узла над плитой, по центру, не перекрывая клавиш */
.rc-flight .rcf-deck .rcf-deploy {
  bottom: calc(100% + 8px);
}

@media (max-width: 760px) {
  .rc-flight .rcf-deck {
    max-width: 97vw;
    gap: 6px;
    padding: 6px 8px;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 6px);
  }
  .rc-flight .rcf-radar { display: none; }
  .rc-flight .rcf-left .rcf-gauges { display: none; }
  .rc-flight .rcf-keys button { height: 38px; padding: 0 9px; }
  .rc-flight .rcf-thr { width: 66px; height: 38px; }
  .rc-flight .rcf-deck .rcf-speed { min-width: 0; }
  .rc-flight .rcf-deck .rcf-speed span { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   Борт: панель управления как часть корпуса

   Последняя редакция панели, перекрывает все прежние правила.
   Непрозрачный металл во всю ширину экрана, прижат к низу без
   скруглений по бокам - это борт корабля, а не карточка. Внутри
   два ряда: табло и органы управления.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-deck {
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  transform: none;
  width: 100%;
  max-width: none;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 0 env(safe-area-inset-bottom, 0px);
  border-radius: 0;
  border: 0;
  border-top: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  background:
    linear-gradient(180deg, #182a3e 0%, #101f30 26%, #0a1626 62%, #060f1c 100%);
  box-shadow:
    inset 0 1px 0 rgba(207,233,245,.16),
    inset 0 14px 24px -18px rgba(var(--int-cyan-rgb, 66,178,220), .35),
    0 -16px 40px -18px rgba(0,0,0,.9);
}
/* Верхний ряд: табло. Тонкая тёмная лента с ячейками-дисплеями */
.rc-flight .rcf-d-top {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: clamp(10px, 2.2vw, 34px);
  padding: 5px clamp(10px, 2vw, 26px) 4px;
  background: rgba(3, 9, 17, .55);
  border-bottom: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .16);
  font-family: var(--f-body, "Golos Text", sans-serif);
  min-height: 24px;
}
.rc-flight .rcf-d-cell {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  white-space: nowrap;
}
.rc-flight .rcf-d-cell i {
  font-style: normal;
  /* Девять точек - нижняя граница читаемого. Восемь с половиной на
     планшете и телефоне превращали подпись прибора в узор. */
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-d-cell .rcf-net,
.rc-flight .rcf-d-cell .rcf-prog {
  position: static;
  display: inline;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  color: rgba(var(--int-lit-rgb, 207,233,245), .95);
  text-shadow: none;
}
.rc-flight .rcf-d-course .rcf-c-goal {
  font-size: 11px; font-weight: 700; letter-spacing: .08em;
  color: var(--int-cyan, #42B2DC);
}
.rc-flight .rcf-d-course .rcf-c-dist {
  text-decoration: none;
  font-size: 10.5px;
  color: rgba(var(--int-lit-rgb, 207,233,245), .8);
}
.rc-flight .rcf-d-course .rcf-c-mode {
  font-style: normal;
  font-size: 9px; font-weight: 700; letter-spacing: .16em;
  color: rgba(var(--int-vio-rgb, 138,89,246), .95);
}
/* Ячейки заряда и корпуса: короткая шкала-термометр и число */
.rc-flight .rcf-bars { gap: 14px; }
.rc-flight .rcf-d-meter {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.rc-flight .rcf-d-meter b {
  font-size: 9px; font-weight: 700; letter-spacing: .12em;
  color: rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-d-meter s {
  text-decoration: none;
  width: 44px; height: 5px;
  border-radius: 3px;
  background: rgba(207,233,245,.14);
  overflow: hidden;
  display: inline-block;
}
.rc-flight .rcf-d-meter s i {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--int-cyan, #42B2DC), #7fd8fa);
  border-radius: 3px;
}
.rc-flight .rcf-bar-en s i { width: var(--en, 100%); }
.rc-flight .rcf-bar-hull s i { width: var(--hull, 100%); background: linear-gradient(90deg, #35E08F, #a0ffd2); }
.rc-flight .rcf-bars.low .rcf-bar-en s i { background: linear-gradient(90deg, #ff8a4c, #ffd08a); }
.rc-flight .rcf-bars.hurt .rcf-bar-hull s i { background: linear-gradient(90deg, #ff5a5a, #ffb0b0); }
.rc-flight .rcf-d-meter u {
  text-decoration: none;
  font-size: 10px; font-weight: 700;
  color: rgba(var(--int-lit-rgb, 207,233,245), .9);
  min-width: 3ch;
}

/* Нижний ряд: органы управления */
.rc-flight .rcf-d-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.4vw, 18px);
  padding: clamp(7px, 1vh, 10px) clamp(10px, 2vw, 26px);
}
.rc-flight .rcf-d-main .rcf-radar {
  width: clamp(40px, 5.2vh, 52px);
  height: clamp(40px, 5.2vh, 52px);
  flex: none;
}
/* Клавиши: физические, с фаской и тенью нажатия */
.rc-flight .rcf-keys { overflow: visible; }
.rc-flight .rcf-keys button {
  height: clamp(36px, 4.4vh, 42px);
  padding: 0 clamp(9px, 1.1vw, 14px);
  border-radius: 9px;
  border: 1px solid rgba(6, 13, 22, .9);
  background: linear-gradient(180deg, #22384e 0%, #15263a 48%, #0d1b2c 100%);
  box-shadow:
    inset 0 1px 0 rgba(207,233,245,.2),
    inset 0 -2px 0 rgba(0,0,0,.55),
    0 2px 5px rgba(0,0,0,.6);
  color: rgba(var(--int-lit-rgb, 207,233,245), .92);
}
.rc-flight .rcf-keys button:active {
  transform: translateY(1px);
  box-shadow:
    inset 0 1px 0 rgba(207,233,245,.1),
    inset 0 2px 6px rgba(0,0,0,.6);
}
.rc-flight .rcf-keys button:hover,
.rc-flight .rcf-keys button.cur,
.rc-flight .rcf-keys button[aria-pressed="true"] {
  color: #fff;
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .8);
  box-shadow:
    inset 0 1px 0 rgba(207,233,245,.24),
    inset 0 -2px 0 rgba(0,0,0,.55),
    0 0 16px -4px rgba(var(--int-cyan-rgb, 66,178,220), .9);
}
.rc-flight .rcf-shot {
  width: auto;
  height: clamp(36px, 4.4vh, 42px);
  padding: 0 10px;
  border-radius: 9px;
  border: 1px solid rgba(6, 13, 22, .9);
  background: linear-gradient(180deg, #22384e 0%, #15263a 48%, #0d1b2c 100%);
  box-shadow: inset 0 1px 0 rgba(207,233,245,.2), inset 0 -2px 0 rgba(0,0,0,.55), 0 2px 5px rgba(0,0,0,.6);
}
/* Тяга и скорость в том же ряду */
.rc-flight .rcf-d-main .rcf-thr {
  width: clamp(84px, 9vw, 128px);
  height: clamp(36px, 4.4vh, 42px);
  border-radius: 9px;
  border: 1px solid rgba(6, 13, 22, .9);
  background: linear-gradient(180deg, #0a1523, #071019);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.7);
  cursor: ew-resize;
  flex: none;
}
.rc-flight .rcf-d-main .rcf-speed {
  position: static;
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 7ch;
  justify-content: flex-end;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-d-main .rcf-speed b { font-size: clamp(15px, 2.1vh, 19px); }
.rc-flight .rcf-d-main .rcf-deploy {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 34px);
  transform: translateX(-50%);
}

@media (max-width: 760px) {
  .rc-flight .rcf-d-top { gap: 10px; padding: 4px 8px 3px; }
  .rc-flight .rcf-d-seen { display: none; }
  .rc-flight .rcf-d-meter u { display: none; }
  .rc-flight .rcf-d-meter s { width: 30px; }
  .rc-flight .rcf-d-course .rcf-c-mode { display: none; }
  .rc-flight .rcf-d-main { gap: 6px; padding: 6px 8px; }
  .rc-flight .rcf-d-main .rcf-radar { display: none; }
  .rc-flight .rcf-keys button { height: 38px; padding: 0 9px; }
  .rc-flight .rcf-d-main .rcf-thr { width: 64px; height: 38px; }
  .rc-flight .rcf-d-main .rcf-speed { min-width: 0; }
  .rc-flight .rcf-d-main .rcf-speed span { display: none; }
}

/* Ячейка заряда и корпуса наследовала старое правило .rcf-bars с
   position:absolute на весь кадр - возвращаем её в строй табло */
.rc-flight .rcf-d-top .rcf-bars {
  position: static;
  inset: auto;
  width: auto;
  height: auto;
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
}

/* Скрытое меню не имеет права ловить клики. Вложенному списку
   рукавов выше возвращали visibility:visible, а visibility у
   ребёнка ПЕРЕБИВАЕТ hidden родителя: невидимое меню съедало
   нажатия по центру окна - сканер планет не срабатывал. */
.rc-flight .rcf-menu:not(.on),
.rc-flight .rcf-menu:not(.on) * {
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Ширина досье: жёстко, поверх всех прежних объявлений - карта в
   тысячу пикселей на весь кадр читалась не прибором, а плакатом */
.rc-flight .rcf-dos-in {
  width: min(560px, 92%) !important;
  max-height: min(94%, calc(100vh - 16px)) !important;
  max-height: min(94%, calc(100dvh - 16px)) !important;
}

/* Карта в досье не выше трети окна: иначе описание и показатели
   уезжали за нижнюю кромку рамки */
.rc-flight .rcf-dos-map {
  max-height: clamp(132px, 34vh, 300px);
  object-fit: cover;
}

/* ── Кнопки прозрачны: их железо рисует скин панели ──────────
   Корпус каждой клавиши, паз тяги и обод радара нарисованы в
   самой текстуре панели (deckSkin) - DOM здесь только зона нажатия
   с чёткой иконкой и подсветка состояния. */
.rc-flight .rcf-keys button,
.rc-flight .rcf-shot,
.rc-flight .rcf-d-main .rcf-thr {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.rc-flight .rcf-keys button:hover,
.rc-flight .rcf-keys button.cur,
.rc-flight .rcf-keys button[aria-pressed="true"] {
  color: #fff;
  border-color: transparent !important;
  box-shadow: 0 0 18px -4px rgba(var(--int-cyan-rgb, 66,178,220), .9) !important;
  text-shadow: 0 0 8px rgba(var(--int-cyan-rgb, 66,178,220), .8);
}
.rc-flight .rcf-keys button:active { transform: translateY(1px); }
.rc-flight .rcf-d-top {
  background: transparent;
  border-bottom: 0;
}
.rc-flight .rcf-deck { border-top: 0; background-color: #0a1626; }

/* ═══════════════════════════════════════════════════════════
   ПУЛЬТ КОРАБЛЯ — окончательная сборка

   Панель встроена в нишу консоли на рисунке кабины и наклонена
   перспективой: клавиши лежат НА плоскости пульта, уходящей от
   зрителя, а не полосой поверх кадра. Всё железо (гнёзда клавиш,
   паз тяги, обод радара, стекло табло) рисует deckSkin в текстуру
   самой панели — DOM даёт только зоны нажатия и иконки.
   Этот блок перекрывает все прежние правила панели.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-deck {
  position: absolute;
  left: var(--cab-dx, 4%);
  top: var(--cab-dy, 78%);
  width: var(--cab-dw, 92%);
  height: var(--cab-dh, 21%);
  right: auto;
  bottom: auto;
  transform: none;
  max-width: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  /* Глубина сцены: чем меньше число, тем сильнее сходятся линии */
  perspective: 900px;
  perspective-origin: 50% 100%;
  overflow: visible;
  z-index: 6;
}
.rc-flight .rcf-deck::before { display: none; }

/* Плоскость пульта: наклонена от зрителя, низ на месте */
.rc-flight .rcf-d-face {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 132%;
  transform-origin: 50% 100%;
  transform: rotateX(31deg);
  display: flex;
  flex-direction: column;
  border-radius: 16px 16px 8px 8px;
  /* Подложка ставится скриптом (deckSkin) как текстура железа;
     этот цвет — основа на случай, если скин ещё не построен */
  background-color: #0c1a2b;
  background-size: 100% 100%;
  box-shadow:
    0 -22px 46px -20px rgba(0, 0, 0, .95),
    0 0 60px -26px rgba(var(--int-cyan-rgb, 66, 178, 220), .55);
}

/* Верхняя лента табло */
.rc-flight .rcf-d-top {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(10px, 2.4vw, 36px);
  padding: clamp(4px, .8vh, 8px) clamp(12px, 2.4vw, 34px);
  background: transparent;
  border: 0;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-d-top .rcf-d-cell {
  position: static;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
  width: auto;
  height: auto;
  inset: auto;
  pointer-events: auto;
}
.rc-flight .rcf-d-cell i {
  font-style: normal;
  /* Девять точек - нижняя граница читаемого. Восемь с половиной на
     планшете и телефоне превращали подпись прибора в узор. */
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
  color: rgba(var(--int-cyan-rgb, 66, 178, 220), .85);
}
.rc-flight .rcf-d-cell .rcf-net,
.rc-flight .rcf-d-cell .rcf-prog {
  position: static;
  display: inline;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  color: rgba(var(--int-lit-rgb, 207, 233, 245), .96);
  text-shadow: 0 0 8px rgba(var(--int-cyan-rgb, 66, 178, 220), .45);
}
.rc-flight .rcf-d-course .rcf-c-goal {
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  color: var(--int-cyan, #42B2DC);
}
.rc-flight .rcf-d-course .rcf-c-dist {
  text-decoration: none; font-size: 10.5px;
  color: rgba(var(--int-lit-rgb, 207, 233, 245), .82);
}
.rc-flight .rcf-d-course .rcf-c-mode {
  font-style: normal; font-size: 9px; font-weight: 700; letter-spacing: .15em;
  color: rgba(var(--int-vio-rgb, 138, 89, 246), .95);
}
.rc-flight .rcf-d-top .rcf-bars {
  position: static; inset: auto; width: auto; height: auto;
  display: inline-flex; align-items: center; gap: 14px; pointer-events: auto;
}
.rc-flight .rcf-d-meter { display: inline-flex; align-items: center; gap: 5px; }
.rc-flight .rcf-d-meter b {
  font-size: 9px; font-weight: 700; letter-spacing: .12em;
  color: rgba(var(--int-cyan-rgb, 66, 178, 220), .85);
}
.rc-flight .rcf-d-meter s {
  text-decoration: none; display: inline-block;
  width: 46px; height: 5px; border-radius: 3px;
  background: rgba(3, 9, 17, .9);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .8);
  overflow: hidden;
}
.rc-flight .rcf-d-meter s i {
  display: block; height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, var(--int-cyan, #42B2DC), #8fe4ff);
  box-shadow: 0 0 8px rgba(var(--int-cyan-rgb, 66, 178, 220), .8);
}
.rc-flight .rcf-bar-en s i { width: var(--en, 100%); }
.rc-flight .rcf-bar-hull s i {
  width: var(--hull, 100%);
  background: linear-gradient(90deg, #35E08F, #a6ffd6);
  box-shadow: 0 0 8px rgba(53, 224, 143, .7);
}
.rc-flight .rcf-bars.low .rcf-bar-en s i { background: linear-gradient(90deg, #ff8a4c, #ffd08a); }
.rc-flight .rcf-bars.hurt .rcf-bar-hull s i { background: linear-gradient(90deg, #ff5a5a, #ffb0b0); }
.rc-flight .rcf-d-meter u {
  text-decoration: none; min-width: 3ch;
  font-size: 10px; font-weight: 700;
  color: rgba(var(--int-lit-rgb, 207, 233, 245), .92);
}

/* Рабочая плоскость: три отсека */
.rc-flight .rcf-d-main {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(8px, 1.6vw, 26px);
  padding: 0 clamp(12px, 2.4vw, 34px) clamp(6px, 1.2vh, 12px);
  min-height: 0;
}
.rc-flight .rcf-d-bay {
  display: flex;
  align-items: center;
  gap: clamp(6px, .9vw, 12px);
}
.rc-flight .rcf-d-work { flex: 1 1 auto; justify-content: center; }
.rc-flight .rcf-d-col { display: flex; flex-direction: column; gap: 5px; }
.rc-flight .rcf-d-row { display: flex; gap: 5px; }
.rc-flight .rcf-d-main .rcf-radar {
  width: clamp(46px, 6.4vh, 66px);
  height: clamp(46px, 6.4vh, 66px);
  flex: none;
  display: block;
}

/* Клавиша: гнездо рисует скин, здесь — зона, иконка и подпись */
.rc-flight .rcf-key {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  height: clamp(38px, 5vh, 50px);
  min-width: clamp(46px, 5.4vw, 66px);
  padding: 0 clamp(6px, .8vw, 11px);
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: rgba(var(--int-lit-rgb, 207, 233, 245), .9);
  font: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color .16s ease, transform .08s ease, filter .16s ease;
}
.rc-flight .rcf-key svg {
  width: clamp(15px, 2.1vh, 19px);
  height: clamp(15px, 2.1vh, 19px);
  flex: none;
}
.rc-flight .rcf-key b {
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1;
  white-space: nowrap;
}
.rc-flight .rcf-key:hover { color: #fff; }
.rc-flight .rcf-key:active { transform: translateY(1.5px); }
.rc-flight .rcf-key.cur,
.rc-flight .rcf-key[aria-pressed="true"],
.rc-flight .rcf-key[aria-expanded="true"] {
  color: #fff;
  filter: drop-shadow(0 0 7px rgba(var(--int-cyan-rgb, 66, 178, 220), .95));
}
.rc-flight .rcf-key.rcf-mini {
  min-width: 0;
  width: clamp(28px, 3.2vh, 34px);
  height: clamp(28px, 3.2vh, 34px);
  padding: 0;
  border-radius: 7px;
}
.rc-flight .rcf-key.rcf-mini svg { width: 14px; height: 14px; }
.rc-flight .rcf-fire-key { color: rgba(255, 176, 120, .95); }
.rc-flight .rcf-fire-key:hover { color: #ffd0a8; }

/* Узел доступен только на орбите - гаснет, но остаётся на панели:
   пустое гнездо на настоящем пульте тоже никуда не девается.

   Нажатие при этом ПРИНИМАЕМ. Раньше здесь стояло pointer-events:
   none, и клавиша не отвечала вовсе: приёмка записала УЗЕЛ в мёртвые,
   а `document.elementFromPoint` в её же центре возвращал не кнопку, а
   контейнер плиты. Настоящий пульт так себя не ведёт - недоступная
   клавиша нажимается и говорит, почему нельзя. Ответ даёт
   deployNode: «УЗЕЛ СТАВИТСЯ ТОЛЬКО НА ОРБИТЕ · ПОДОЙДИТЕ К ТЕЛУ». */
.rc-flight .rcf-deploy {
  position: static;
  transform: none;
  opacity: .35;
  pointer-events: auto;
  cursor: pointer;
}
.rc-flight .rcf-deploy.on { opacity: 1; pointer-events: auto; }

/* Рычаг тяги: горизонтальный, в пазу */
.rc-flight .rcf-d-main .rcf-thr {
  position: relative;
  width: clamp(92px, 10vw, 140px);
  height: clamp(38px, 5vh, 50px);
  border: 0;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  cursor: ew-resize;
  flex: none;
  overflow: hidden;
}
.rc-flight .rcf-thr-fill {
  position: absolute;
  left: 3px; top: 3px; bottom: 3px; right: auto;
  width: 0%;
  height: auto;
  border-radius: 6px;
  background: linear-gradient(90deg,
    rgba(var(--int-cyan-rgb, 66, 178, 220), .45),
    rgba(var(--int-cyan-rgb, 66, 178, 220), .95));
  box-shadow: 0 0 14px rgba(var(--int-cyan-rgb, 66, 178, 220), .7);
  transition: width .08s linear;
}
.rc-flight .rcf-thr b {
  position: absolute; left: 50%; top: 50%; bottom: auto;
  transform: translate(-50%, -50%);
  font-family: var(--f-body, "Golos Text", sans-serif);
  font-size: 9px; font-weight: 700; letter-spacing: .16em;
  color: rgba(226, 240, 252, .92);
  text-shadow: 0 1px 3px rgba(0, 0, 0, .9);
  pointer-events: none;
}
.rc-flight .rcf-d-main .rcf-speed {
  position: static;
  display: flex; align-items: baseline; gap: 3px;
  justify-content: flex-end;
  min-width: 6.5ch;
  font-family: var(--f-body, "Golos Text", sans-serif);
}
.rc-flight .rcf-d-main .rcf-speed b {
  font-size: clamp(14px, 2vh, 18px);
  color: rgba(var(--int-lit-rgb, 207, 233, 245), .98);
  text-shadow: 0 0 10px rgba(var(--int-cyan-rgb, 66, 178, 220), .5);
}
.rc-flight .rcf-d-main .rcf-speed span {
  font-size: 9px; letter-spacing: .1em;
  color: rgba(var(--int-cyan-rgb, 66, 178, 220), .8);
}

/* Меню курса поднимается над пультом */
.rc-flight .rcf-menu {
  bottom: calc(var(--cab-dh, 21%) + 10px);
}

@media (max-width: 760px) {
  .rc-flight .rcf-d-face { transform: rotateX(26deg); height: 126%; }
  .rc-flight .rcf-d-top { gap: 10px; padding: 3px 8px; }
  .rc-flight .rcf-d-seen { display: none; }
  .rc-flight .rcf-d-meter u { display: none; }
  .rc-flight .rcf-d-meter s { width: 28px; }
  .rc-flight .rcf-d-course .rcf-c-mode { display: none; }
  .rc-flight .rcf-d-main { gap: 6px; padding: 0 7px 5px; }
  .rc-flight .rcf-d-main .rcf-radar { display: none; }
  .rc-flight .rcf-d-nav .rcf-map-key { display: none; }
  .rc-flight .rcf-key { height: 40px; min-width: 40px; padding: 0 5px; gap: 1px; }
  /* Подпись на клавише либо читается, либо её нет вовсе. Семь
     точек - это ни то ни другое. Ниже по файлу есть правило,
     которое на совсем узких экранах прячет подпись начисто и
     оставляет иконку. */
  .rc-flight .rcf-key b { font-size: 9px; letter-spacing: .06em; }
  .rc-flight .rcf-key.rcf-mini { width: 26px; height: 26px; }
  .rc-flight .rcf-d-main .rcf-thr { width: 62px; height: 40px; }
  .rc-flight .rcf-d-main .rcf-speed { min-width: 0; }
  .rc-flight .rcf-d-main .rcf-speed span { display: none; }
  .rc-flight .rcf-zoom-in, .rc-flight .rcf-zoom-out { display: none; }
}

/* ── Пульт: железо только под блоками ────────────────────────
   Панель не должна закрывать нарисованную консоль корабля - она
   должна В НЕЁ ВСТРАИВАТЬСЯ. Поэтому плоскость прозрачна, а скин
   рисует только ниши отсеков, гнёзда клавиш, паз тяги и стекло
   табло. Между блоками видна сама консоль кабины с её экранами. */
.rc-flight .rcf-d-face {
  background-color: transparent;
  box-shadow: none;
  /* Наклон заметнее: плоскость реально уходит от зрителя */
  transform: rotateX(38deg);
  height: 138%;
}
.rc-flight .rcf-deck { perspective: 620px; }

/* Отсеки прижаты к краям и центру, ширина по содержимому */
.rc-flight .rcf-d-work { flex: 0 0 auto; }
.rc-flight .rcf-d-main { justify-content: space-between; align-items: flex-end; padding-bottom: clamp(10px, 2vh, 20px); }
.rc-flight .rcf-d-nav, .rc-flight .rcf-d-drive { flex: 0 0 auto; align-items: flex-end; }

/* Узел - клавиша пульта, а не всплывающая кнопка */
.rc-flight .rcf-key.rcf-deploy {
  position: static;
  left: auto; bottom: auto;
  transform: none;
  padding: 0 clamp(6px, .8vw, 11px);
  font-family: inherit;
  font-size: inherit;
  letter-spacing: normal;
  text-transform: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  opacity: .34;
  /* Нажатие принимаем и вне орбиты. Здесь стояло pointer-events: none,
     и оно перебивало правило выше по файлу тремя классами против двух:
     клавиша УЗЕЛ была мертва на всех экранах, палец попадал сквозь неё
     в плиту. Комментарий над тем правилом объявлял это починенным - на
     деле чинил его собственную половину, а эту нет. Недоступная
     клавиша обязана нажиматься и говорить, почему нельзя: ответ даёт
     deployNode, «УЗЕЛ СТАВИТСЯ ТОЛЬКО НА ОРБИТЕ». */
  pointer-events: auto;
  cursor: pointer;
}
.rc-flight .rcf-key.rcf-deploy.on {
  opacity: 1;
  pointer-events: auto;
  transform: none;
  box-shadow: none;
}
.rc-flight .rcf-key.rcf-deploy.on::after { display: none; }

/* Скорость над зумом, не поперёк него */
.rc-flight .rcf-d-drive .rcf-d-col { align-items: flex-end; gap: 4px; }
.rc-flight .rcf-d-main .rcf-speed { justify-content: flex-end; }

/* ── Посадка блоков на консоль ───────────────────────────────
   Вставки садятся на плоские участки нарисованной консоли, не
   упираясь в нижнюю кромку кадра, а рабочий блок стоит ровно по
   центру - там, где у корабля главный пульт. */
.rc-flight .rcf-d-main {
  position: relative;
  align-items: center;
  padding: clamp(8px, 1.6vh, 16px) clamp(18px, 3vw, 46px) clamp(22px, 4.4vh, 46px);
}
.rc-flight .rcf-d-work {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.rc-flight .rcf-d-nav, .rc-flight .rcf-d-drive { align-items: center; }

/* Табло читается как стекло приборной ленты */
.rc-flight .rcf-d-top {
  padding: clamp(5px, 1vh, 9px) clamp(14px, 2.6vw, 38px);
  margin: 0 clamp(10px, 2vw, 26px);
}
.rc-flight .rcf-d-cell i { color: rgba(var(--int-cyan-rgb, 66,178,220), .92); }
.rc-flight .rcf-d-cell .rcf-net,
.rc-flight .rcf-d-cell .rcf-prog,
.rc-flight .rcf-d-course .rcf-c-goal { font-size: 11.5px; }

/* Скорость - крупное табло хода над клавишами зума */
.rc-flight .rcf-d-main .rcf-speed b {
  font-size: clamp(16px, 2.4vh, 21px);
  letter-spacing: .02em;
}

/* Узел - обычная клавиша пульта: старое правило прятало её до
   выхода на орбиту (display:none), и в ряду зияла дыра. Гнездо
   на настоящем пульте не исчезает - оно гаснет. */
.rc-flight .rcf-key.rcf-deploy,
.rc-flight .rcf-deck .rcf-key.rcf-deploy {
  display: inline-flex !important;
  position: static !important;
  left: auto; bottom: auto;
  transform: none !important;
  margin: 0;
  padding: 0 clamp(6px, .8vw, 11px);
  white-space: nowrap;
  font-size: inherit;
}

/* ── Раскладка пульта: сетка без трансформаций ───────────────
   Центральный блок центрировался через translate(-50%), а скин
   железа меряет геометрию ДО трансформаций - гнёзда уезжали от
   клавиш. Три колонки сетки дают тот же центр, но честными
   координатами, и рисунок ложится точно под кнопки. */
.rc-flight .rcf-d-main {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  justify-items: center;
  gap: clamp(10px, 2vw, 30px);
  padding: clamp(6px, 1.2vh, 12px) clamp(20px, 3.4vw, 54px) clamp(30px, 6vh, 62px);
}
.rc-flight .rcf-d-work {
  position: static;
  left: auto; top: auto;
  transform: none;
  grid-column: 2;
}
.rc-flight .rcf-d-nav { grid-column: 1; justify-self: start; }
.rc-flight .rcf-d-drive { grid-column: 3; justify-self: end; }

/* Плоскость выше и наклон мягче: подписи клавиш обязаны читаться */
.rc-flight .rcf-d-face { transform: rotateX(32deg); height: 152%; }
.rc-flight .rcf-deck { perspective: 700px; }

/* ── Пульт на телефоне ───────────────────────────────────────
   Узкий кадр не держит три полноценных отсека: табло сжимаем до
   главного, правый отсек оставляем рычагу тяги, скорость уходит
   в ленту к остальным цифрам. Ничего не обрезается. */
@media (max-width: 760px) {
  .rc-flight .rcf-d-main {
    grid-template-columns: auto 1fr auto;
    gap: 6px;
    padding: 4px 6px clamp(16px, 3.4vh, 30px);
  }
  .rc-flight .rcf-d-top {
    gap: 8px;
    padding: 3px 6px;
    margin: 0 4px;
    flex-wrap: nowrap;
    overflow: hidden;
    /* Лента высотой 14 точек, а содержимое собиралось в 19 и семь
       точек уходило под срез: на 360 из строки состояния оставались
       два голых числа с отрезанными макушками. Межстрочный шаг
       здесь не нужен - строка одна. */
    line-height: 1;
  }
  .rc-flight .rcf-d-top .rcf-d-cell,
  .rc-flight .rcf-d-top .rcf-d-cell i,
  .rc-flight .rcf-d-top .rcf-d-cell b,
  .rc-flight .rcf-d-top .rcf-d-meter b,
  .rc-flight .rcf-d-top .rcf-d-meter u { line-height: 1; }
  .rc-flight .rcf-d-top .rcf-d-cell { flex: 0 1 auto; min-width: 0; }
  /* Скорость не сжимаем: на 360 ей доставалось шесть точек из
     нужных тридцати четырёх, и «км/с» съедалось целиком - в ленте
     оставался один знак «0» без единиц. Ужимаются соседи, у них
     подписи длиннее и терпимее. */
  .rc-flight .rcf-d-top .rcf-d-spd { flex: 0 0 auto; }
  .rc-flight .rcf-d-cell i { font-size: 9px; letter-spacing: .06em; }
  .rc-flight .rcf-d-cell .rcf-net,
  .rc-flight .rcf-d-cell .rcf-prog,
  .rc-flight .rcf-d-course .rcf-c-goal { font-size: 10px; }
  .rc-flight .rcf-d-meter b { font-size: 9px; letter-spacing: .04em; }
  .rc-flight .rcf-d-meter s { width: 22px; height: 4px; }
  .rc-flight .rcf-d-top .rcf-bars { gap: 8px; }

  .rc-flight .rcf-d-work { gap: 4px; }
  .rc-flight .rcf-key { height: 38px; min-width: 38px; padding: 0 4px; }
  .rc-flight .rcf-key svg { width: 15px; height: 15px; }
  .rc-flight .rcf-key b { font-size: 9px; letter-spacing: .04em; }
  .rc-flight .rcf-d-main .rcf-thr { width: 54px; height: 38px; }
  .rc-flight .rcf-thr b { font-size: 9px; letter-spacing: .06em; }
  /* Скорость и справка живут в ленте, не в отсеке хода */
  .rc-flight .rcf-d-drive .rcf-d-col { display: none; }
  .rc-flight .rcf-d-face { transform: rotateX(24deg); height: 142%; }
}
/* Совсем узкие экраны: подпись клавиш прячем, остаются иконки */
@media (max-width: 400px) {
  .rc-flight .rcf-key b { display: none; }
  .rc-flight .rcf-key { min-width: 34px; height: 36px; }
}
/* Снимок в ленте: только там, где ему не досталось гнезда на плите.
   На широких раскладках кнопка скрыта, снимок лежит в своём гнезде. */
.rc-flight .rcf-d-shot { display: none; }
@media (max-width: 760px) {
  .rc-flight .rcf-d-shot {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 22px; height: 22px;
    margin-left: auto;
    padding: 0;
    border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .38);
    border-radius: 5px;
    background: rgba(4, 12, 20, .5);
    color: rgba(var(--int-lit-rgb, 207,233,245), .92);
    cursor: pointer;
    pointer-events: auto;
  }
  .rc-flight .rcf-d-shot svg { width: 13px; height: 13px; }
  .rc-flight .rcf-d-shot:active { background: rgba(var(--int-cyan-rgb, 66,178,220), .22); }
}

/* Дубль скорости в ленте только на узком экране */
.rc-flight .rcf-d-spd { display: none; }
@media (max-width: 760px) {
  .rc-flight .rcf-d-spd { display: inline-flex; }
  .rc-flight .rcf-d-spd .rcf-speed { position: static; display: inline-flex; align-items: baseline; gap: 2px; }
  .rc-flight .rcf-d-spd .rcf-speed b { font-size: 11px; font-weight: 700; color: rgba(var(--int-lit-rgb,207,233,245),.96); }
  .rc-flight .rcf-d-spd .rcf-speed span { font-size: 9px; color: rgba(var(--int-cyan-rgb,66,178,220),.8); }
}

/* Справка и снимок остаются и на телефоне: без справки человек не
   узнает управление, а снимок - то, ради чего в игру возвращаются.
   Ставим их столбиком рядом с рычагом тяги. */
@media (max-width: 760px) {
  .rc-flight .rcf-d-drive .rcf-d-col { display: flex; }
  .rc-flight .rcf-d-drive .rcf-d-col .rcf-speed { display: none; }
  .rc-flight .rcf-d-drive .rcf-d-row { flex-direction: column; gap: 3px; }
  .rc-flight .rcf-key.rcf-mini { width: 24px; height: 17px; border-radius: 5px; }
  .rc-flight .rcf-key.rcf-mini svg { width: 12px; height: 12px; }
}

/* Подсказка управления не залезает на карточку задания */
.rc-flight .rcf-hint {
  bottom: calc(var(--cab-dh, 21%) + clamp(70px, 12vh, 116px));
}
@media (max-width: 760px) {
  .rc-flight .rcf-hint { bottom: calc(var(--cab-dh, 21%) + 96px); }
}

/* Подсказка управления и карточка задания делят низ окна: раньше
   обе стояли на одной строке и текст наезжал на текст. Задание
   прижато к нижней кромке остекления, подсказка встаёт над ним. */
.rc-flight .rcf-hint {
  bottom: auto;
  top: calc(var(--cab-wy, 8%) + var(--cab-wh, 68%) - clamp(112px, 15vh, 150px));
}
@media (max-width: 760px) {
  .rc-flight .rcf-hint {
    top: calc(var(--cab-wy, 8%) + var(--cab-wh, 68%) - 128px);
    bottom: auto;
  }
}
.rc-flight .rcf-hint { bottom: auto !important; height: auto; }

/* Дубль скорости в ленте нужен только на телефоне: правило с
   меньшей специфичностью проигрывало общему стилю ячеек табло */
.rc-flight .rcf-d-top .rcf-d-spd { display: none; }
@media (max-width: 760px) {
  .rc-flight .rcf-d-top .rcf-d-spd { display: inline-flex; }
}

/* Подсказку поднимаем только там, где она мешала - на телефоне
   карточка задания стоит внизу окна. На широком экране задание
   слева вверху, и подсказке место у нижней кромки остекления. */
.rc-flight .rcf-hint {
  top: auto;
  bottom: calc(100% - var(--cab-wy, 8%) - var(--cab-wh, 68%) + 22px) !important;
}
@media (max-width: 760px) {
  .rc-flight .rcf-hint {
    top: calc(var(--cab-wy, 8%) + var(--cab-wh, 68%) - 128px);
    bottom: auto !important;
    left: 6%;
    width: 42vw;
    max-width: 42vw;
    transform: none;
    text-align: left;
  }
}

/* ═══════════════════════════════════════════════════════════
   V2 FACTORY SOCKET PLATE

   The cockpit artwork now contains one continuous console with
   empty machined sockets. This final layer maps controls directly
   into that belt. There is no second perspective slab: the photo
   already owns perspective, material, shadow and silhouette.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-deck {
  position: absolute;
  left: var(--cab-dx, 4%);
  top: var(--cab-dy, 76%);
  right: auto;
  bottom: auto;
  width: var(--cab-dw, 92%);
  height: min(var(--cab-dh, 10%), 10vh);
  max-height: 10vh;
  min-height: 0;
  transform: none;
  perspective: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  overflow: visible;
  z-index: 6;
}
.rc-flight .rcf-d-face {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: none;
  transform-origin: 50% 50%;
  display: flex;
  flex-direction: column;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  box-shadow: none;
}
.rc-flight .rcf-d-top {
  flex: 0 0 clamp(14px, 2.2vh, 22px);
  min-height: 0;
  height: clamp(14px, 2.2vh, 22px);
  margin: 0 1.4%;
  padding: 1px clamp(7px, 1.4vw, 20px);
  gap: clamp(7px, 1.6vw, 24px);
  overflow: hidden;
}
.rc-flight .rcf-d-main {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  justify-items: center;
  gap: clamp(6px, 1.4vw, 20px);
  padding: 2px clamp(7px, 1.8vw, 26px) 4px;
}
.rc-flight .rcf-d-nav {
  grid-column: 1;
  justify-self: start;
}
.rc-flight .rcf-d-work {
  position: static;
  grid-column: 2;
  width: min(100%, 370px);
  display: grid;
  grid-template-columns: repeat(5, minmax(38px, 1fr));
  gap: clamp(3px, .7vw, 8px);
  transform: none;
}
.rc-flight .rcf-d-drive {
  grid-column: 3;
  justify-self: end;
}
.rc-flight .rcf-key {
  width: 100%;
  min-width: 0;
  height: clamp(34px, 4.5vh, 44px);
  padding: 0 clamp(4px, .7vw, 9px);
}
.rc-flight .rcf-d-main .rcf-radar {
  width: clamp(38px, 4.8vh, 48px);
  height: clamp(38px, 4.8vh, 48px);
}
.rc-flight .rcf-d-main .rcf-thr {
  width: clamp(72px, 8vw, 112px);
  height: clamp(34px, 4.5vh, 44px);
}
.rc-flight .rcf-menu {
  bottom: calc(100% - var(--cab-dy, 76%) + 8px);
}

@media (max-width: 760px) {
  .rc-flight .rcf-deck {
    height: min(var(--cab-dh, 10%), 10vh);
    max-height: 10vh;
    min-height: 0;
  }
  .rc-flight .rcf-d-top {
    flex-basis: clamp(14px, 2.2vh, 18px);
    height: clamp(14px, 2.2vh, 18px);
    padding: 0 4px;
    margin: 0 2px;
    gap: 6px;
  }
  .rc-flight .rcf-d-main {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 4px;
    padding: 1px 3px 3px;
  }
  .rc-flight .rcf-d-work {
    width: 100%;
    grid-template-columns: repeat(5, minmax(31px, 1fr));
    gap: 2px;
  }
  .rc-flight .rcf-key {
    height: 36px;
    min-width: 31px;
    padding: 0 2px;
  }
  .rc-flight .rcf-d-nav .rcf-map-key,
  .rc-flight .rcf-d-main .rcf-radar,
  .rc-flight .rcf-d-seen,
  .rc-flight .rcf-d-meter b,
  .rc-flight .rcf-d-meter u,
  .rc-flight .rcf-d-course .rcf-c-mode { display: none; }
  .rc-flight .rcf-d-main .rcf-thr {
    width: clamp(46px, 13vw, 58px);
    height: 36px;
  }
  .rc-flight .rcf-d-drive .rcf-d-row {
    flex-direction: column;
    gap: 2px;
  }
  .rc-flight .rcf-key.rcf-mini {
    width: 22px;
    height: 17px;
  }
  .rc-flight .rcf-menu {
    bottom: calc(100% - var(--cab-dy, 85.5%) + 5px);
  }
}

@media (max-width: 400px) {
  .rc-flight .rcf-key b { display: none; }
  .rc-flight .rcf-d-top .rcf-d-cell i { display: none; }
  .rc-flight .rcf-d-work { grid-template-columns: repeat(5, minmax(28px, 1fr)); }
}

/* Низкий landscape (телефон боком): десять процентов кадра дают
   всего 36–55 px. В таком окне телеметрия уже есть в HUD, поэтому
   снимаем дублирующую верхнюю ленту и оставляем один ряд физических
   клавиш. Ни одна зона не выходит за металл консоли. */
@media (max-height: 550px) {
  .rc-flight .rcf-d-top { display: none; }
  .rc-flight .rcf-d-main { padding: 1px 4px 2px; gap: 4px; }
  .rc-flight .rcf-key,
  .rc-flight .rcf-d-main .rcf-thr {
    height: min(32px, 8vh);
  }
  .rc-flight .rcf-d-main .rcf-radar {
    width: min(32px, 8vh);
    height: min(32px, 8vh);
  }
  .rc-flight .rcf-key b { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   P3 COCKPIT ACCEPTANCE · physical controls + compact briefing

   The launch choice is a projector readout inside the windscreen,
   not a second application window. The controls below are real
   backlit keys seated in the generated console sockets. This final
   layer intentionally owns only material and density; all geometry
   continues to come from cabGeom and stays within the 10% deck.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-brief {
  background: radial-gradient(ellipse 54% 48% at 50% 48%,
    rgba(var(--int-cyan-rgb, 66,178,220), .045),
    rgba(3, 9, 16, .14) 58%, transparent 82%);
  padding: clamp(12px, 3vw, 34px);
}
.rc-flight .rcf-brief-card {
  isolation: isolate;
  width: min(420px, 74vw);
  max-width: none;
  padding: clamp(16px, 2.2vw, 23px) clamp(18px, 2.7vw, 28px) clamp(15px, 2vw, 21px);
  border-radius: 10px;
  clip-path: polygon(18px 0, calc(100% - 18px) 0, 100% 18px,
    100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%,
    0 calc(100% - 18px), 0 18px);
  background:
    linear-gradient(110deg, transparent 0 14%, rgba(123,209,236,.055) 14.3% 14.7%, transparent 15% 74%, rgba(123,209,236,.045) 74.3% 74.6%, transparent 75%),
    linear-gradient(168deg, rgba(26, 74, 98, .33), rgba(5, 15, 25, .58) 48%, rgba(4, 12, 21, .68)) !important;
  border-color: rgba(var(--int-cyan-rgb,66,178,220),.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(216,244,255,.2),
    inset 0 -14px 30px rgba(0,0,0,.22),
    0 0 0 1px rgba(0,0,0,.45),
    0 0 48px -18px rgba(var(--int-cyan-rgb,66,178,220),.86) !important;
}
.rc-flight .rcf-brief-card > * { position: relative; z-index: 2; }
.rc-flight .rcf-brief-card::after {
  content: "";
  position: absolute;
  left: 17%; right: 17%; bottom: -8px;
  height: 9px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(var(--int-cyan-rgb,66,178,220),.72), transparent 70%);
  filter: blur(3px);
  pointer-events: none;
  z-index: 1;
}
.rc-flight .rcf-brief-card b {
  font-size: clamp(15px, 1.8vw, 20px);
  letter-spacing: .18em;
}
.rc-flight .rcf-brief-card p {
  max-width: 48ch;
  margin: 8px auto 13px;
  font-size: 11.5px;
  line-height: 1.48;
  color: rgba(var(--int-lit-rgb,207,233,245),.82);
}
.rc-flight .rcf-brief-btns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.rc-flight .rcf-brief-btns button {
  min-width: 0;
  max-width: none;
  padding: 10px 9px 9px;
  border-radius: 7px;
  border: 1px solid rgba(190,235,252,.34);
  font-size: 11px;
  letter-spacing: .11em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -4px 8px rgba(0,29,43,.38),
    0 2px 0 rgba(1,7,12,.9),
    0 8px 18px -12px rgba(var(--int-cyan-rgb,66,178,220),.92);
}
.rc-flight .rcf-brief-btns button:last-child {
  background: linear-gradient(180deg, #1a3145 0%, #0b1826 58%, #07111c 100%);
  border-color: rgba(var(--int-cyan-rgb,66,178,220),.42);
  box-shadow:
    inset 0 1px 0 rgba(221,243,252,.16),
    inset 0 -5px 9px rgba(0,0,0,.52),
    0 2px 0 #03070c;
}
.rc-flight .rcf-brief-btns button:active {
  transform: translateY(2px);
  box-shadow: inset 0 3px 8px rgba(0,0,0,.48), 0 0 16px rgba(var(--int-cyan-rgb,66,178,220),.28);
}

/* Socket-mounted keycaps. The generated cockpit image supplies the
   surrounding metal; these gradients supply the physical actuator. */
.rc-flight .rcf-deck .rcf-key {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(139,190,214,.34) !important;
  border-radius: 7px;
  background:
    radial-gradient(ellipse 74% 34% at 50% 4%, rgba(207,239,250,.16), transparent 72%),
    linear-gradient(180deg, #1a2c3c 0%, #101f2d 38%, #09131e 72%, #050b12 100%) !important;
  color: rgba(var(--int-lit-rgb,207,233,245),.9);
  box-shadow:
    inset 0 1px 0 rgba(224,246,255,.15),
    inset 0 -5px 8px rgba(0,0,0,.58),
    0 1px 0 rgba(116,171,195,.16),
    0 3px 0 #02070c,
    0 5px 9px rgba(0,0,0,.46) !important;
  text-shadow: 0 1px 2px #000;
  transform: translateY(-1px);
}
.rc-flight .rcf-deck .rcf-key::before {
  content: "";
  position: absolute;
  inset: 2px;
  border: 1px solid rgba(193,228,242,.075);
  border-radius: 4px;
  pointer-events: none;
}
.rc-flight .rcf-deck .rcf-key > * { position: relative; z-index: 1; }
.rc-flight .rcf-deck .rcf-key:hover {
  border-color: rgba(var(--int-cyan-rgb,66,178,220),.72) !important;
  color: #f3fbff;
}
.rc-flight .rcf-deck .rcf-key:active {
  transform: translateY(2px) !important;
  box-shadow:
    inset 0 4px 10px rgba(0,0,0,.72),
    inset 0 0 12px rgba(var(--int-cyan-rgb,66,178,220),.12),
    0 1px 0 #02070c !important;
}
.rc-flight .rcf-deck .rcf-key.cur,
.rc-flight .rcf-deck .rcf-key[aria-pressed="true"],
.rc-flight .rcf-deck .rcf-key[aria-expanded="true"] {
  background:
    radial-gradient(ellipse at 50% 0, rgba(224,250,255,.32), transparent 58%),
    linear-gradient(180deg, #176785 0%, #0b4059 48%, #071b29 100%) !important;
  border-color: rgba(127,224,255,.78) !important;
  box-shadow:
    inset 0 1px 0 rgba(235,252,255,.42),
    inset 0 -4px 8px rgba(0,18,28,.54),
    0 2px 0 #02070c,
    0 0 16px rgba(var(--int-cyan-rgb,66,178,220),.52) !important;
  filter: none;
}
.rc-flight .rcf-deck .rcf-fire-key {
  background:
    radial-gradient(ellipse 72% 32% at 50% 2%, rgba(255,221,185,.2), transparent 72%),
    linear-gradient(180deg, #42261c, #24140f 65%, #100906) !important;
  border-color: rgba(255,169,105,.42) !important;
}
.rc-flight .rcf-d-main .rcf-thr {
  border: 1px solid rgba(139,190,214,.32);
  background: linear-gradient(180deg, #050b12, #0b1722 52%, #04090f);
  box-shadow: inset 0 4px 9px rgba(0,0,0,.86), 0 2px 0 rgba(116,171,195,.13);
}
.rc-flight .rcf-d-top {
  border: 1px solid rgba(104,174,202,.13);
  border-radius: 5px;
  background: linear-gradient(180deg, rgba(4,12,20,.76), rgba(7,21,32,.42));
  box-shadow: inset 0 2px 8px rgba(0,0,0,.7), inset 0 1px 0 rgba(126,196,221,.08);
}

@media (max-width: 760px) {
  .rc-flight .rcf-brief { padding: 10px; }
  .rc-flight .rcf-brief-card {
    /* Ширину меряем по ПРОЁМУ ОКНА, а не по экрану. Карточка знала
       только vw и на телефоне вылезала за остекление на 37 точек с
       каждой стороны, на узком 360 - на 43: брифинг лежал прямо на
       раме рубки, чего заказчик запретил прямо. --cab-ww это ширина
       проёма в долях кадра, её и берём с запасом на кромку. */
    width: min(330px, 86vw, calc(var(--cab-ww, 86%) - 24px));
    padding: 14px 13px 13px;
    border-radius: 8px;
  }
  .rc-flight .rcf-brief-card b { font-size: 14px; letter-spacing: .16em; }
  .rc-flight .rcf-brief-card p { margin: 7px auto 10px; font-size: 10.5px; line-height: 1.42; }
  .rc-flight .rcf-brief-btns { gap: 6px; }
  .rc-flight .rcf-brief-btns button { padding: 9px 5px 8px; font-size: 9.5px; letter-spacing: .08em; }
  /* Девять точек - нижняя граница читаемого на телефоне. Восемь тут
     уже не слово, а узор: подпись под кнопкой перестаёт объяснять,
     чем автополёт отличается от ручного. */
  .rc-flight .rcf-brief-btns button span { font-size: 9px; }
  .rc-flight .rcf-deck .rcf-key { border-radius: 6px; }
}

@media (max-height: 620px) {
  .rc-flight .rcf-brief-card { width: min(390px, 72vw); padding: 10px 12px; }
  .rc-flight .rcf-brief-card p { margin: 5px auto 7px; font-size: 9.5px; }
  .rc-flight .rcf-brief-btns button { padding: 6px; }
}

/* ═══════════════════════════════════════════════════════════
   P6 REAL-DEVICE ACCEPTANCE · one windscreen, reversible scroll

   These rules intentionally live last. Earlier iterations positioned
   dialogs in viewport coordinates even though they already lived
   inside .rcf-hud. On a 360–393px device that applied the windscreen
   offset twice and cropped the first/last columns. Every projected
   surface now uses the HUD as its sole coordinate system.
   ═══════════════════════════════════════════════════════════ */

/* During the web finale the page owns vertical gestures, including a
   gesture that began one frame before the cabin became active. */
.rc-flight.rcf-stage,
.rc-flight.rcf-stage * {
  pointer-events: none !important;
  touch-action: pan-y !important;
}

/* A website header cannot float inside a closed spacecraft. It leaves
   only after the threshold is crossed and returns on reverse scroll. */
html.rc-deep-inside .hdr {
  opacity: 0 !important;
  visibility: hidden;
  pointer-events: none !important;
  transform: translate3d(0, -110%, 0) !important;
  transition: opacity .22s linear, transform .36s cubic-bezier(.2,.8,.2,1), visibility 0s linear .36s;
}
html.rc-deep-inside .totop,
html.rc-deep-inside .mcta,
html.rc-deep-inside .rcf-fab {
  opacity: 0 !important;
  visibility: hidden;
  pointer-events: none !important;
}
/* Кнопка «наверх» - единственный видимый выход из финала: шапка,
   логотип и липкая панель там погашены все, на любом экране. Она
   маленькая, стоит в углу над голограммой и кадру не мешает.

   Сначала это правило стояло только для телефона, и на мониторе
   получился клавиатурный тупик: страница внутри корабля заглушена,
   голограмма пульта собирается по доле подъезда и при заходе
   прыжком фокуса может не собраться вовсе - живых элементов в
   документе ноль, и выйти нечем. */
html.rc-deep-inside .totop.on {
  opacity: .82 !important;
  visibility: visible;
  pointer-events: auto !important;
}

/* HUD is the physical glass boundary. Child projections never receive
   a second set of viewport offsets. */
/* Меню растягивалось на всё окно, и под последней кнопкой оставалось
   пустое поле: на 1920 - 224 точки, на 1440 - 143. Панель размером в
   экран с горстью кнопок наверху читается недоделанной. Низ отпускаем
   и держим только потолок высоты: панель ровно по содержимому, а
   длинный список по-прежнему прокручивается. */
.rc-flight .rcf-hud > .rcf-menu {
  inset: clamp(38px, 7%, 58px) 8px auto 8px !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: calc(100% - clamp(38px, 7%, 58px) - 8px) !important;
  margin: 0 !important;
  /* Отступ и прокрутка живут во внутренней коробке: панель держит
     рамку и фон. */
  padding: 0 !important;
  transform: translate3d(0, 7px, 0) !important;
  border-radius: 9px;
  overflow: hidden;
  contain: layout paint;
  z-index: 30 !important;
}
.rc-flight .rcf-hud > .rcf-menu > .rcf-menu-in {
  padding: clamp(9px, 1.5vh, 14px);
  padding-top: calc(clamp(9px, 1.5vh, 14px) + 16px);
  padding-bottom: calc(clamp(9px, 1.5vh, 14px) + 26px);
}
.rc-flight .rcf-hud > .rcf-menu.on {
  transform: translate3d(0, 0, 0) !important;
}
.rc-flight .rcf-menu .rcf-menu-h {
  position: sticky;
  top: -1px;
  z-index: 2;
  padding: 5px 2px 6px;
  margin: 0 0 7px;
  background: linear-gradient(180deg, rgba(6,17,29,.98) 74%, rgba(6,17,29,0));
}
.rc-flight .rcf-menu .rcf-menu-h:not(:first-child) { margin-top: 12px; }
.rc-flight .rcf-menu .rcf-menu-h span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rc-flight .rcf-hud > .rcf-dos,
.rc-flight .rcf-hud > .rcf-help {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  transform: none !important;
  overflow: hidden !important;
  z-index: 30 !important;
}
.rc-flight .rcf-hud > .rcf-dos.on,
.rc-flight .rcf-hud > .rcf-help.on { transform: none !important; }
.rc-flight .rcf-dos-in,
.rc-flight .rcf-help-in {
  width: min(94%, 560px) !important;
  max-width: calc(100% - 12px) !important;
  max-height: calc(100% - 12px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* Background telemetry remains visible as faint ship ambience, but
   it cannot own hit targets while a foreground hologram is open.
   Some of its descendants intentionally enable pointer events for
   planet inspection, so disabling only the parent is insufficient. */
.rc-flight:has(.rcf-menu.on) .rc-holo,
.rc-flight:has(.rcf-menu.on) .rc-holo *,
.rc-flight:has(.rcf-dos.on) .rc-holo,
.rc-flight:has(.rcf-dos.on) .rc-holo *,
.rc-flight:has(.rcf-help.on) .rc-holo,
.rc-flight:has(.rcf-help.on) .rc-holo * {
  pointer-events: none !important;
}



@media (max-width: 760px) {
  .rc-flight .rcf-hud > .rcf-menu {
    inset: 36px 6px auto 6px !important;
    max-height: calc(100% - 42px) !important;
    padding: 0 !important;
  }
  .rc-flight .rcf-hud > .rcf-menu > .rcf-menu-in {
    padding: 8px;
    padding-top: 22px;
    padding-bottom: 32px;
  }
  .rc-flight .rcf-menu .rcf-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px;
  }
  .rc-flight .rcf-menu .rcf-uni {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 5px;
  }
  .rc-flight .rcf-menu .rcf-nav button,
  .rc-flight .rcf-menu .rcf-uni button {
    min-width: 0;
    /* Сорок четыре, а не тридцать восемь: ниже этого палец промахивается
       по своей же цели, и правило проекта считает сорок четыре нижней
       границей для всего, во что тыкают. */
    min-height: 44px;
    padding: 6px 4px;
    white-space: normal;
    line-height: 1.15;
    overflow-wrap: anywhere;
  }
  .rc-flight .rcf-menu-h i { font-size: 9px; letter-spacing: .12em; }
  .rc-flight .rcf-menu-h span { font-size: 9px; }


  .rc-flight .rcf-dos-in,
  .rc-flight .rcf-help-in {
    width: calc(100% - 10px) !important;
    max-width: calc(100% - 10px) !important;
    max-height: calc(100% - 10px) !important;
    padding: 10px !important;
  }
  .rc-flight .rcf-dos-map { max-height: 34%; object-fit: cover; }
  .rc-flight .rcf-dos-p { font-size: 10px; line-height: 1.35; }
  .rc-flight .rcf-dos-facts { gap: 4px; }
}

@media (max-width: 380px), (max-height: 650px) {
  .rc-flight .rcf-hud > .rcf-menu { top: 32px !important; }
  /* Восемь точек это не подпись, это узор. Замер: на узком 360 кегль
     кнопок целей 8, на лежачем 900 тоже 8 - то есть на экране втрое
     шире буквы такие же мелкие. Держим одиннадцать, как на телефоне. */
  /* ── ЦЕЛЬ ПОД ПАЛЕЦ, А НЕ ПОД КУРСОР ────────────────────────
     Высота 34 держалась здесь под кеглем, а условие `max-height:650`
     ловит ВЕСЬ лежачий телефон: 844x390, 926x428, 800x360. То есть
     главное действие игры - выбор цели - получало 34 точки на всех
     телефонах в повороте. Своё же правило проекта (rc-adapt.css,
     раздел про цели нажатия) требует сорока четырёх, и соседний блок
     этого же файла даёт хотя бы 38.

     Кегль оставляем одиннадцатый, ради него правило и писалось, а
     высоту возвращаем к сорока четырём. Место есть: меню прокручивается
     (внутренняя коробка со своей прокруткой стоит выше по файлу), и
     пятый ряд просто уезжает под прокрутку, а не жмёт остальные. */
  .rc-flight .rcf-menu .rcf-nav button,
  .rc-flight .rcf-menu .rcf-uni button { min-height: 44px; font-size: 11px; }
  /* Рукава в две колонки на 360 превращались в кашу: кнопка 94 точки
     шириной, а в ней «ПОЛЕ KEPLER · EXO-2 · реальные многопланетные
     системы телескопа Kepler» - семь строк по одному-два слова с
     разрывом слов посередине. Одна колонка на строку. */
  .rc-flight .rcf-menu .rcf-uni {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .rc-flight .rcf-menu .rcf-menu-h:not(:first-child) { margin-top: 8px; }
}

/* ═══════════════════════════════════════════════════════════
   P6I · THE CONSOLE IS A 3D OBJECT

   RC_CABIN now supplies the alloy bed, recesses, keycaps and screws.
   This layer keeps only accessible hit areas, glyphs and telemetry.
   No opaque DOM plate is allowed to cover the WebGL hardware.
   ═══════════════════════════════════════════════════════════ */
.rc-flight .rcf-deck,
.rc-flight .rcf-d-face {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
.rc-flight .rcf-deck .rcf-key {
  background: rgba(4, 10, 16, .025) !important;
  border-color: rgba(170, 218, 238, .10) !important;
  box-shadow: none !important;
  color: rgba(var(--int-lit-rgb,207,233,245),.90);
  text-shadow: 0 1px 2px #000, 0 0 7px rgba(var(--int-cyan-rgb,66,178,220),.18);
}
.rc-flight .rcf-deck .rcf-key::before {
  border-color: rgba(205, 235, 247, .045) !important;
}
.rc-flight .rcf-deck .rcf-key:active {
  transform: translateY(2px) !important;
  background: rgba(0, 5, 9, .18) !important;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.42) !important;
}
.rc-flight .rcf-deck .rcf-key.cur,
.rc-flight .rcf-deck .rcf-key[aria-pressed="true"],
.rc-flight .rcf-deck .rcf-key[aria-expanded="true"] {
  background: radial-gradient(ellipse at 50% 55%, rgba(66,178,220,.20), transparent 72%) !important;
  border-color: rgba(126,221,250,.28) !important;
  box-shadow: 0 0 12px rgba(66,178,220,.15) !important;
}
.rc-flight .rcf-deck .rcf-fire-key {
  background: radial-gradient(ellipse at 50% 55%, rgba(255,125,69,.12), transparent 72%) !important;
  border-color: rgba(255,158,102,.16) !important;
}
.rc-flight .rcf-d-main .rcf-thr,
.rc-flight .rcf-d-top {
  background: rgba(2, 7, 12, .06) !important;
  border-color: rgba(112, 188, 216, .08) !important;
  box-shadow: none !important;
}

/* P6M · one projected control, not a DOM copy above a 3D key.
   The real illuminated engraving now lives on the keycap mesh. The
   element below is only its accessible touch volume, kept slightly
   larger than the visible cap for a reliable 40 px mobile target. */
.rc-flight .rcf-deck .rcf-phys-hit {
  position: fixed !important;
  left: var(--rcf-phys-x) !important;
  top: var(--rcf-phys-y) !important;
  width: var(--rcf-phys-w) !important;
  height: var(--rcf-phys-h) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translate(-50%, -50%) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: transparent !important;
  text-shadow: none !important;
  z-index: 14 !important;
  touch-action: manipulation;
}
.rc-flight .rcf-deck .rcf-key.rcf-deploy.rcf-phys-hit {
  position: fixed !important;
  left: var(--rcf-phys-x) !important;
  top: var(--rcf-phys-y) !important;
}
.rc-flight .rcf-deck .rcf-key.rcf-phys-hit,
.rc-flight .rcf-deck .rcf-thr.rcf-phys-hit {
  transform: translate(-50%, -50%) !important;
}
.rc-flight .rcf-deck .rcf-phys-hit::before,
.rc-flight .rcf-deck .rcf-phys-hit > * {
  display: none !important;
}
.rc-flight .rcf-deck .rcf-phys-hit:active,
.rc-flight .rcf-deck .rcf-phys-hit.cur,
.rc-flight .rcf-deck .rcf-phys-hit[aria-pressed="true"],
.rc-flight .rcf-deck .rcf-phys-hit[aria-expanded="true"] {
  transform: translate(-50%, -50%) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* P6M · non-overlapping windscreen projection. Status, mission and
   the transient flight hint occupy three explicit glass bands. */
/* Раскладку титула ведёт колонка .rcf-top, здесь остаётся только
   оформление. Прежде тут стояли top, max-width 62% и nowrap с
   многоточием - три заплатки подряд против наложения, которого
   колонка не допускает вовсе. Именно они и резали название тела на
   телефоне заказчика до «исутст...». */
.rc-flight .rcf-hud .rcf-cap {
  padding: 6px 14px !important;
  font-size: clamp(9px, 1.1vw, 12px) !important;
  line-height: 1.25;
}
/* Карточка задания стоит НИЖЕ строки состояния, а не вровень с ней.

   Строка («САТУРН · 1,4 млрд км от ваших пользователей») висит по
   центру вверху и тянется в обе стороны от центра. На широком экране
   до карточки она не достаёт, на квадратном достаёт: заказчик
   прислал кадр четыре к трём, где начало строки уходит под карточку.

   Опускаем безусловно. Через признак «строка показана» не выйдет:
   класс has-info ставится только для служебных сообщений, а подпись
   тела висит и без него - проверено живьём. Место под строкой слева
   всё равно пустое, так что вид ничего не теряет. */

.rc-flight .rcf-hud .rcf-hint {
  top: auto !important;
  bottom: 10px !important;
  left: 50% !important;
  width: auto !important;
  max-width: 80% !important;
  padding: 5px 10px;
  transform: translateX(-50%) !important;
  /* Строка переносится. Стоял nowrap, и на телефоне подсказка
     обрывалась многоточием на «щипок - п...»: полсовета пропадало
     ровно там, где человек и не знает, что делать. */
  white-space: normal !important;
  text-align: center;
  line-height: 1.45;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center !important;
  /* Девять точек - нижняя граница читаемого. Восемь на телефоне
     превращают совет по управлению в узор. */
  font-size: clamp(9px, 1vw, 10px) !important;
  letter-spacing: .08em;
  background: linear-gradient(90deg, transparent, rgba(10,35,52,.42) 14%, rgba(10,35,52,.42) 86%, transparent);
  border-top: 1px solid rgba(116,214,244,.16);
  border-bottom: 1px solid rgba(116,214,244,.10);
  text-shadow: 0 0 8px rgba(66,178,220,.45);
}
@media (max-width: 760px) {
  .rc-flight .rcf-hud .rcf-cap {
    padding: 5px 10px !important;
    font-size: 9.5px !important;
  }
  .rc-flight .rcf-hud .rcf-hint {
    bottom: 7px !important;
    max-width: 88% !important;
    padding: 4px 8px;
    font-size: 9px !important;
  }
}

/* ── Голограмма подсказки над клавишей ────────────────────────
   Заказчик сформулировал требование дословно: «чтобы человек
   понимал если он сюда нажмёт то появится это». Подпись на клавише
   называет команду, а эта голограмма объясняет последствие.

   Живёт она на стекле и никогда не заезжает на раму: положение
   считает rc-flight по проекции самой клавиши и зажимает во
   вписанный прямоугольник проёма. Отсюда только внешний вид. */
.rc-flight .rcf-keyhint {
  position: fixed;
  left: 0; top: 0;
  /* Привязка НИЖНЕЙ кромкой, а не центром.

     Была привязка центром, и место считалось как «верх плиты минус
     половина высоты подсказки». Высота бралась из offsetHeight - то
     есть от ПРЕЖНЕГО текста, до того как в подсказку встал новый.
     У длинной подписи она оказывалась больше измеренной, и нижний
     край подсказки залезал на клавиши: замер на телефоне давал до
     2685 квадратных точек наложения при нуле на мониторе.

     С привязкой нижней кромкой высота вообще перестаёт участвовать:
     сколько бы строк ни было, низ стоит там, куда его поставили. */
  transform: translate(-50%, -100%) translate(var(--kh-x, 50vw), var(--kh-y, 60vh)) scale(.94);
  z-index: 26;
  pointer-events: none;
  opacity: 0;
  transition: opacity .16s ease, transform .16s cubic-bezier(.22,.9,.3,1);
  max-width: min(320px, 62vw);
  padding: 9px 13px 10px;
  border: 1px solid rgba(126, 220, 255, .42);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(10,28,42,.86), rgba(6,18,30,.80));
  box-shadow: 0 0 0 1px rgba(126,220,255,.10) inset,
              0 10px 34px rgba(0, 0, 0, .55),
              0 0 22px rgba(79, 200, 240, .16);
  color: #d6eefb;
  font: 500 12.5px/1.35 var(--rcf-font, 'Golos Text', system-ui, sans-serif);
  text-align: left;
}
.rc-flight .rcf-keyhint.on {
  opacity: 1;
  /* Привязка та же, что и в покое: нижней кромкой. Здесь стояло
     центрирование, и оно перебивало базовое правило ровно в том
     состоянии, ради которого всё и делается - в показанном. Правка
     базового правила при этом не давала ничего, и подсказка
     продолжала ложиться на клавиши. */
  transform: translate(-50%, -100%) translate(var(--kh-x, 50vw), var(--kh-y, 60vh)) scale(1);
}
/* Строчная развёртка: голограмма собрана лучом, а не напечатана */
.rc-flight .rcf-keyhint::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: repeating-linear-gradient(
    180deg,
    rgba(126, 220, 255, .055) 0 1px,
    rgba(126, 220, 255, 0) 1px 3px);
  mix-blend-mode: screen;
}
.rc-flight .rcf-keyhint b {
  display: block;
  margin-bottom: 3px;
  color: #9fe6ff;
  font-weight: 800;
  font-size: 11px;
  letter-spacing: .10em;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(79, 200, 240, .55);
}
.rc-flight .rcf-keyhint span {
  display: block;
  color: rgba(214, 238, 251, .88);
}
@media (prefers-reduced-motion: reduce) {
  .rc-flight .rcf-keyhint { transition: opacity .12s linear; }
}

/* Голограмма марки при настоящей рубке.

   Здесь стояло display:none - марку прятали, потому что у прошлой
   рамы было своё проекционное гнездо. Ту раму заказчик отверг, а
   вместе с ней молча пропала и голограмма. Заказчик заметил сразу:
   «справа нету голограммного логотипа». Возвращаем плоскую марку и
   сажаем её внутрь стекла: право и низ считаются от кромок окна.

   Про отсечение и про то, почему его здесь больше нет. Стояло
   clip-path: var(--cab-clip) - контур проёма остекления. Контур
   этот собирается в долях ВСЕГО кадра, а проценты в clip-path
   считаются от самого элемента. Марка на мониторе 92 точки, и
   контур окна размером в экран ужимался внутрь этих девяноста
   двух: марка резала сама себя. Замер по восьми экранам дал срез
   снизу от 14,8 до 20,5 процентов картинки - у ракеты отрезало
   факел и ногу буквы R, сверху срезало углы. Тем же контуром
   вырезало насмерть луч проектора (он ниже коробки) и световую
   лужу под маркой. Ровно это заказчик и увидел: «логотип
   обрезанный».

   Держать раму отсечением не нужно: место и так считается от
   вписанного в окно прямоугольника, а он по построению целиком
   внутри стекла. Проверено перебором по периметру - до контура
   остекления остаётся не меньше двенадцати точек на всех восьми
   размерах экрана.

   Низ теперь от настоящей нижней кромки остекления (--cab-dy), а
   не от низа вписанного прямоугольника: у восьмиугольного проёма
   вписанный прямоугольник кончается сильно выше стекла, и марка
   висела на трёх четвертях высоты окна. Заказчик написал «слишком
   высоко» - замер это подтвердил: центр марки стоял на 73-85
   процентах высоты стекла, под ней пропадало до 133 точек. */
.rc-flight.rcf-native-cab .rcf-holo {
  /* От правой кромки отступаем чуть больше: было четыре пикселя, и
     марка стояла впритык к стойке. */
  right: calc(var(--cab-wx, 6%) + 2.6%);
  /* Марка садится НА кромку пульта, а не висит над ней.
     Подъём был пять процентов высоты кадра - сорок пять точек на
     мониторе: замер показал низ марки на 673 при кромке консоли на
     718, и между ними оставался просвет, сквозь который луч уходил
     в пустоту. Владелец прочитал это ровно так: «логотип слишком
     высоко, он должен быть справа пониже, как голограмма ИЗ панели
     управления, а не в космосе где-то».
     Полпроцента вместо пяти: основание марки стоит в пяти точках над
     кромкой, луч ложится на консоль, и проекция читается идущей от
     приборов. На рамку при этом не залезает - это владелец просил
     отдельно. */
  bottom: calc(100% - var(--cab-dy, 80%) + 0.5%);
}

/* ── Луч проектора под маркой ────────────────────────────────
   Заказчик про марку сказал так: «логотип голограмма ниже справа
   должно быть, но не залазить на рамку, как голограмма». Стояла она
   уже внизу справа и уже с циановым тоном и развёрткой строк, но
   читалась наклейкой: у проекции не было того, что делает её
   проекцией - луча снизу.

   Луч идёт от пульта вверх, сужаясь к марке, и складывается со
   стеклом по свету. Он же объясняет, откуда марка взялась. */
.rc-flight .rcf-holo::before {
  content: '';
  position: absolute;
  left: 50%; top: 100%;
  width: 230%; height: 190%;
  transform: translateX(-50%);
  background: linear-gradient(180deg,
    rgba(var(--int-cyan-rgb, 66,178,220), .30) 0%,
    rgba(var(--int-cyan-rgb, 66,178,220), .10) 45%,
    rgba(var(--int-cyan-rgb, 66,178,220), 0) 100%);
  clip-path: polygon(38% 0, 62% 0, 100% 100%, 0 100%);
  mix-blend-mode: screen;
  pointer-events: none;
  filter: blur(1.4px);
  animation: rcfЛучМарки 4.2s ease-in-out infinite;
}
@keyframes rcfЛучМарки {
  0%, 100% { opacity: .52; }
  50%      { opacity: .82; }
}
/* Сама марка ярче и с более плотным свечением: издали она читалась
   бледным пятном на тёмной стойке. */
.rc-flight .rcf-holo img {
  opacity: .92;
  filter: brightness(1.75) sepia(1) hue-rotate(162deg) saturate(3.8)
          drop-shadow(0 0 10px rgba(var(--int-cyan-rgb, 66,178,220), .95))
          drop-shadow(0 0 26px rgba(var(--int-cyan-rgb, 66,178,220), .55));
}

/* ══════════════════════════════════════════════════════════
   Разметка при настоящей рубке

   Приборная плита разметки родилась, когда корпус кабины был
   картинкой: она рисовала себе табло, радар, рычаг и скорость
   поверх рисунка. Теперь всё это стоит железом в мире (rc-console),
   и разметка обязана уступить: у неё остаются только невидимые
   области попадания на клавишах и бортовое табло.

   Иначе в кадре два радара, две скорости и два табло - именно то,
   что заказчик называет «накладываются одно на другое».
   ══════════════════════════════════════════════════════════ */
/* Плита не рисует ни фона, ни наклона: под ней настоящая доска */
.rc-flight.rcf-native-cab .rcf-d-face {
  transform: none;
  height: 100%;
  background: none;
  box-shadow: none;
  border-radius: 0;
}
/* Радар, рычаг и скорость сняты: их место заняли живые приборы */
.rc-flight.rcf-native-cab .rcf-radar,
.rc-flight.rcf-native-cab .rcf-d-main .rcf-speed,
.rc-flight.rcf-native-cab .rcf-d-main .rcf-thr::after,
.rc-flight.rcf-native-cab .rcf-d-bay { background: none !important; border: 0 !important; box-shadow: none !important; }
.rc-flight.rcf-native-cab .rcf-radar { display: none !important; }
.rc-flight.rcf-native-cab .rcf-d-main .rcf-speed { display: none !important; }

/* Бортовое табло переезжает на стекло, к верхней кромке.

   На раскосой плите оно оказывалось у самой кромки остекления и
   читалось наполовину. Табло это то, что пилот смотрит первым,
   значит ему место на стекле сверху - как на референсах кабины. */
.rc-flight.rcf-native-cab .rcf-d-top {
  position: fixed;
  left: var(--cab-wx, 6%);
  top: var(--cab-hy, var(--cab-wy, 8%));
  width: var(--cab-ww, 88%);
  z-index: 15;
  padding: 4px clamp(8px, 1.4vw, 18px);
  background: linear-gradient(180deg, rgba(4, 12, 22, .62), rgba(4, 12, 22, .18));
  border-bottom: 1px solid rgba(var(--int-cyan-rgb, 66, 178, 220), .22);
  border-radius: clamp(8px, 1.4vw, 16px) clamp(8px, 1.4vw, 16px) 0 0;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  pointer-events: none;
}

/* Титры уходят под табло. Табло переехало к верхней кромке стекла,
   и надпись о теле легла ровно на него - две строки в одном месте
   читаются мусором, а не приборами. */
/* Здесь стоял отдельный top для родной рубки: ещё одна заплатка
   против того же наложения. Колонку он ломал, поэтому убран. */

/* ══════════════════════════════════════════════════════════
   Плоская рама рубки в полёте

   Кадр рубки лежит картинкой поверх холста космоса. Окно у него
   вырезано прозрачностью, поэтому сквозь него виден живой мир, а не
   снимок. object-fit: cover повторён в rc-panel числами - оттуда
   разметка берёт границы окна, и они совпадают пиксель в пиксель.

   Слой ничего не перехватывает: ни мышь, ни палец. Кнопки полёта
   лежат выше него.
   ══════════════════════════════════════════════════════════ */
.rcf-cabframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  /* Над холстом космоса (.rcf-cv лежит первым в обёртке), но ниже
     приборов и кнопок: рама это стекло, а не интерфейс. Единица
     хватает - холст идёт без своего слоя. */
  z-index: 1;
  display: none;
}
.rc-flight.rcf-native-cab .rcf-cabframe { display: block; }

/* ── Приборы пульта ──────────────────────────────────────────
   Холст лежит поверх плиты и светится в её пустых нишах. Режим
   screen значит «складывать свет»: сквозь свечение видно и металл,
   и его собственную тень, поэтому приборы читаются частью панели,
   а не наклейкой поверх. Событий не ловит - попадание считает сцена
   по тем же четырёхугольникам, что и рисует. */
.rcf-instr {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: none;
  pointer-events: none;
  mix-blend-mode: screen;
}
/* Тела клавиш. Наложение обычное: колпачок обязан ЗАСЛОНЯТЬ дно
   ниши, а слой света этого не умеет - он только складывается. Слой
   стоит под светом и живёт по тем же правилам показа. */
.rcf-caps {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: none;
  pointer-events: none;
}
.rc-flight.rcf-native-cab .rcf-instr,
.rc-flight.rcf-native-cab .rcf-caps { display: block; }

/* В финале приборы живут по тем же двум числам, что и сама картинка
   кабины: масштаб подъезда и прозрачность. Пока переменные одни на
   двоих, свет в нишах не может уехать от самих ниш - ни в начале
   подъезда, когда кабина ещё маленькая и полупрозрачная, ни в конце,
   когда она заняла экран целиком.

   Замер подъезда: коробка картинки 897x561 при прозрачности 0.31,
   потом 1200x750 при 0.69, потом весь экран при единице. Слой
   повторяет этот путь шаг в шаг. */
.rc-flight.rcf-stage .rcf-instr,
.rc-flight.rcf-stage .rcf-caps {
  display: block;
  transform: scale(var(--rcf-cabs, 1));
  transform-origin: 50% 62%;
  opacity: var(--rcf-cabo, 1);
}

/* ═══ Клавиши пульта: настоящая клавиша, а не прозрачная зона ═══
   Заказчик про пульт: «кнопки все непонятные», «кривые и плоские»,
   «для чего какая кнопка вообще не понятно», «иконки не подходящие».

   Причина ровно одна и она в коде: у клавиши стоял прозрачный фон и
   ноль границы. На экране была видна не клавиша, а ниша с фотографии
   кабины, а поверх неё висел бледный значок. Отсюда и «плоско»: у
   кнопки просто не было тела.

   Теперь тело есть. Клавиша сидит в своей нише как настоящая: свет
   сверху, тень снизу, кайма по контуру, при нажатии уходит внутрь.
   Подпись под значком возвращена на телефон - именно она отвечает на
   вопрос «что делает эта кнопка», а никакая иконка на такое не
   отвечает. */
.rc-flight .rcf-key {
  background:
    linear-gradient(180deg,
      rgba(var(--int-lit-rgb, 207,233,245), .13) 0%,
      rgba(var(--int-panel-rgb, 20,40,61), .82) 34%,
      rgba(4, 11, 20, .92) 100%);
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .30);
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .30),
    inset 0 -6px 10px -8px rgba(0,0,0,.95),
    0 2px 0 -1px rgba(0,0,0,.7),
    0 6px 14px -8px rgba(0,0,0,.9);
  color: rgba(var(--int-lit-rgb, 207,233,245), .96);
  transition: color .16s ease, transform .07s ease, box-shadow .16s ease,
              border-color .16s ease, background .16s ease;
}
.rc-flight .rcf-key::before {
  /* Блик по верхней кромке: клавиша выпуклая, а не наклейка */
  content: ''; position: absolute; left: 12%; right: 12%; top: 1px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--int-lit-rgb, 207,233,245), .6), transparent);
  pointer-events: none; border-radius: 1px;
}
.rc-flight .rcf-key:hover {
  color: #fff;
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .62);
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .42),
    inset 0 -6px 10px -8px rgba(0,0,0,.9),
    0 2px 0 -1px rgba(0,0,0,.7),
    0 8px 20px -8px rgba(var(--int-cyan-rgb, 66,178,220), .55);
}
/* Нажатие: клавиша уходит В нишу, свет сверху гаснет */
.rc-flight .rcf-key:active {
  transform: translateY(2px);
  box-shadow:
    inset 0 3px 8px -3px rgba(0,0,0,.95),
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .10);
}
.rc-flight .rcf-key:active::before { opacity: .25; }
/* Включённая клавиша горит: по ней сразу видно, что режим стоит */
.rc-flight .rcf-key.cur,
.rc-flight .rcf-key[aria-pressed="true"],
.rc-flight .rcf-key[aria-expanded="true"] {
  color: #fff;
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .9);
  background:
    linear-gradient(180deg,
      rgba(var(--int-cyan-rgb, 66,178,220), .34) 0%,
      rgba(var(--int-cyan-rgb, 66,178,220), .14) 42%,
      rgba(6, 18, 30, .92) 100%);
  box-shadow:
    inset 0 1px 0 rgba(var(--int-lit-rgb, 207,233,245), .5),
    0 0 18px -4px rgba(var(--int-cyan-rgb, 66,178,220), .85),
    0 2px 0 -1px rgba(0,0,0,.7);
}
/* Подпись читается: она и есть ответ на «что делает эта кнопка».
   Прятали её на узком экране - оставались одни значки. */
.rc-flight .rcf-key b {
  font-size: 9px;
  color: rgba(var(--int-lit-rgb, 207,233,245), .82);
}
.rc-flight .rcf-key.cur b,
.rc-flight .rcf-key[aria-pressed="true"] b,
.rc-flight .rcf-key[aria-expanded="true"] b { color: #fff; }
@media (max-width: 760px) {
  .rc-flight .rcf-key { height: 46px; min-width: 44px; padding: 0 6px; gap: 3px; border-radius: 8px; }
  .rc-flight .rcf-key svg { width: 17px; height: 17px; }
  .rc-flight .rcf-key b { display: block !important; font-size: 9px; letter-spacing: .05em; }
}
@media (max-width: 400px) {
  .rc-flight .rcf-key { height: 44px; min-width: 40px; padding: 0 4px; }
  .rc-flight .rcf-key b { display: block !important; font-size: 9px; letter-spacing: .03em; }
}

/* ═══ Радар на телефоне ═══════════════════════════════════════
   Заказчик про пульт: «радары навигаторы нету, они детские и криво
   размещено». Радар в разметке есть и честно рисуется, но на узком
   экране он был выключен двумя правилами подряд с пояснением, что
   кругляш съедает место у клавиш. Место он и правда съедал - в ряду
   клавиш. Значит место надо менять, а не выключать прибор.

   На телефоне радар переезжает НА СТЕКЛО, в левый нижний угол
   проёма: там он ничего не занимает, читается как бортовой прибор и
   не спорит с клавишами. Режется тем же контуром остекления, что и
   всё остальное на стекле, поэтому на раму не заезжает. */
@media (max-width: 760px) {
  .rc-flight .rcf-radar,
  .rc-flight.rcf-native-cab .rcf-radar {
    display: block !important;
    position: fixed !important;
    left: calc(var(--cab-wx, 6%) + 2.6%) !important;
    top: auto !important;
    right: auto !important;
    bottom: calc(100% - var(--cab-wy, 10%) - var(--cab-wh, 70%) + 2.2%) !important;
    width: clamp(52px, 15vw, 72px) !important;
    height: clamp(52px, 15vw, 72px) !important;
    z-index: 5;
    pointer-events: none;
    opacity: .92;
    /* Отсечения здесь нет по той же причине, что и у марки:
       контур проёма задан в долях кадра, а прибор всего 52-72
       точки - он резал бы сам себя. На раму радар не заезжает и
       без него, место считается от вписанного в окно
       прямоугольника. */
    border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
    background: radial-gradient(circle at 50% 50%, rgba(6,20,34,.72), rgba(3,10,18,.86));
    box-shadow: inset 0 0 18px rgba(var(--int-cyan-rgb, 66,178,220), .26),
                0 0 22px -8px rgba(var(--int-cyan-rgb, 66,178,220), .7);
  }
  /* В досье, справке и меню прибор не нужен: он бы просвечивал
     сквозь открытую голограмму. */
  .rc-flight.rcf-dos-on .rcf-radar,
  .rc-flight.rcf-menu-on .rcf-radar { display: none !important; }
}

/* ── Списки в панелях листаются пальцем ──────────────────────
   На всём слое полёта стоит touch-action: none - иначе свайп вверх
   тянул бы страницу вместо тяги корабля. Побочный эффект: меню
   КУРСа, досье и справка тоже переставали листаться, а список там
   на тринадцать тел и четыре рукава. Браузер обязан отдать этим
   трём панелям вертикальную прокрутку обратно. */
.rc-flight .rcf-menu,
.rc-flight .rcf-dos-in,
.rc-flight .rcf-help-in {
  touch-action: pan-y !important;
}

/* ── Двух одинаковых клавиш на пульте не бывает ──────────────
   ЗАЛП с прицелом делал ровно то же, что КАДР с камерой: сохранял
   снимок из окна. Две клавиши на одно действие, и у одной из них
   подпись про оружие - это и есть «кнопки все непонятные». Клавишу
   снимка держит .rcf-shot, а эта уходит с плиты. Разметку не рвём:
   на неё ссылаются подсказки и список команд. */
.rc-flight .rcf-fire-key { display: none !important; }

/* ── Бортовое табло на стекле не имеет права ужиматься ───────
   На стекле стоит лента из пяти ячеек: сеть, открыто, курс, ход и
   две шкалы. Ячейкам разрешили сжиматься (flex: 0 1 auto), и на
   телефоне все пять сжимались разом: слова обрезались по букве, а
   соседние сливались в кашу - "УРС 76 тыс. км КОД 520". Владелец
   написал ровно это: "все надписи друг на друга накладываются и
   обрезаются".

   Ячейку ОТКРЫТО правило телефона снимало ещё раньше, но снять не
   могло: у него вес (0,2,0), а у общего display: inline-flex для
   ячеек ленты - (0,3,0), и он побеждал независимо от порядка.
   Возвращаем правило тем же весом.

   Дальше арифметика: сеть 55, курс 84, ход 38, шкалы 52 плюс зазоры
   - 259 точек при доступных 298. Помещается, значит сжимать нечего
   и ячейкам это запрещено. */
@media (max-width: 760px) {
  .rc-flight .rcf-d-top .rcf-d-seen { display: none; }
  .rc-flight .rcf-d-top .rcf-d-cell {
    flex: 0 0 auto;
    min-width: max-content;
  }
  /* Ленте остаётся распределить остаток, а не резать содержимое */
  .rc-flight.rcf-native-cab .rcf-d-top { justify-content: space-between; }
}

/* ── Рубка видна ещё до входа в полёт ────────────────────────
   Раньше рама показывалась только в игре: на весь финал человек
   летел к голограмме, висящей в пустоте, а по нажатию кнопки вокруг
   него внезапно возникала рубка. Заказчик назвал это подменой и
   сформулировал требование дословно: «панель должна быть прибита к
   салону ещё до захода в ракету, и видно вдалеке её же 1:1».

   Картинка одна и та же. Меняется только расстояние: масштаб и
   плотность ведёт доля подъезда из сцены, и к пульту она приходит
   ровно в единицу. Значит последний кадр финала и первый кадр игры
   совпадают, и стыка не видно. */
.rc-flight.rcf-stage .rcf-cabframe {
  display: block;
  transform: scale(var(--rcf-cabs, 1));
  transform-origin: 50% 62%;
  opacity: var(--rcf-cabo, 1);
}

/* ── Бортовое табло уступает раскрытой панели ────────────────
   Досье, справка и меню курса ложатся поверх стекла, а лента
   телеметрии оставалась на своём месте и просвечивала сквозь их
   верхнюю кромку: над крестиком и заголовком висело «СЕТЬ 0/45
   ХОД 57». Это ровно то наложение надписей, на которое жаловались.

   Ленту не прячем совсем, а приглушаем: приборы корабля не
   выключаются от того, что человек читает карточку. Гаснет и
   подпись о теле - её содержание и так в заголовке досье. */
.rc-flight:has(.rcf-help.on) .rcf-d-top,
.rc-flight:has(.rcf-menu.on) .rcf-d-top,
.rc-flight:has(.rcf-dos.on) .rcf-d-top,
.rc-flight.rcf-modal .rcf-d-top,
.rc-flight:has(.rcf-dos.on) .rcf-cap,
.rc-flight:has(.rcf-help.on) .rcf-cap,
.rc-flight:has(.rcf-menu.on) .rcf-cap {
  /* У подписи о теле своя дыхательная анимация по прозрачности, а
     анимация сильнее обычного объявления: без !important и снятия
     анимации она продолжала гореть поверх карточки. */
  opacity: .12 !important;
  animation: none;
  transition: opacity .25s linear;
}

/* ── Клавиша СЕТЬ наконец что-то делает ──────────────────────
   Она переключала класс .on, а правил на этот класс не существовало
   вовсе. На телефоне список узлов вдобавок прятался наглухо двумя
   правилами. Человек жал клавишу, она загоралась, и не происходило
   ничего: ровно то, на что жаловались словами «кнопки все
   непонятные» и «для чего какая кнопка вообще не понятно».

   Список теперь живёт по классу: закрыт по умолчанию, открывается
   клавишей одинаково на телефоне и на большом экране. Пустая сеть
   честно пишет «СЕТЬ ПУСТА», значит нажатие всегда даёт ответ. */
.rc-flight .rcf-hud .rcf-netlist,
.rc-flight .rcf-netlist { display: none; }
.rc-flight .rcf-hud .rcf-netlist.on,
.rc-flight .rcf-netlist.on { display: flex; }

/* ── Переключатель звука в справке ───────────────────────────
   Единственная настройка, которая нужна прямо в полёте: шапка сайта
   с общим переключателем на время полёта спрятана, и выключить гул
   было негде. Кнопка живёт в строке списка, поэтому и выглядит как
   строка, а не как ещё одна клавиша пульта. */
.rc-flight .rcf-snd-key {
  appearance: none;
  border: 1px solid rgba(var(--int-cyan-rgb, 66,178,220), .5);
  border-radius: 999px;
  padding: 3px 12px;
  background: rgba(var(--int-cyan-rgb, 66,178,220), .1);
  color: var(--int-lit, #CFE9F5);
  font: 600 11px/1.5 var(--f-body, "Golos Text", sans-serif);
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .16s linear, border-color .16s linear;
}
.rc-flight .rcf-snd-key:hover { background: rgba(var(--int-cyan-rgb, 66,178,220), .2); }
.rc-flight .rcf-snd-key.cur {
  background: rgba(var(--int-cyan-rgb, 66,178,220), .3);
  border-color: rgba(var(--int-cyan-rgb, 66,178,220), .85);
}

/* Строка «полёта на этом устройстве нет». Не окно и не всплывашка:
   короткая строка там, где человек только что нажал кнопку. */
.rcf-no-fly {
  margin: 14px auto 0;
  max-width: 44ch;
  text-align: center;
  font-size: var(--fs-3, 0.8438rem);
  line-height: 1.5;
  color: var(--tx-2, rgba(226,238,252,.72));
}



/* ═══ Панель салона: DOM, приколоченный к миру ═══
   Панель рисуется в DOM (полное разрешение экрана - в WebGL кадр
   идёт с плотностью 1.15-1.35 и всё мылит), а место ей задаёт
   матрица от камеры сцены: stagePanel() проецирует прямоугольник
   кадра игры из точки пилота и кладёт результат в --rcf-cabm.
   Отсюда и «стоит в своём углу», и резкость игры.

   Начало координат в левом верхнем углу: матрица посчитана для
   прямоугольника элемента, а не относительно его середины. */
.rc-flight.rcf-stage .rcf-cabframe,
.rc-flight.rcf-stage .rcf-instr,
.rc-flight.rcf-stage .rcf-caps {
  display: none !important;
}
/* Запечённая панель: один слой, без наложения, с матрицей от камеры.
   Три прежних полноэкранных слоя (снимок, приборы с режимом screen,
   тела клавиш) стоили браузеру трёх композиций с блендом на каждый
   кадр оборота - это и были рывки финальной сцены. */
.rcf-cabbake {
  position: absolute;
  left: 0; top: 0;
  width: 100%; height: 100%;
  display: none;
  pointer-events: none;
  z-index: 4;
  transform-origin: 0 0;
  will-change: transform;
  transition: opacity .16s linear;
}
.rc-flight.rcf-stage .rcf-cabbake { display: block; }