/* 17 окт. 2026 (просьба владельца — «как в Доте»): РАЗБОР СМЕРТИ — табличка слева посередине (public/js/recap.js).
   Стекло с латунными уголками, как табличка главного меню; кадр 1920×1080, размер — zoom var(--kgz) (720p меньше, 4K ×2).
   «×» — свернуть в ярлычок «Разбор смерти»; ярлычок — развернуть. Цвета — токены набора «Кузня» с запасными значениями (?ui=old) */
#recap {
  position: fixed; left: 20px; top: 50%; z-index: 22; transform: translateY(-50%); zoom: var(--kgz, 1);
  pointer-events: none; font-family: var(--k-font, 'Manrope', sans-serif); color: var(--k-text, #efe6d3); text-shadow: 0 1px 0 rgba(0, 0, 0, .6);
}
#recap.hidden { display: none; }
#recap.rc-out { opacity: 0; transition: opacity .4s; } /* ожили — через 3 с гаснет (recap.js GRACE_MS) */
#recap .rc-panel, #recap .rc-tab {
  --cc: #c99a3a;
  pointer-events: auto; position: relative; box-sizing: border-box;
  background:
    linear-gradient(var(--cc), var(--cc)) 0 0 / 12px 3px no-repeat, linear-gradient(var(--cc), var(--cc)) 0 0 / 3px 12px no-repeat,
    linear-gradient(var(--cc), var(--cc)) 100% 0 / 12px 3px no-repeat, linear-gradient(var(--cc), var(--cc)) 100% 0 / 3px 12px no-repeat,
    linear-gradient(var(--cc), var(--cc)) 0 100% / 12px 3px no-repeat, linear-gradient(var(--cc), var(--cc)) 0 100% / 3px 12px no-repeat,
    linear-gradient(var(--cc), var(--cc)) 100% 100% / 12px 3px no-repeat, linear-gradient(var(--cc), var(--cc)) 100% 100% / 3px 12px no-repeat,
    rgba(11, 8, 18, .9);
  box-shadow: inset 0 0 0 1px rgba(167, 116, 230, .26), 0 12px 30px rgba(0, 0, 0, .5);
  animation: rc-in .35s cubic-bezier(.2, .8, .3, 1) .35s both;
}
@keyframes rc-in { from { transform: translateX(-36px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { #recap .rc-panel, #recap .rc-tab { animation: none; } }
/* 18 окт. 2026 (просьба владельца): ширина — ровно как у мини-карты под табличкой (--rcw ставит recap.js fit, там же левый край и высота) */
#recap .rc-panel { width: var(--rcw, 372px); padding: 14px 14px 12px; }

/* «×» — пиксельный крестик */
#recap .rc-x { position: absolute; right: 6px; top: 6px; width: 28px; height: 28px; padding: 0; border: 0; background: none; cursor: var(--cur-hand, pointer); }
#recap .rc-x::before, #recap .rc-x::after { content: ''; position: absolute; left: 7px; top: 12px; width: 14px; height: 3px; background: var(--k-text-3, #71695c); transform: rotate(45deg); }
#recap .rc-x::after { transform: rotate(-45deg); }
#recap .rc-x:hover::before, #recap .rc-x:hover::after { background: var(--k-gold-hi, #f3d897); }

/* шапка: «Вас убил», ник цветом игрока (монстр — кровью, тьма — фиолетовым), герой */
#recap .rc-lbl { font: 700 12px / 1 var(--k-font, 'Manrope', sans-serif); letter-spacing: .24em; text-transform: uppercase; color: var(--k-text-3, #8a8170); }
#recap .rc-who { margin: 6px 34px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 800 30px / 1.1 var(--k-title, 'Exo 2', sans-serif); color: var(--k-blood, #c8473c); text-shadow: 0 3px 0 var(--k-ink, #08070b); }
#recap .rc-who.env { color: var(--k-violet-hi, #d6bdf7); }
#recap .rc-hero { display: flex; align-items: center; gap: 8px; margin-top: 4px; font: 600 14px / 1.2 var(--k-font, 'Manrope', sans-serif); color: var(--k-text-2, #a89e8b); }
#recap .rc-hero i { width: 8px; height: 8px; box-shadow: 0 0 0 2px var(--k-ink, #08070b); }

/* всего урона */
#recap .rc-tot { display: flex; align-items: baseline; gap: 9px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(217, 180, 106, .28); }
#recap .rc-tot b { font: 800 28px / 1 var(--k-title, 'Exo 2', sans-serif); font-variant-numeric: tabular-nums; color: var(--k-text, #efe6d3); }
#recap .rc-tot span { font: 600 13px / 1 var(--k-font, 'Manrope', sans-serif); color: var(--k-text-2, #a89e8b); }

/* строки: значок · название (клавиша) · % · урон; под строкой — полоса доли цветом игрока */
#recap .rc-rows { display: flex; flex-direction: column; gap: 3px; margin-top: 9px; }
#recap .rc-r { position: relative; isolation: isolate; display: grid; grid-template-columns: 26px minmax(0, 1fr) 40px 48px; align-items: center; gap: 6px; min-height: 30px; padding: 2px 6px 2px 4px; }
#recap .rc-bar { position: absolute; left: 0; top: 0; bottom: 0; z-index: -1; width: var(--w); background: color-mix(in srgb, var(--rc) 20%, transparent); box-shadow: inset 3px 0 0 var(--rc); }
#recap .rc-ic { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; }
#recap .rc-ic img { display: block; width: 24px; height: 24px; image-rendering: pixelated; box-shadow: 0 0 0 1px rgba(0, 0, 0, .7); }
#recap .rc-ic i { display: block; width: 8px; height: 8px; box-shadow: 0 0 0 2px var(--k-ink, #08070b); }
#recap .rc-n { display: flex; align-items: center; gap: 5px; min-width: 0; white-space: nowrap; font: 700 15px / 1.2 var(--k-font, 'Manrope', sans-serif); color: var(--k-text, #efe6d3); }
#recap .rc-n .t { overflow: hidden; text-overflow: ellipsis; }
#recap .rc-n kbd { flex: none; padding: 1px 4px; border: 1px solid rgba(239, 230, 211, .22); font: 700 10px / 1 var(--k-font, 'Manrope', sans-serif); color: var(--k-text-3, #8a8170); vertical-align: 2px; }
#recap .rc-p { text-align: right; font: 800 16px / 1 var(--k-title, 'Exo 2', sans-serif); color: var(--k-gold-hi, #f3d897); }
#recap .rc-v { text-align: right; font: 600 14px / 1 var(--k-font, 'Manrope', sans-serif); font-variant-numeric: tabular-nums; color: var(--k-text-2, #a89e8b); }
/* подзаголовок другого героя / «Монстры» */
#recap .rc-sub { display: flex; align-items: center; gap: 7px; margin-top: 7px; padding: 0 6px 0 4px; font: 700 13px / 1.2 var(--k-font, 'Manrope', sans-serif); white-space: nowrap; }
#recap .rc-sub i { width: 8px; height: 8px; flex: none; box-shadow: 0 0 0 2px var(--k-ink, #08070b); }
#recap .rc-sub b { overflow: hidden; text-overflow: ellipsis; }
#recap .rc-sub.env b { color: var(--k-text-2, #a89e8b); letter-spacing: .12em; text-transform: uppercase; font-size: 11px; }
#recap .rc-sub span { color: var(--k-text-3, #8a8170); font-weight: 600; }
#recap .rc-sub em { margin-left: auto; font-style: normal; font-weight: 600; color: var(--k-text-2, #a89e8b); font-variant-numeric: tabular-nums; }

/* свёрнуто — ярлычок */
#recap .rc-tab { display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 14px; border: 0; cursor: var(--cur-hand, pointer); font: 700 13px / 1 var(--k-font, 'Manrope', sans-serif); letter-spacing: .16em; text-transform: uppercase; color: var(--k-text-2, #a89e8b); }
#recap .rc-tab:hover { color: var(--k-gold-hi, #f3d897); }
#recap .rc-skull { width: 8px; height: 8px; background: var(--k-blood, #c8473c); transform: rotate(45deg); box-shadow: 0 0 0 2px var(--k-ink, #08070b); }
/* тестовая арена: слева её панель лагеря (#tapanel) — табличка справа посередине (мини-карты там нет) */
body.ta #recap { left: auto; right: 20px; }
body.ta #recap .rc-panel, body.ta #recap .rc-tab { animation-name: rc-in-r; }
@keyframes rc-in-r { from { transform: translateX(36px); opacity: 0; } to { transform: none; opacity: 1; } }
/* последний удар (урона не было — казнь, «К доске!») */
#recap .rc-fin { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(217, 180, 106, .28); font: 700 15px / 1.2 var(--k-font, 'Manrope', sans-serif); }
#recap .rc-fin .k-lbl { flex-basis: 100%; font: 700 11px / 1 var(--k-font, 'Manrope', sans-serif); letter-spacing: .2em; text-transform: uppercase; color: var(--k-text-3, #8a8170); }
#recap .rc-fin img { width: 24px; height: 24px; image-rendering: pixelated; box-shadow: 0 0 0 1px rgba(0, 0, 0, .7); }
#recap .rc-fin kbd { padding: 1px 4px; border: 1px solid rgba(239, 230, 211, .22); font: 700 10px / 1 var(--k-font, 'Manrope', sans-serif); color: var(--k-text-3, #8a8170); }