/* AUTOGENEROVANO CORALEM, neupravovat.
 * Zdroj pravdy je stejnojmenny .less soubor, tento .css se pri kazde
 * synchronizaci prepisuje. Upravy delej v .less souboru. */
/* ========================================================================
   005 obrazovky-a-hud
   Vizuální nápad: celé rozhraní je hledáček tělní kamery. Data drží rohy,
   střed zůstává prázdný pro hru, obsah obrazovek sedí v levém dolním rohu.
   Sdílené třídy .bc-* a proměnné :root patří sekci herni-jadro; tenhle soubor
   je nedefinuje znovu, jen k nim přidává vlastní třídy s prefixem bcoh.
   ======================================================================== */
/* ========================================================================
   0. LOKÁLNÍ PROMĚNNÉ
   ======================================================================== */
/* telefon */
/* tablet a malý notebook */
/* nízká obrazovka, telefon na šířku */
/* Zrno jako inline SVG, žádný obrázkový soubor. */
/* ========================================================================
   1. KOŘEN SEKCE
   ======================================================================== */
.bcoh {
  display: contents;
  /* vrstvy uvnitř jsou fixed, sekce sama nemá box */
}
/* Ikony berou barvu textu vedle sebe a mají pevný box od prvního snímku. */
.bcoh [data-lucide],
.bcoh svg {
  width: 18px;
  height: 18px;
  flex: none;
  stroke-width: 1.6;
  color: inherit;
}
/* Sdílená .je-skryty musí zůstat silnější než vlastní display téhle sekce. */
.bcoh .je-skryty {
  display: none;
}
/* ========================================================================
   2. HUD - datový overlay kamery, střed zůstává prázdný
   ======================================================================== */
