/* Hra „Kolik Brna znáte?" */
.game{display:grid;grid-template-columns:minmax(340px,.78fr) minmax(0,1.22fr);min-height:calc(100vh - 92px);background:var(--ink);color:#fff}
.game-panel{padding:clamp(48px,6vw,100px) clamp(24px,5vw,84px);display:flex;flex-direction:column;justify-content:center;min-width:0}
.game-screen[hidden]{display:none!important}
.game h1{font:500 clamp(44px,5vw,78px)/1.02 var(--display);letter-spacing:-.03em;margin:0 0 28px}
.game h1 em{font-style:normal;color:var(--brass)}
.game-lead{max-width:500px;color:#b7c2c0;font-size:17px;line-height:1.65;margin:0 0 34px}
.game-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:26px;max-width:620px}
.game-mode-daily{grid-column:1/-1}
.game-mode{display:flex;flex-direction:column;gap:4px;align-items:flex-start;padding:16px 18px;background:transparent;border:1px solid #ffffff2e;color:#fff;cursor:pointer;text-align:left;transition:border-color .2s,background .2s}
.game-mode strong{font:500 20px var(--display)}
.game-mode span{font-size:12px;color:#9fadab}
.game-mode:hover{border-color:#ffffff66}
.game-mode.is-active{border-color:var(--brass);background:#c6a56a14}
.game-mode.is-active span{color:var(--brass)}
.game-start{align-self:flex-start;font-size:13px;padding:18px 28px}
.game-start span,.game-next span,.game-result-actions .button span{margin-left:10px}
.game-best{margin:22px 0 0;font-size:13px;color:#9fadab}
.game-best strong{color:var(--brass);font-weight:600}

/* HUD */
.game-hud{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff25;border-bottom:1px solid #ffffff25;margin-bottom:38px}
.game-hud div{padding:14px 0}
.game-hud div+div{padding-left:18px;border-left:1px solid #ffffff18}
.game-hud span,.game-prompt-label,.game-fact span,.game-stage-note{font:600 10px var(--mono);letter-spacing:.13em;text-transform:uppercase;color:#8f9e9c}
.game-hud strong{display:block;font:500 26px var(--display);margin-top:3px;font-variant-numeric:tabular-nums}
.game-hud strong.bump{animation:game-bump .45s ease}
.game-prompt strong{display:block;font:500 clamp(40px,4.4vw,66px)/1.05 var(--display);letter-spacing:-.02em;color:var(--brass);margin:10px 0 22px;min-height:1.05em}
.game-timer{height:3px;background:#ffffff1c;overflow:hidden}
.game-timer i{display:block;height:100%;width:100%;background:var(--brass);transform-origin:left;transform:scaleX(1)}
.game-timer.is-running i{animation:game-timer var(--game-time,15s) linear forwards}
.game-timer.is-low i{background:#d9795a}
.game-feedback{margin-top:30px;animation:game-rise .35s ease}
.game-verdict{font:500 30px/1.1 var(--display);margin:0 0 6px}
.game-verdict.is-hit{color:#fff}
.game-points{margin:0 0 22px;color:var(--brass);font-weight:500;font-size:15px}
.game-fact{padding:18px 0 4px;border-top:1px solid #ffffff22;margin-bottom:24px}
.game-fact p{margin:8px 0 0;color:#b7c2c0;font-size:14.5px;line-height:1.6;max-width:520px}
.game-next{font-size:13px}

/* Výsledek */
.game-rank{font:500 clamp(40px,4.4vw,64px)/1.02 var(--display);letter-spacing:-.02em;color:var(--brass);margin:0 0 10px}
.game-final{margin:0 0 14px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.game-final strong{font:500 64px/1 var(--display);font-variant-numeric:tabular-nums}
.game-final span{color:#9fadab;font-size:15px}
.game-rank-note{color:#c3ccca;font-size:17px;line-height:1.6;max-width:500px;margin:0 0 24px}
.game-grid{font-size:20px;letter-spacing:3px;line-height:1.5;margin:0 0 10px;max-width:420px;word-break:break-all}
.game-stats{color:#8f9e9c;font-size:13px;margin:0 0 30px}
.game-result-actions{display:flex;gap:12px;flex-wrap:wrap}
.game-ghost{background:transparent;color:#fff;border:1px solid #ffffff44}
.game-ghost:hover{border-color:#fff}
.game-share-status{min-height:20px;margin:14px 0 0;font-size:13px;color:var(--brass)}

/* Mapa */
.game-stage{position:relative;background:var(--brass);overflow:hidden;min-width:0}
.game-stage:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,#ffffff26,transparent 58%);pointer-events:none}
.game-stage-note{position:absolute;z-index:2;top:22px;left:26px;margin:0;color:var(--ink);display:flex;align-items:center;gap:10px}
.game-stage-note i{display:inline-block;width:9px;height:9px;border:1px solid var(--ink);transform:rotate(45deg)}
.game-stage-source{position:absolute;left:26px;bottom:16px;margin:0;color:#0c192199;font-size:11px}
#game-map{position:absolute;inset:58px 24px 44px;width:calc(100% - 48px);height:calc(100% - 102px);overflow:visible;touch-action:manipulation}
.gd{fill:#0c19210f;stroke:var(--ink);stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-linejoin:round;transition:fill .2s ease}
.game[data-state="play"] .gd{cursor:crosshair}
.game[data-state="play"] .gd:hover,.game[data-state="play"] .gd:focus-visible{fill:#0c192138;outline:none}
.gd.is-found{fill:#0c192128}
.gd.is-hit{fill:var(--ink)!important}
.gd.is-miss{fill:#a8472e!important}
.gd.is-target{fill:var(--ink)!important;animation:game-pulse 1s ease-in-out 3}
.game[data-state="intro"] .gd{animation:game-wave 2.4s ease-in-out infinite;animation-delay:calc(var(--i) * 70ms)}
.game-lines line{stroke:var(--ink);stroke-width:2;stroke-dasharray:6 5;vector-effect:non-scaling-stroke}
.game-lines circle{fill:var(--ink)}
.gl{pointer-events:none;font:600 13px var(--body);fill:var(--ink);paint-order:stroke;stroke:#dcc79b;stroke-width:4px;stroke-linejoin:round;text-anchor:middle}
.gl.is-strong{fill:#f1e4c5;stroke:var(--ink);font-size:16px}
.gl.is-miss{fill:#fff;stroke:#a8472e}
.game-splash{position:absolute;pointer-events:none;font:600 20px var(--display);color:var(--ink);transform:translate(-50%,-50%);animation:game-float 1s ease forwards;z-index:3;white-space:nowrap}
.game-splash.is-miss{color:#7a2f1c}

/* CTA pod hrou */
.game-cta{display:grid;grid-template-columns:1fr 1fr;gap:8vw;padding:clamp(80px,10vw,140px) clamp(24px,8vw,140px);background:var(--paper);align-items:end}
.game-cta h2{font:500 clamp(40px,4.6vw,68px)/1.04 var(--display);letter-spacing:-.025em;margin:0}
.game-cta h2 em{font-style:normal;color:#8a6c35}
.game-cta p:not(.section-label){font-size:17px;max-width:560px;margin:0 0 30px;color:#3d4a4c}
.game-cta-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap}

@keyframes game-timer{to{transform:scaleX(0)}}
@keyframes game-bump{40%{transform:scale(1.18);color:var(--brass)}}
@keyframes game-rise{from{opacity:0;transform:translateY(10px)}}
@keyframes game-pulse{50%{fill:#0c192155}}
@keyframes game-wave{0%,100%{fill:#0c19210f}50%{fill:#0c192126}}
@keyframes game-sheet{from{transform:translateY(100%)}}
@keyframes game-float{from{opacity:1;transform:translate(-50%,-50%)}to{opacity:0;transform:translate(-50%,-150%)}}

@media(max-width:1000px){
  .game{grid-template-columns:1fr;min-height:0}
  .game-panel{padding:44px 22px 34px}
  .game[data-state="play"] .game-panel{padding:12px 16px 0;position:sticky;top:0;z-index:5;background:var(--ink)}
  .game-stage{min-height:min(100vw,600px)}
  #game-map{inset:40px 6px 30px;width:calc(100% - 12px);height:calc(100% - 70px)}
  .game-stage-note{top:14px;left:16px}.game-stage-source{left:16px;bottom:10px;font-size:10px}
  .game-hud{margin-bottom:8px;border-top:0}.game-hud div{padding:4px 0 6px;display:flex;align-items:baseline;gap:8px}.game-hud div+div{padding-left:12px}.game-hud strong{font-size:18px;margin:0}.game-hud span{font-size:9px}
  .game-prompt{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
  .game-prompt-label{flex:0 0 auto}
  .game-prompt strong{font-size:30px;margin:0 0 10px;min-height:0}
  .game-feedback{position:fixed;z-index:20;left:0;right:0;bottom:0;margin:0;padding:16px 18px calc(16px + env(safe-area-inset-bottom));background:var(--ink);border-top:3px solid var(--brass);box-shadow:0 -12px 40px #0006;display:grid;grid-template-columns:1fr auto;column-gap:14px;align-items:center;animation:game-sheet .3s ease}
  .game-feedback[hidden]{display:none}
  .game-verdict{font-size:21px;grid-column:1}.game-points{grid-column:1;margin:2px 0 0;font-size:13px}
  .game-next{grid-column:2;grid-row:1/3;padding:15px 16px;white-space:nowrap}
  .game-fact{grid-column:1/-1;padding:10px 0 0;margin:12px 0 0}
  .game-fact p{font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .gl{font-size:24px;stroke-width:6px}.gl.is-strong{font-size:30px}
  .game-cta{grid-template-columns:1fr}
  .gl{font-size:24px;stroke-width:6px}.gl.is-strong{font-size:30px}
}
@media(min-width:760px){.game-modes{grid-template-columns:1fr 1fr 1.08fr}.game-mode-daily{grid-column:auto}}
@media(max-width:600px){
  .game h1{font-size:44px}
  .game-modes{grid-template-columns:1fr 1fr}
  .game-final strong{font-size:52px}
  .game-cta{padding:70px 22px}
  .game-result-actions .button{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){
  .game[data-state="intro"] .gd,.gd.is-target,.game-hud strong.bump,.game-feedback,.game-splash{animation:none}
}