/* ============================================================
   KETTEN — a közös kétszemélyes sáv (js/ketten.js): ki jön, és hogy álltok. Csak tokenek.
   A sáv a képernyő tetején, a rendszergombok alatt; a kör vége panelben a két oszlop.
   ============================================================ */
#ktBar { position:fixed; left:50%; transform:translateX(-50%); top:calc(8px + env(safe-area-inset-top)); z-index:calc(var(--z-hud) + 3); pointer-events:none;
  display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; justify-content:center; max-width:min(96vw, 620px);
  background:var(--surface); border:var(--line-w) solid var(--line); border-radius:var(--r-pill); box-shadow:var(--soft-sm); padding:5px 12px; }
#ktBar.hidden { display:none; }
.ktP { display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-s); opacity:.55; }
.ktP.is-on { opacity:1; }
.ktHex { display:inline-grid; place-items:center; width:26px; height:26px; border:2.5px solid var(--line); border-radius:50%;
  background:var(--butter); font:400 16px/1 var(--display); }
.ktP.is-on .ktHex { background:var(--accent); }
.ktScore { font-size:var(--fs-m); }
.ktNow { font-weight:800; font-size:var(--fs-s); display:inline-flex; align-items:center; gap:4px; }
.ktNow .pic { width:18px; height:18px; }
.ktFinals { display:flex; gap:var(--sp-2); justify-content:center; width:100%; }
.ktFinal { flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 6px;
  background:var(--bg); border:var(--line-w) solid var(--line); border-radius:var(--r-m); }
.ktFinal.is-top { background:var(--butter); box-shadow:var(--soft-sm); }
.ktFinal .ds-num { font-size:var(--fs-xl); } .ktFinal small { color:var(--ink-soft); }
/* a 2D rétegek tetején helyet csinálunk a sávnak (a saját fejlécük ne kerüljön alá) */
body.ketten #ttLayer, body.ketten #pmLayer { padding-top:calc(60px + env(safe-area-inset-top)); }
body.ketten #impTop { margin-top:104px; }
/* keskeny kijelzőn: a rendszergombok ALATT, egy sorban, név nélkül (a szám és a „ki jön" elég) */
@media (max-width:700px){
  #ktBar { top:calc(52px + env(safe-area-inset-top)); font-size:var(--fs-xs); padding:4px 10px; flex-wrap:nowrap; }
  .ktP b { display:none; }
  body.ketten #ttLayer, body.ketten #pmLayer { padding-top:calc(102px + env(safe-area-inset-top)); }
  body.ketten #impTop { margin-top:150px; }
}