/* МТК 42 · добавки к общему каркасу карточки (assets/shared/card/card-frame.css).
 * Перенесены из одобренного макета (making-of/prototypes/mtk42-card-canon,
 * dvn 25.09): портрет 400 × 500, монограмма, лента снимков, шкала оценки,
 * цитата, ключевая работа, «Что сейчас». Кегли — ступенями каркаса и
 * множатся на --content-scale (--cc-s), режим слабовидящих укрупняет их сам.
 * Красный не используется (канон: только точкой статуса). */

/* Оверлей: карточка каркаса — сама панель. Строка сетки определённой высоты,
 * иначе max-height: 100% у карточки не от чего считать и длинная карточка
 * уходит за край вместо своей прокрутки. */
.m42-detail {
  grid-template-rows: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr);
  /* Карточка живёт между полосами хрома ядра, как сами сцены: иначе высокая
   * (Маршалл 1445 px, в a11y ×1,25) уходит под навбар. */
  padding: var(--chrome-top, var(--kiosk-safe-top)) var(--edge-safe)
           var(--chrome-bottom, var(--kiosk-safe-bottom));
}
.m42-detail .cc-card { box-shadow: 0 32px 72px rgba(0, 0, 0, 0.55); }
.a11y .m42-detail .cc-card { background: #000; border-color: var(--a11y-accent, #FFD24A); }
.a11y .m42-detail .cc-type { color: var(--a11y-accent, #FFD24A); }

/* Тон снимков — общая настройка «Цвет фото» (переменная из styles.css). */
.m42cc .cc-photo img, .m42cc-shot img { filter: var(--m42-photo-filter); }

/* ── Персона: портрет 400 × 500 (кадр 4:5 по центру) ── */
.m42cc--person .cc-photo img {
  width: calc(400px * var(--cc-s, 1));
  height: calc(500px * var(--cc-s, 1));
  object-fit: cover;
  border-radius: 4px;
  background: rgba(var(--graphite-rgb), 0.35);
}
/* Нет портрета — монограмма в слоте снимка (model.media). */
.m42cc-mono {
  width: calc(400px * var(--cc-s, 1)); height: calc(500px * var(--cc-s, 1));
  display: grid; place-items: center;
  border-radius: 4px;
  background: rgba(var(--graphite-rgb), 0.35);
}
.m42cc-mono__letter {
  font-family: "Nolde", "Noto Sans SC", Georgia, serif;
  font-size: calc(180px * var(--cc-s, 1)); line-height: 1;
  color: rgba(var(--paper-rgb), 0.25);
}

/* Шкала оценки — вторая строка пары «Оценка». Трек без красного:
 * графит → латунь; маркер — точка бумаги. */
.m42cc-scale { display: grid; gap: calc(10px * var(--cc-s, 1)); width: 100%; margin-top: calc(14px * var(--cc-s, 1)); }
.m42cc-scale__track {
  position: relative; display: block;
  height: calc(10px * var(--cc-s, 1)); border-radius: 999px;
  background: linear-gradient(90deg, rgba(var(--window-rgb), 0.35), rgba(var(--brass-rgb), 0.9));
}
.m42cc-scale__mark {
  position: absolute; top: 50%;
  width: calc(30px * var(--cc-s, 1)); height: calc(30px * var(--cc-s, 1));
  transform: translate(-50%, -50%);
  border-radius: 50%; background: var(--paper);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}
.m42cc-scale__ends {
  display: flex; justify-content: space-between;
  font-family: "20 Kopeek", "Noto Sans SC", monospace;
  font-size: calc(24px * var(--cc-s, 1)); letter-spacing: 0.06em;
  color: var(--window);
}

/* Цитата — латунная линия слева, без заливки. */
.m42cc-quote { padding-left: calc(36px * var(--cc-s, 1)); border-left: 3px solid rgba(var(--brass-rgb), 0.7); }
.m42cc-quote__text {
  margin: 0; max-width: 62ch;
  font-family: "21 Cent", "Noto Sans SC", Georgia, serif;
  font-size: calc(34px * var(--cc-s, 1)); line-height: 1.5;
  color: var(--paper);
}
.m42cc-quote__src {
  margin-top: calc(14px * var(--cc-s, 1));
  font-family: "20 Kopeek", "Noto Sans SC", monospace;
  font-size: calc(28px * var(--cc-s, 1)); line-height: 1.35;
  color: rgba(var(--paper-rgb), 0.66);
}

/* Ключевая работа: оригинал, перевод строкой ниже (EN/ZH). Подпись блока —
 * слот каркаса (.cc-section__label). */
.m42cc-work p { margin: 0; max-width: 62ch; font-family: "21 Cent", "Noto Sans SC", Georgia, serif; }
.m42cc-work__orig { font-size: calc(32px * var(--cc-s, 1)); line-height: 1.4; color: rgba(var(--paper-rgb), 0.9); }
.m42cc-work .m42cc-work__tr {
  margin-top: calc(6px * var(--cc-s, 1));
  font-size: calc(30px * var(--cc-s, 1)); line-height: 1.4; color: rgba(var(--paper-rgb), 0.66);
}

/* «Что сейчас» — латунная линия. */
.m42cc-after { padding-left: calc(28px * var(--cc-s, 1)); border-left: 3px solid var(--brass); }
.m42cc-after p {
  margin: 0; max-width: 62ch;
  font-family: "21 Cent", "Noto Sans SC", Georgia, serif;
  font-size: calc(34px * var(--cc-s, 1)); line-height: 1.48;
  color: rgba(var(--paper-rgb), 0.9);
}

/* ── Музей: лента снимков в слоте снимка (model.media) ─────────────────────
 * Ширина слота каркаса 1180; снимки целиком, не выше 760 и не шире слота;
 * край следующего подсказывает жест. Пальцем вбок — .kiosk-scroll (ядро
 * 1.29.3: pan-x pan-y); вертикальный жест не забирает (overscroll по оси x). */
.m42cc-media { width: calc(1180px * var(--cc-s, 1)); max-width: 100%; }
.m42cc-gallery {
  display: flex; gap: calc(20px * var(--cc-s, 1));
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  padding-bottom: calc(16px * var(--cc-s, 1));   /* воздух под видимой полосой */
}
.m42cc-shot { flex: 0 0 auto; margin: 0; scroll-snap-align: start; }
.m42cc-shot img {
  display: block; width: auto; height: auto;
  max-width: calc(1180px * var(--cc-s, 1));
  max-height: calc(760px * var(--cc-s, 1));
  border-radius: 4px;
  background: rgba(var(--graphite-rgb), 0.35);
}
.m42cc-shot figcaption {
  margin-top: calc(10px * var(--cc-s, 1));
  font-family: "20 Kopeek", "Noto Sans SC", monospace;
  font-size: calc(24px * var(--cc-s, 1)); color: var(--window);
}
