/* ===========================================================
   ef-de s. r. o. — minihra (samostatná stránka)
   Dopĺňa styles.css, preberá jeho premenné a typografiu.
   =========================================================== */

.back-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);
  border-bottom:1px solid rgba(13,15,18,.2);padding-bottom:5px;
  transition:color .3s ease,border-color .3s ease;
}
.back-link:hover{color:var(--accent);border-color:var(--accent);}

.game-page{padding:clamp(48px,8vw,84px) var(--pad-x) clamp(70px,10vw,120px);}

.game-header{max-width:560px;margin:0 auto 32px;}
.game-header .mono-label{margin-bottom:16px;}
.game-header h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(30px,5.4vw,44px);line-height:1.05;letter-spacing:-.025em;margin:0 0 14px;
}
.game-header p{font-size:15.5px;line-height:1.6;color:var(--ink-2);margin:0;max-width:52ch;}

.game-hud{
  max-width:560px;margin:0 auto 12px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
}
.game-hud strong{color:var(--ink);font-weight:500;}

.game-wrap{
  position:relative;max-width:560px;margin:0 auto;
  border:1px solid var(--line);background:var(--paper-2);
  overflow:hidden;touch-action:none;
}
#gameCanvas{
  display:block;width:100%;height:auto;
  image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;
  touch-action:none;cursor:crosshair;
}

.game-overlay{
  position:absolute;inset:0;z-index:2;
  display:flex;align-items:center;justify-content:center;
  background:rgba(251,251,250,.95);backdrop-filter:blur(3px);
  padding:24px;text-align:center;
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.game-overlay.is-visible{opacity:1;pointer-events:auto;}
.game-overlay__inner{max-width:320px;}
.game-overlay .mono-label{justify-content:center;margin-bottom:10px;}
.game-overlay h2{
  font-family:var(--serif);font-weight:400;font-size:26px;letter-spacing:-.02em;margin:0 0 10px;
}
.game-overlay p{font-size:14px;line-height:1.55;color:var(--ink-2);margin:0 0 18px;}
.game-overlay .btn-cta{display:inline-flex;margin-bottom:12px;}
.game-overlay .back-link{display:inline-flex;margin-top:2px;}

.game-footnote{
  max-width:560px;margin:18px auto 0;
  font-size:12.5px;line-height:1.5;color:var(--muted);text-align:center;
}

@media (max-width:640px){
  .game-header,.game-hud,.game-wrap,.game-footnote{max-width:100%;}
}