/* SLAVKOF_DIZAJN_MANUAL_v4.5.33_2026.11.10_KOPIA-040 | kópia pre: web designmanual.slavkof.sk a interná kópia | vlastník SLAVKOF a.s. */
/* ===== Hra a pohyb značky ===== */
.hrastage{position:relative; background:var(--panel); border:1px solid var(--line); border-radius:3px; overflow:hidden}
.hra-canvas{display:block; width:100%; height:auto; aspect-ratio:16/10; touch-action:none; cursor:pointer;
  -webkit-user-select:none; user-select:none; -webkit-touch-callout:none}
@media (max-width:620px){ .hra-canvas{aspect-ratio:4/5} }
.hra-canvas:focus-visible{outline:2px solid var(--emerald); outline-offset:-2px}
.hra-screen{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:1.4rem; background:#EFE5D9CC; color:#1B1B1B}
.hra-screen[hidden]{display:none}
.hra-screen h3{font-family:var(--serif); font-weight:500; font-size:clamp(1.1rem,3vw,1.6rem); line-height:1.2; margin:0 0 .4rem}
.hra-screen p{margin:0 0 .9rem; max-width:40ch; font-size:.88rem; color:var(--graphite)}
.hra-big{font-family:var(--serif); font-size:clamp(2rem,6vw,3rem); line-height:1; color:var(--emerald); margin:.2rem 0 .3rem}
.hra-best{margin:.9rem 0 0 !important; font-size:.78rem}
.hra-btn{font:inherit; font-weight:600; font-size:.85rem; padding:.55rem 1.4rem; border:0; border-radius:100px;
  background:var(--emerald); color:#FFFFFF; cursor:pointer}
.hra-btn:hover{background:var(--brown)}
.hra-btn:focus-visible{outline:2px solid var(--emerald); outline-offset:3px}
.rtab.lft th, .rtab.lft td{text-align:left; white-space:normal}