.bcoh-hud {
  position: fixed;
  inset: 0;
  z-index: var(--z-hud, 20);
  pointer-events: none;
  opacity: var(--bcoh-kryti-hud, 1);
  /* řídí pole Výraznost rozhraní */
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  color: var(--barva-text, #d8ddd6);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  -webkit-user-select: none;
  user-select: none;
}
.bcoh-hud__popisek {
  display: block;
  font-size: calc(var(--meritko-textu, 1) * 0.66rem);
  line-height: 1.2;
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-hud__cislo {
  display: block;
  font-size: calc(var(--meritko-textu, 1) * clamp(1.05rem, 2vw, 1.5rem));
  font-weight: 500;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  min-width: 3ch;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.75);
}
/* --- levý horní roh: REC a razítko --- */
.bcoh-hud__roh {
  position: absolute;
  display: flex;
  align-items: center;
  gap: var(--mezera-2, 8px);
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  color: var(--barva-text-tlum, #8a938c);
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.75);
}
.bcoh-hud__roh--vlevo-nahore {
  top: var(--mezera-5, 24px);
  left: var(--mezera-6, 32px);
}
.bcoh-hud__roh--vpravo-dole {
  right: var(--mezera-6, 32px);
  bottom: var(--mezera-4, 16px);
  flex-direction: column;
  align-items: flex-end;
  gap: var(--mezera-1, 4px);
  text-align: right;
}
.bcoh-hud__rec {
  width: 8px;
  height: 8px;
  flex: none;
  background: var(--barva-rec, #e0332b);
  border-radius: 50%;
  animation: bcoh-rec 1.6s ease-in-out infinite;
}
.bcoh-hud__razitko,
.bcoh-hud__mapa,
.bcoh-hud__kod {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.14em;
}
.bcoh-hud__kod {
  color: var(--barva-text-tlum, #8a938c);
}
/* --- horní blok: skóre, kolo, čas --- */
.bcoh-hud__horni {
  position: absolute;
  top: calc(var(--mezera-5, 24px) + var(--mezera-6, 32px));
  left: var(--mezera-6, 32px);
  display: flex;
  gap: var(--mezera-6, 32px);
}
.bcoh-hud__blok {
  display: block;
}
/* --- kill feed vpravo nahoře (řádky dokresluje JS) --- */
.bcoh-hud__killfeed {
  position: absolute;
  top: var(--mezera-5, 24px);
  right: var(--mezera-6, 32px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--mezera-1, 4px);
  max-width: 42vw;
}
.bcoh-hud__zaznam {
  padding: var(--mezera-1, 4px) var(--mezera-3, 12px);
  background: var(--barva-plocha, rgba(18, 22, 20, 0.72));
  border: 1px solid var(--barva-okraj, rgba(200, 210, 200, 0.18));
  font-size: calc(var(--meritko-textu, 1) * 0.68rem);
  color: var(--barva-text-tlum, #8a938c);
  white-space: nowrap;
  animation: bcoh-prichod-vpravo 180ms ease-out;
}
.bcoh-hud__zaznam--ja {
  color: var(--barva-text, #d8ddd6);
  border-color: var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
}
/* --- střed: zaměřovač, ukazatel směru, varování --- */
.bcoh-hud__stred {
  position: absolute;
  inset: 0;
  /* bez transformace, aby uvnitř fungoval fixed hledáček */
}
.bcoh-hud__zamerovac {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 64px;
  height: 64px;
  transform: translate(-50%, -50%) scale(var(--bcoh-meritko-zamerovace, 1));
}
.bcoh-hud__cara {
  position: absolute;
  left: 50%;
  top: 50%;
  background: var(--barva-zasah, #ffffff);
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.9);
  transition: transform var(--trvani-rychle, 120ms) linear;
}
.bcoh-hud__cara--nahore,
.bcoh-hud__cara--dole {
  width: 2px;
  height: 10px;
  margin-left: -1px;
}
.bcoh-hud__cara--vlevo,
.bcoh-hud__cara--vpravo {
  width: 10px;
  height: 2px;
  margin-top: -1px;
}
/* --bcoh-rozptyl nastavuje JS podle zbrane.rozptyl() */
.bcoh-hud__cara--nahore {
  transform: translateY(calc(0px - 10px - var(--bcoh-rozptyl, 4px)));
}
.bcoh-hud__cara--dole {
  transform: translateY(var(--bcoh-rozptyl, 4px));
}
.bcoh-hud__cara--vlevo {
  transform: translateX(calc(0px - 10px - var(--bcoh-rozptyl, 4px)));
}
.bcoh-hud__cara--vpravo {
  transform: translateX(var(--bcoh-rozptyl, 4px));
}
.bcoh-hud__bod {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 2px;
  height: 2px;
  margin: -1px 0 0 -1px;
  background: var(--barva-zasah, #ffffff);
  opacity: 0.85;
}
.bcoh-hud__kriz {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  opacity: 0;
}
.bcoh-hud__kriz::before,
.bcoh-hud__kriz::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 2px;
  height: 20px;
  margin: -10px 0 0 -1px;
  background: var(--barva-zasah, #ffffff);
}
.bcoh-hud__kriz::before {
  transform: rotate(45deg);
}
.bcoh-hud__kriz::after {
  transform: rotate(-45deg);
}
/* JS třída - přidává se na zaměřovač při zásahu bota */
.bcoh-hud__zamerovac.je-zasah .bcoh-hud__kriz {
  animation: bcoh-zasah 260ms ease-out;
}
/* --- ukazatel směru zásahu --- */
.bcoh-hud__smer {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 260px;
  height: 260px;
  margin: -130px 0 0 -130px;
}
.bcoh-hud__oblouk {
  position: absolute;
  inset: 0;
  border: 3px solid transparent;
  border-top-color: var(--barva-rec, #e0332b);
  border-radius: 50%;
  opacity: 0;
  transition: opacity var(--trvani-stredni, 240ms) ease;
}
.bcoh-hud__oblouk[data-bcoh-smer="90"] {
  transform: rotate(90deg);
}
.bcoh-hud__oblouk[data-bcoh-smer="180"] {
  transform: rotate(180deg);
}
.bcoh-hud__oblouk[data-bcoh-smer="270"] {
  transform: rotate(270deg);
}
/* JS třída - bliká podle události zasahHrace */
.bcoh-hud__oblouk.je-videt {
  opacity: 1;
}
/* --- zaměřovač odstřelovačky --- */
.bcoh-hud__odstrelovac {
  position: fixed;
  inset: 0;
}
.bcoh-hud__hledi {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 50%, rgba(7, 9, 8, 0) 25vmin, rgba(7, 9, 8, 0.9) 27vmin, rgba(7, 9, 8, 0.99) 46vmin);
}
.bcoh-hud__nit {
  position: absolute;
  background: rgba(216, 221, 214, 0.55);
  /* --barva-text s alfou */
}
.bcoh-hud__nit--svisla {
  left: 50%;
  top: 0;
  width: 1px;
  height: 100%;
  margin-left: -0.5px;
}
.bcoh-hud__nit--vodorovna {
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  margin-top: -0.5px;
}
/* --- varování při nabíjení a prázdném zásobníku --- */
.bcoh-hud__varovani {
  position: absolute;
  left: 50%;
  top: calc(50% + 72px);
  transform: translateX(-50%);
  padding: var(--mezera-2, 8px) var(--mezera-4, 16px);
  background: var(--barva-plocha, rgba(18, 22, 20, 0.72));
  border: 1px solid var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
}
.bcoh-hud__varovani-text {
  font-size: calc(var(--meritko-textu, 1) * 0.72rem);
  color: var(--barva-akcent, #ff7a1a);
  animation: bcoh-puls 900ms ease-in-out infinite;
}
/* --- zdraví vlevo dole --- */
.bcoh-hud__zdravi {
  position: absolute;
  left: var(--mezera-6, 32px);
  bottom: var(--mezera-6, 32px);
  display: flex;
  align-items: center;
  gap: var(--mezera-3, 12px);
}
.bcoh-hud__zdravi .bcoh-hud__popisek {
  margin-bottom: 0;
}
.bcoh-hud__linka {
  display: block;
  width: 148px;
  height: 2px;
  background: rgba(216, 221, 214, 0.18);
  /* --barva-text s alfou */
}
.bcoh-hud__linka-vypln {
  display: block;
  width: var(--bcoh-zdravi, 100%);
  height: 100%;
  background: var(--barva-text, #d8ddd6);
  transition: width var(--trvani-stredni, 240ms) ease, background-color var(--trvani-stredni, 240ms) ease;
}
/* JS třída - pod 30 procenty zdraví */
.bcoh-hud__linka-vypln.je-kriticke {
  background: var(--barva-rec, #e0332b);
}
/* --- munice vpravo dole --- */
.bcoh-hud__munice {
  position: absolute;
  right: var(--mezera-6, 32px);
  bottom: var(--mezera-7, 48px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--mezera-2, 8px);
  text-align: right;
}
.bcoh-hud__zbran {
  display: flex;
  align-items: center;
  gap: var(--mezera-2, 8px);
}
.bcoh-hud__ikona {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-hud__nazev-zbrane {
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-hud__naboje {
  display: flex;
  align-items: baseline;
  gap: var(--mezera-1, 4px);
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.8);
}
.bcoh-hud__zasobnik {
  font-size: calc(var(--meritko-textu, 1) * clamp(1.6rem, 3.2vw, 2.4rem));
  font-weight: 500;
  line-height: 1;
  min-width: 2ch;
  transition: color var(--trvani-rychle, 120ms) linear;
}
/* JS třída - málo nábojů v zásobníku */
.bcoh-hud__zasobnik.je-malo {
  color: var(--barva-akcent, #ff7a1a);
}
.bcoh-hud__lomitko,
.bcoh-hud__zasoba {
  font-size: calc(var(--meritko-textu, 1) * 0.85rem);
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-hud__sloty {
  display: flex;
  gap: var(--mezera-1, 4px);
}
.bcoh-hud__slot {
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--barva-okraj, rgba(200, 210, 200, 0.18));
  font-size: calc(var(--meritko-textu, 1) * 0.62rem);
  color: var(--barva-text-tlum, #8a938c);
  transition: border-color var(--trvani-rychle, 120ms) linear, background-color var(--trvani-rychle, 120ms) linear, color var(--trvani-rychle, 120ms) linear;
}
/* .is-active je jediný zdroj pravdy o aktivní zbrani */
.bcoh-hud__slot.is-active {
  border-color: var(--barva-akcent, #ff7a1a);
  background: var(--barva-akcent-tlum, rgba(255, 122, 26, 0.18));
  color: var(--barva-akcent, #ff7a1a);
}
/* ========================================================================
   3. VRSTVA OBRAZOVEK
   ======================================================================== */
.bcoh-obrazovky {
  position: fixed;
  inset: 0;
  z-index: var(--z-obrazovky, 40);
  pointer-events: none;
}
.bcoh-obrazovky .bc-overlay-kamera {
  opacity: 0;
  transition: opacity var(--trvani-stredni, 240ms) ease;
}
/* JS třída na kontejneru, když je nějaká obrazovka otevřená */
.bcoh-obrazovky.je-menu .bc-overlay-kamera {
  opacity: 1;
}
/* Totéž bez JS, když prohlížeč umí :has */
.bcoh-obrazovky:has(.bcoh-obrazovka:not(.je-skryty)) .bc-overlay-kamera {
  opacity: 1;
}
.bcoh-obrazovka {
  pointer-events: auto;
  background: rgba(7, 9, 8, 0.82);
  /* --barva-pozadi s alfou */
  -webkit-backdrop-filter: blur(6px) saturate(115%);
  backdrop-filter: blur(6px) saturate(115%);
}
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .bcoh-obrazovka {
    background: rgba(7, 9, 8, 0.9399999999999999);
  }
}
/* JS třída - krátký střih se zrnem, když není k dispozici GSAP */
.bcoh-obrazovka.je-prichod {
  animation: bcoh-strih 200ms steps(3, end);
}
/* Vypnuté střihy z pole Střihy mezi obrazovkami */
.bcoh[data-bcoh-prechody="0"] .bcoh-obrazovka.je-prichod {
  animation: none;
}
.bcoh-obrazovky .bcoh-obrazovka__obsah--siroky {
  max-width: 920px;
}
.bcoh-skupina__nadpis {
  display: flex;
  align-items: center;
  gap: var(--mezera-2, 8px);
  margin: var(--mezera-5, 24px) 0 var(--mezera-3, 12px);
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-tlacitka {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mezera-3, 12px);
  margin-top: var(--mezera-6, 32px);
}
/* Tlačítka nesou ikonu i popisek, proto je řádek uvnitř flexem. */
.bcoh-tlacitka .bc-tlacitko {
  display: inline-flex;
  align-items: center;
  gap: var(--mezera-2, 8px);
  white-space: nowrap;
  cursor: pointer;
}
/* Přepínač (celá obrazovka, ztlumení) drží zapnutý stav okrajem a plným
   textem. Akcent zůstává hlavnímu tlačítku, na obrazovce je jen jeden. */
.bcoh-tlacitka .bc-tlacitko[aria-pressed="true"] {
  border-color: var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
  color: var(--barva-text, #d8ddd6);
}
.bcoh-navod-ios {
  margin: var(--mezera-3, 12px) 0 0;
  max-width: 34ch;
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: var(--barva-text-tlum, #8a938c);
}
/* Jednořádková odpověď na kliknutí, které nemá vlastní obrazovku:
   odmítnutá celá obrazovka, nedostupný asistent, nespustitelný zápas. */
.bcoh-hlaska {
  margin: var(--mezera-3, 12px) 0 0;
  max-width: 46ch;
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  line-height: 1.5;
  letter-spacing: 0.1em;
  color: var(--barva-text-tlum, #8a938c);
}
/* ========================================================================
   4. TITULNÍ OBRAZOVKA
   ======================================================================== */
.bcoh-obrazovka--titul {
  background: var(--barva-pozadi, #070908);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  overflow: hidden;
}
.bcoh-obrazovka--titul::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to top, rgba(7, 9, 8, 0.9399999999999999) 0%, rgba(7, 9, 8, 0.62) 42%, rgba(7, 9, 8, 0.08) 78%);
}
.bcoh-titul__obrazek {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.bodycam_arena_obrazovky_a_hud_titulni_obrazek__img,
.bodycam_arena_obrazovky_a_hud_titulni_obrazek__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(0.55) contrast(1.08) brightness(0.82);
  animation: bcoh-kenburns 32s ease-in-out infinite alternate;
}
.bcoh-titul__obrazek::after {
  content: "";
  position: absolute;
  inset: -2%;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 122, 26, 0.1), rgba(255, 122, 26, 0) 34%);
  mix-blend-mode: screen;
  animation: bcoh-glitch 7s steps(1, end) infinite;
}
/* Navržená náhrada, dokud v poli není obrázek: světlo, zrno, skenování. */
.bcoh-titul__nahrada {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: radial-gradient(120% 90% at 18% 88%, rgba(255, 122, 26, 0.16), rgba(255, 122, 26, 0) 58%), radial-gradient(90% 70% at 78% 12%, rgba(120, 150, 130, 0.16), rgba(120, 150, 130, 0) 62%), repeating-linear-gradient(0deg, rgba(216, 221, 214, 0.035) 0 1px, rgba(216, 221, 214, 0) 1px 4px), var(--barva-pozadi, #070908);
}
.bcoh-titul__nahrada::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22160%22 height=%22160%22%3E%3Cfilter id=%22z%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.9%22 numOctaves=%222%22/%3E%3C/filter%3E%3Crect width=%22160%22 height=%22160%22 filter=%22url(%23z)%22/%3E%3C/svg%3E');
  background-repeat: repeat;
  opacity: 0.05;
}
.bcoh-titul__razitko {
  position: absolute;
  top: var(--mezera-5, 24px);
  right: var(--mezera-6, 32px);
  z-index: 2;
  display: flex;
  align-items: center;
  gap: var(--mezera-2, 8px);
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.7rem);
  letter-spacing: 0.14em;
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-titul__razitko .bcoh-hud__rec {
  position: static;
}
.bcoh-obrazovky .bcoh-titul__obsah {
  position: relative;
  z-index: 2;
  max-width: 720px;
}
.bcoh-titul__obsah .bodycam_arena_obrazovky_a_hud_nazev_hry {
  font-size: calc(var(--meritko-textu, 1) * clamp(2.6rem, 8.5vw, 6rem));
  line-height: 0.9399999999999999;
  text-wrap: balance;
}
.bcoh-titul__radek {
  display: flex;
  align-items: baseline;
  gap: var(--mezera-3, 12px);
  margin-top: var(--mezera-5, 24px);
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.72rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.bcoh-titul__popisek {
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-titul__hodnota {
  color: var(--barva-text, #d8ddd6);
  font-variant-numeric: tabular-nums;
}
/* ========================================================================
   5. JAK HRÁT
   ======================================================================== */
.bcoh-napoveda__text {
  margin: 0 0 var(--mezera-5, 24px);
  max-width: 60ch;
  font-family: var(--font-text, 'IBM Plex Sans', sans-serif);
  font-size: calc(var(--meritko-textu, 1) * 1rem);
  line-height: 1.55;
  color: var(--barva-text, #d8ddd6);
  text-wrap: pretty;
}
.bcoh-napoveda__sloupce {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mezera-6, 32px);
}
.bcoh-napoveda__sloupec {
  min-width: 0;
}
.bcoh-napoveda__sloupec .bcoh-skupina__nadpis {
  margin-top: 0;
}
.bcoh-zbrane {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mezera-2, 8px);
}
/* Položky doplňuje JS ze zbrane.seznam() */
.bcoh-zbrane__polozka {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--mezera-3, 12px);
  padding: var(--mezera-3, 12px) 0;
  border-bottom: 1px solid var(--barva-okraj, rgba(200, 210, 200, 0.18));
}
.bcoh-zbrane__nazev {
  font-family: var(--font-nadpis, 'Chakra Petch', sans-serif);
  font-weight: 600;
  font-size: calc(var(--meritko-textu, 1) * 1rem);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--barva-text, #d8ddd6);
}
.bcoh-zbrane__param {
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.72rem);
  letter-spacing: 0.14em;
  color: var(--barva-text-tlum, #8a938c);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
/* ========================================================================
   6. NASTAVENÍ A PŘEMAPOVÁNÍ KLÁVES
   ======================================================================== */
.bcoh-klavesy {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mezera-1, 4px);
}
.bcoh-klavesy .bc-pole__vstup {
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  min-width: 8ch;
  text-align: center;
}
.bcoh-klavesy .bc-pole__vstup:hover,
.bcoh-klavesy .bc-pole__vstup:focus-visible {
  outline: none;
  border-color: var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
  color: var(--barva-text, #d8ddd6);
}
/* JS třída - tlačítko čeká na stisk nové klávesy */
.bcoh-klavesy .bc-pole__vstup.bcoh-ceka {
  border-color: var(--barva-akcent, #ff7a1a);
  color: var(--barva-akcent, #ff7a1a);
  animation: bcoh-puls 900ms ease-in-out infinite;
}
/* ========================================================================
   7. PAUZA
   ======================================================================== */
.bcoh-obrazovka--pauza {
  background: rgba(7, 9, 8, 0.58);
  /* zamrzlý obraz hry pod tmavým sklem */
  -webkit-backdrop-filter: blur(12px) saturate(105%);
  backdrop-filter: blur(12px) saturate(105%);
}
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .bcoh-obrazovka--pauza {
    background: rgba(7, 9, 8, 0.9);
  }
}
/* ========================================================================
   8. TABULKA KOLA A KONEC ZÁPASU
   ======================================================================== */
.bcoh-tabulka {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mezera-1, 4px);
}
/* Řádky doplňuje JS z události kolo */
.bcoh-tabulka__radek {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--mezera-3, 12px);
  padding: var(--mezera-2, 8px) 0;
  border-bottom: 1px solid var(--barva-okraj, rgba(200, 210, 200, 0.18));
}
.bcoh-tabulka__jmeno {
  font-family: var(--font-text, 'IBM Plex Sans', sans-serif);
  font-size: calc(var(--meritko-textu, 1) * 0.95rem);
  color: var(--barva-text, #d8ddd6);
}
.bcoh-tabulka__hodnota {
  font-family: var(--font-data, 'IBM Plex Mono', monospace);
  font-size: calc(var(--meritko-textu, 1) * 0.85rem);
  letter-spacing: 0.14em;
  font-variant-numeric: tabular-nums;
  color: var(--barva-text-tlum, #8a938c);
}
.bcoh-tabulka__radek.is-active .bcoh-tabulka__jmeno,
.bcoh-tabulka__radek.is-active .bcoh-tabulka__hodnota {
  color: var(--barva-akcent, #ff7a1a);
}
.bcoh-statistiky {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--mezera-1, 4px);
}
.bcoh-rekord {
  display: inline-block;
  margin: 0 0 var(--mezera-4, 16px);
  padding: var(--mezera-1, 4px) var(--mezera-3, 12px);
  border: 1px solid var(--barva-akcent, #ff7a1a);
  background: var(--barva-akcent-tlum, rgba(255, 122, 26, 0.18));
  color: var(--barva-akcent, #ff7a1a);
  font-size: calc(var(--meritko-textu, 1) * 0.72rem);
  letter-spacing: 0.14em;
}
/* ========================================================================
   9. DOTYKOVÉ OVLÁDÁNÍ
   ======================================================================== */
.bcoh-dotyk {
  position: fixed;
  inset: 0;
  z-index: 30;
  /* nad HUD (20), pod obrazovkami (40) */
  pointer-events: none;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.bcoh-dotyk__zona {
  position: absolute;
  pointer-events: auto;
  touch-action: none;
}
.bcoh-dotyk__zona--pohyb {
  left: 0;
  bottom: 0;
  width: 50%;
  height: 58%;
}
.bcoh-dotyk__zona--rozhled {
  right: 0;
  top: 0;
  width: 50%;
  height: 100%;
}
/* Polohu joysticku nastavuje JS přes left a top podle místa dotyku. */
.bcoh-dotyk__joystick {
  position: absolute;
  width: 132px;
  height: 132px;
  margin: -66px 0 0 -66px;
  border: 1px solid var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
  border-radius: 50%;
  background: rgba(18, 22, 20, 0.42);
  /* --barva-plocha, slabší */
  pointer-events: none;
}
.bcoh-dotyk__palec {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 56px;
  height: 56px;
  margin: -28px 0 0 -28px;
  border: 1px solid var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
  border-radius: 50%;
  background: var(--barva-plocha, rgba(18, 22, 20, 0.72));
  transform: translate(var(--bcoh-palec-x, 0px), var(--bcoh-palec-y, 0px));
}
.bcoh-dotyk__akce {
  position: absolute;
  right: var(--mezera-4, 16px);
  bottom: var(--mezera-4, 16px);
  display: grid;
  grid-template-columns: repeat(3, auto);
  justify-items: end;
  align-items: end;
  gap: var(--mezera-3, 12px);
  pointer-events: none;
}
.bcoh-dotyk .bcoh-dotyk__tlacitko,
.bcoh-dotyk .bcoh-dotyk__tlacitko--strelba,
.bcoh-dotyk .bcoh-dotyk__pauza {
  pointer-events: auto;
  touch-action: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--barva-plocha, rgba(18, 22, 20, 0.72));
  border: 1px solid var(--barva-okraj-silny, rgba(200, 210, 200, 0.42));
  color: var(--barva-text, #d8ddd6);
}
.bcoh-dotyk .bcoh-dotyk__tlacitko {
  width: 56px;
  height: 56px;
  padding: 0;
}
.bcoh-dotyk .bcoh-dotyk__tlacitko--strelba {
  grid-column: 3;
  grid-row: 1 / span 2;
  width: 88px;
  height: 88px;
  padding: 0;
  border-color: var(--barva-akcent, #ff7a1a);
  background: var(--barva-akcent-tlum, rgba(255, 122, 26, 0.18));
  color: var(--barva-akcent, #ff7a1a);
}
.bcoh-dotyk .bcoh-dotyk__tlacitko svg,
.bcoh-dotyk .bcoh-dotyk__tlacitko--strelba svg,
.bcoh-dotyk .bcoh-dotyk__pauza svg {
  width: 24px;
  height: 24px;
}
.bcoh-dotyk .bcoh-dotyk__tlacitko .bc-data {
  font-size: calc(var(--meritko-textu, 1) * 0.62rem);
  letter-spacing: 0.1em;
}
/* JS třída - prst drží tlačítko */
.bcoh-dotyk .bcoh-dotyk__tlacitko.is-active,
.bcoh-dotyk .bcoh-dotyk__tlacitko--strelba.is-active {
  border-color: var(--barva-akcent, #ff7a1a);
  background: var(--barva-akcent-tlum, rgba(255, 122, 26, 0.18));
  color: var(--barva-akcent, #ff7a1a);
}
.bcoh-dotyk .bcoh-dotyk__pauza {
  position: absolute;
  top: var(--mezera-4, 16px);
  right: var(--mezera-4, 16px);
  width: 44px;
  height: 44px;
  padding: 0;
}
/* ========================================================================
   10. VÝZVA K OTOČENÍ TELEFONU
   ======================================================================== */
.bcoh-otoc {
  display: none;
}
/* JS třída - přidává se jen ve stavu hra */
@media (max-width: 560px) and (orientation: portrait) {
  .bcoh-otoc.je-videt {
    position: fixed;
    left: var(--mezera-4, 16px);
    right: var(--mezera-4, 16px);
    bottom: var(--mezera-4, 16px);
    z-index: 31;
    display: block;
    pointer-events: none;
  }
}
/* ========================================================================
   11. RESPONZIVITA
   ======================================================================== */
@media (min-width: 760px) {
  .bcoh-napoveda__sloupce {
    grid-template-columns: 1fr 1fr;
  }
  .bcoh-statistiky {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--mezera-5, 24px);
  }
  .bcoh-klavesy {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--mezera-5, 24px);
  }
}
@media (max-width: 900px) {
  .bcoh-hud__roh--vlevo-nahore,
  .bcoh-hud__horni,
  .bcoh-hud__zdravi {
    left: var(--mezera-5, 24px);
  }
  .bcoh-hud__killfeed,
  .bcoh-hud__munice,
  .bcoh-hud__roh--vpravo-dole {
    right: var(--mezera-5, 24px);
  }
}
@media (max-width: 560px) {
  .bcoh-hud__roh--vlevo-nahore,
  .bcoh-hud__killfeed,
  .bcoh-titul__razitko {
    top: var(--mezera-4, 16px);
  }
  .bcoh-hud__roh--vlevo-nahore,
  .bcoh-hud__horni,
  .bcoh-hud__zdravi {
    left: var(--mezera-4, 16px);
  }
  .bcoh-hud__killfeed,
  .bcoh-hud__munice,
  .bcoh-hud__roh--vpravo-dole,
  .bcoh-titul__razitko {
    right: var(--mezera-4, 16px);
  }
  .bcoh-hud__horni {
    top: calc(var(--mezera-4, 16px) + var(--mezera-6, 32px));
    gap: var(--mezera-5, 24px);
  }
  .bcoh-hud__zdravi {
    bottom: var(--mezera-5, 24px);
  }
  .bcoh-hud__linka {
    width: 84px;
  }
  .bcoh-hud__munice {
    bottom: calc(var(--mezera-6, 32px) + var(--mezera-5, 24px));
  }
  .bcoh-hud__cislo {
    font-size: calc(var(--meritko-textu, 1) * 1rem);
  }
  .bcoh-hud__zasobnik {
    font-size: calc(var(--meritko-textu, 1) * 1.5rem);
  }
  .bcoh-hud__smer {
    width: 190px;
    height: 190px;
    margin: -95px 0 0 -95px;
  }
  .bcoh-dotyk .bcoh-dotyk__tlacitko {
    width: 52px;
    height: 52px;
  }
  .bcoh-dotyk .bcoh-dotyk__tlacitko--strelba {
    width: 76px;
    height: 76px;
  }
}
/* Telefon na šířku: HUD stažený do rohů, menší čísla, nižší joystick. */
@media (max-height: 520px) and (orientation: landscape) {
  .bcoh-hud__horni {
    top: calc(var(--mezera-3, 12px) + var(--mezera-6, 32px));
    gap: var(--mezera-5, 24px);
  }
  .bcoh-hud__roh--vlevo-nahore,
  .bcoh-hud__killfeed {
    top: var(--mezera-3, 12px);
  }
  .bcoh-hud__zdravi,
  .bcoh-hud__roh--vpravo-dole {
    bottom: var(--mezera-3, 12px);
  }
  .bcoh-hud__munice {
    bottom: calc(var(--mezera-5, 24px) + var(--mezera-4, 16px));
  }
  .bcoh-hud__cislo {
    font-size: calc(var(--meritko-textu, 1) * 0.9rem);
  }
  .bcoh-hud__zasobnik {
    font-size: calc(var(--meritko-textu, 1) * 1.3rem);
  }
  .bcoh-dotyk__joystick {
    width: 108px;
    height: 108px;
    margin: -54px 0 0 -54px;
  }
}
/* ========================================================================
   12. POHYB
   ======================================================================== */
@keyframes bcoh-rec {
  0%,
  45% {
    opacity: 1;
  }
  55%,
  100% {
    opacity: 0.15;
  }
}
@keyframes bcoh-puls {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
}
@keyframes bcoh-zasah {
  0% {
    opacity: 1;
    transform: scale(0.7);
  }
  60% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.15);
  }
}
@keyframes bcoh-prichod-vpravo {
  0% {
    opacity: 0;
    transform: translateX(12px);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
@keyframes bcoh-strih {
  0% {
    opacity: 0;
    filter: contrast(1.6) brightness(1.4);
  }
  50% {
    opacity: 1;
    filter: contrast(1.2) brightness(0.85);
  }
  100% {
    opacity: 1;
    filter: none;
  }
}
@keyframes bcoh-kenburns {
  0% {
    transform: scale(1.06) translate3d(0, 0, 0);
  }
  100% {
    transform: scale(1.16) translate3d(-2%, -1.5%, 0);
  }
}
@keyframes bcoh-glitch {
  0%,
  92%,
  100% {
    opacity: 0;
    transform: translateX(0);
  }
  93% {
    opacity: 1;
    transform: translateX(-6px);
  }
  94% {
    opacity: 0.5;
    transform: translateX(5px);
  }
  95% {
    opacity: 1;
    transform: translateX(-2px);
  }
  96% {
    opacity: 0;
    transform: translateX(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .bcoh-hud__rec,
  .bcoh-hud__varovani-text,
  .bcoh-hud__zaznam,
  .bcoh-hud__kriz,
  .bcoh-obrazovka.je-prichod,
  .bcoh-klavesy .bc-pole__vstup.bcoh-ceka,
  .bcoh-titul__obrazek::after,
  .bodycam_arena_obrazovky_a_hud_titulni_obrazek__img,
  .bodycam_arena_obrazovky_a_hud_titulni_obrazek__video {
    animation: none;
  }
  .bcoh-hud__cara,
  .bcoh-hud__oblouk,
  .bcoh-hud__linka-vypln,
  .bcoh-obrazovky .bc-overlay-kamera {
    transition: none;
  }
  .bcoh-titul__obrazek::after {
    opacity: 0;
  }
}