/* Puzzlownia - wspolny flow 5 klasycznych gier, 2026-09-28.
   Cel: identyczna skala 3-2-1, spojne intro, karty poziomow/przejsc i finaly.
   Nie zmienia fizyki ani zasad gier. */

/* ---------- 3, 2, 1, START - ten sam rozmiar w calej piatce ---------- */
body.pz-game-page #countdown{
  box-sizing:border-box!important;
  padding:clamp(8px,2.2vw,22px)!important;
  overflow:hidden!important;
}
body.pz-game-page #countdown > img,
body.pz-game-page #countdown > .pz-uk-status-art,
body.pz-game-page #countdown > .pz-demontaz-status-art,
body.pz-game-page #countdown > .pz-od-status-art,
body.pz-game-page #countdown > .pz-od12-countdown-art,
body.pz-game-page #countdown > .pz-sp-status-art,
body.pz-game-page #countdown > .pz-mem-status-art{
  display:block!important;
  width:auto!important;
  max-width:min(72%,320px)!important;
  height:auto!important;
  max-height:min(25dvh,156px)!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:drop-shadow(0 12px 12px rgba(0,0,0,.18))!important;
  transform-origin:center!important;
}
@media(max-width:820px) and (orientation:portrait){
  body.pz-game-page #countdown > img,
  body.pz-game-page #countdown > .pz-uk-status-art,
  body.pz-game-page #countdown > .pz-demontaz-status-art,
  body.pz-game-page #countdown > .pz-od-status-art,
  body.pz-game-page #countdown > .pz-od12-countdown-art,
  body.pz-game-page #countdown > .pz-sp-status-art,
  body.pz-game-page #countdown > .pz-mem-status-art{
    width:auto!important;
    max-width:min(72%,320px)!important;
    max-height:min(25dvh,156px)!important;
  }
}

/* ---------- Wspolne intro ---------- */
.pz-flow-intro{
  position:absolute!important;
  inset:0!important;
  z-index:955!important;
  display:grid!important;
  place-items:center!important;
  padding:clamp(12px,3vw,30px)!important;
  background:rgba(250,247,240,.42)!important;
  backdrop-filter:blur(1px)!important;
  -webkit-backdrop-filter:blur(1px)!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
}
.pz-flow-intro[hidden],
.pz-flow-screen[hidden]{display:none!important;pointer-events:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
html[data-theme="dark"] .pz-flow-intro{background:rgba(12,15,18,.46)!important;}
.pz-flow-intro-card{
  box-sizing:border-box!important;
  width:min(88%,520px)!important;
  height:auto!important;
  min-height:min(340px,calc(100% - 24px))!important;
  max-height:calc(100% - 24px)!important;
  overflow:hidden!important;
  padding:clamp(18px,2.4vw,24px)!important;
  border:1px solid rgba(95,67,39,.18)!important;
  border-radius:20px!important;
  background:rgba(255,250,240,.96)!important;
  box-shadow:0 18px 42px rgba(38,27,14,.22)!important;
  color:#2c2925!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:8px!important;
  justify-content:flex-start!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
html[data-theme="dark"] .pz-flow-intro-card{
  background:rgba(27,31,35,.96)!important;
  border-color:rgba(255,255,255,.12)!important;
  color:#f4f0e9!important;
}
.pz-flow-intro-card > strong,
.pz-flow-intro-card > h2{
  margin:0!important;
  font-size:clamp(23px,2.7vw,29px)!important;
  line-height:1.1!important;
  font-weight:1000!important;
  color:#2c2925!important;
  letter-spacing:-.025em!important;
  text-shadow:none!important;
}
html[data-theme="dark"] .pz-flow-intro-card > strong,
html[data-theme="dark"] .pz-flow-intro-card > h2{color:#f4f0e9!important;}
.pz-flow-intro-card > p{
  margin:0!important;
  max-width:450px!important;
  font-size:clamp(14px,1.35vw,16px)!important;
  line-height:1.38!important;
  font-weight:650!important;
}
.pz-flow-signoff{
  display:flex!important;
  flex-direction:column!important;
  gap:1px!important;
  margin-top:2px!important;
  font-size:clamp(13px,1.4vw,16px)!important;
}
.pz-flow-signoff b{font-weight:1000!important;font-size:inherit!important;letter-spacing:normal!important;color:inherit!important;text-shadow:none!important;}
.pz-flow-signoff span{font-style:italic!important;font-weight:800!important;font-size:inherit!important;letter-spacing:normal!important;color:inherit!important;text-shadow:none!important;}
.pz-flow-ready{
  width:min(100%,410px)!important;
  margin-top:auto!important;
  padding-top:10px!important;
  border-top:1px solid rgba(80,55,28,.12)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(12px,2.2vw,24px)!important;
  pointer-events:none!important;
}
html[data-theme="dark"] .pz-flow-ready{border-top-color:rgba(255,255,255,.10)!important;}
.pz-flow-ready img{
  display:block!important;
  width:100%!important;
  max-height:86px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.18))!important;
}
.pz-flow-click-note{
  margin:0!important;
  font-size:clamp(10px,1.1vw,12px)!important;
  line-height:1.25!important;
  font-weight:850!important;
  color:#6a6258!important;
}
html[data-theme="dark"] .pz-flow-click-note{color:#b8c0c7!important;}
.pz-flow-intro-close{cursor:pointer!important;}


/* ---------- Wybór obrazu przed startem ---------- */
.pz-flow-image-tools{
  width:min(100%,360px)!important;
  margin:1px auto 0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:4px!important;
}
.pz-flow-image-tools__title{
  margin:0!important;
  font-size:clamp(10px,1vw,12px)!important;
  line-height:1.1!important;
  font-weight:1000!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  color:#5e554b!important;
}
html[data-theme="dark"] .pz-flow-image-tools__title{color:#cbd1d6!important;}
.pz-flow-image-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(18px,3vw,34px)!important;
}
.pz-flow-image-action{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:clamp(68px,7.2vw,82px)!important;
  aspect-ratio:1/1!important;
  padding:0!important;
  border:0!important;
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
  filter:drop-shadow(0 5px 6px rgba(0,0,0,.16))!important;
}
.pz-flow-image-action--random{background-image:url("retro-ui/03_buttons_round/button-round-yellow-up.webp")!important;}
.pz-flow-image-action--photo{background-image:url("retro-ui/03_buttons_round/button-round-green-up.webp")!important;}
.pz-flow-image-action--random:active,.pz-flow-image-action--random.is-pressed{background-image:url("retro-ui/03_buttons_round/button-round-yellow-down.webp")!important;}
.pz-flow-image-action--photo:active,.pz-flow-image-action--photo.is-pressed{background-image:url("retro-ui/03_buttons_round/button-round-green-down.webp")!important;}
.pz-flow-image-action > span{
  display:block!important;
  max-width:70%!important;
  margin-top:1px!important;
  font-family:Manrope,Arial,sans-serif!important;
  font-size:clamp(8px,.82vw,10.5px)!important;
  line-height:1.02!important;
  font-weight:1000!important;
  letter-spacing:-.035em!important;
  text-align:center!important;
  text-transform:none!important;
  pointer-events:none!important;
}
.pz-flow-image-action--random > span{color:#251c0a!important;text-shadow:0 1px 0 rgba(255,255,255,.38)!important;}
.pz-flow-image-action--photo > span{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.45)!important;}
.pz-flow-image-action:focus-visible{outline:3px solid #ff5a00!important;outline-offset:3px!important;border-radius:50%!important;}
.pz-flow-image-action[disabled]{opacity:.55!important;cursor:wait!important;}
.pz-flow-image-tools__hint{
  margin:0!important;
  font-size:clamp(9px,.9vw,11px)!important;
  line-height:1.15!important;
  font-weight:750!important;
  color:#73695e!important;
}
.pz-flow-image-tools__hint b{font-weight:1000!important;color:inherit!important;}
html[data-theme="dark"] .pz-flow-image-tools__hint{color:#bfc6cc!important;}
@media(max-width:820px) and (orientation:portrait){
  .pz-flow-image-tools{gap:2px!important;}
  .pz-flow-image-actions{gap:22px!important;}
  .pz-flow-image-action{width:64px!important;}
  .pz-flow-image-action > span{font-size:8.5px!important;}
  .pz-flow-image-tools__hint{font-size:9px!important;}
}

/* ---------- Karta poziomu jak w Ukladaniu ---------- */
.pz-flow-level-card{
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  width:min(94%,600px)!important;
  max-height:94%!important;
  padding:clamp(8px,2vw,18px)!important;
  text-align:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.pz-flow-level-art{
  display:block!important;
  width:min(88%,510px)!important;
  height:auto!important;
  max-height:178px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 15px 14px rgba(59,34,15,.18))!important;
}
.pz-flow-level-card > strong{
  font-size:clamp(22px,3.6vw,38px)!important;
  line-height:1!important;
  font-weight:1000!important;
  color:#28231d!important;
}
html[data-theme="dark"] .pz-flow-level-card > strong{color:#fff7ea!important;}
.pz-flow-level-copy{
  max-width:440px!important;
  margin:0!important;
  font-size:clamp(12px,1.35vw,15px)!important;
  line-height:1.38!important;
  font-weight:750!important;
  color:#4f4942!important;
}
html[data-theme="dark"] .pz-flow-level-copy{color:#d7dce1!important;}
.pz-flow-time-limit{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
.pz-flow-time-limit img{width:min(240px,48vw)!important;max-height:72px!important;object-fit:contain!important;}
.pz-flow-time-limit b{font-size:clamp(24px,4vw,44px)!important;font-variant-numeric:tabular-nums!important;}
.pz-flow-level-note{
  margin:0!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  font-size:clamp(10px,1.1vw,12px)!important;
  font-weight:850!important;
  color:#625a50!important;
}
html[data-theme="dark"] .pz-flow-level-note{background:rgba(255,255,255,.08)!important;color:#c9cfd4!important;}

/* ---------- Wspolne przejscia / koniec poziomu ---------- */
.pz-flow-screen{
  background:rgba(250,247,240,.48)!important;
  backdrop-filter:blur(1.5px)!important;
  -webkit-backdrop-filter:blur(1.5px)!important;
  padding:clamp(8px,2vw,20px)!important;
  overflow:hidden!important;
}
html[data-theme="dark"] .pz-flow-screen{background:rgba(12,15,18,.54)!important;}
.pz-flow-transition-card,
.pz-flow-final-card{
  position:relative!important;
  z-index:3!important;
  width:min(94%,620px)!important;
  max-height:94%!important;
  margin:0 auto!important;
  padding:clamp(8px,1.4vw,18px)!important;
  border:0!important;
  border-radius:24px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#20242a!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(6px,1.05vh,12px)!important;
  text-align:center!important;
}
html[data-theme="dark"] .pz-flow-transition-card,
html[data-theme="dark"] .pz-flow-final-card{color:#f3f5f7!important;}
.pz-flow-level-badge{
  display:block!important;
  width:min(300px,48%)!important;
  max-height:82px!important;
  object-fit:contain!important;
  margin:0 auto!important;
}
.pz-flow-completed{
  display:block!important;
  width:min(76%,390px)!important;
  max-height:clamp(94px,20vh,176px)!important;
  object-fit:contain!important;
  filter:drop-shadow(0 10px 13px rgba(0,0,0,.24))!important;
}
.pz-flow-awards{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:clamp(8px,2.2vw,24px)!important;
  min-height:clamp(92px,17vh,158px)!important;
}
.pz-flow-count{
  display:block!important;
  width:min(40%,210px)!important;
  max-height:clamp(72px,14vh,126px)!important;
  object-fit:contain!important;
  filter:drop-shadow(0 7px 10px rgba(0,0,0,.20))!important;
}
.pz-flow-trophy-stage{
  position:relative!important;
  width:clamp(112px,22vw,184px)!important;
  height:clamp(98px,18vh,160px)!important;
  display:grid!important;
  place-items:center!important;
}
.pz-flow-trophy{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:184px!important;
  max-height:160px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 11px 9px rgba(73,40,0,.27))!important;
}
.pz-flow-title{
  display:block!important;
  margin:0!important;
  font-size:clamp(18px,3.1vw,30px)!important;
  line-height:1!important;
  font-weight:1000!important;
  letter-spacing:.045em!important;
  color:#20242a!important;
  text-align:center!important;
}
html[data-theme="dark"] .pz-flow-title{color:#f2f4f6!important;}

/* Gwiazdki i podsumowanie gwiazdek - bez rozpychania kart na telefonie. */
.pz-flow-stars{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:clamp(2px,.55vw,5px)!important;
}
.pz-flow-stars > img,
.pz-flow-stars .pz-mem-stars img{
  display:block!important;
  width:clamp(24px,4.4vw,44px)!important;
  height:clamp(24px,4.4vw,44px)!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.14))!important;
}
.pz-flow-stars .pz-mem-stars{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:clamp(2px,.55vw,5px)!important;
}
.pz-flow-stars--final .pz-mem-stars img{
  width:clamp(17px,2.8vw,28px)!important;
  height:clamp(17px,2.8vw,28px)!important;
}
.pz-flow-star-total{
  min-width:128px!important;
  display:grid!important;
  grid-template-columns:auto auto!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  justify-content:center!important;
  column-gap:7px!important;
  line-height:1!important;
}
.pz-flow-star-total img{
  grid-row:1 / 3!important;
  width:clamp(42px,7vw,64px)!important;
  height:clamp(42px,7vw,64px)!important;
  object-fit:contain!important;
}
.pz-flow-star-total b{
  align-self:end!important;
  font-size:clamp(24px,4vw,38px)!important;
  font-weight:1000!important;
  color:#20242a!important;
}
.pz-flow-star-total span{
  align-self:start!important;
  font-size:clamp(8px,1.2vw,11px)!important;
  font-weight:1000!important;
  letter-spacing:.08em!important;
  color:#625a50!important;
}
html[data-theme="dark"] .pz-flow-star-total b{color:#fff!important;}
html[data-theme="dark"] .pz-flow-star-total span{color:#c1c8ce!important;}
.pz-flow-stats{
  width:min(100%,560px)!important;
  display:grid!important;
  grid-template-columns:repeat(var(--pz-flow-cols,3),minmax(0,1fr))!important;
  gap:clamp(5px,1.1vw,10px)!important;
}
.pz-flow-stat{
  min-width:0!important;
  padding:clamp(7px,1.1vh,11px) clamp(5px,1vw,10px)!important;
  border:1px solid rgba(77,57,31,.18)!important;
  border-radius:12px!important;
  background:rgba(255,250,239,.78)!important;
  box-shadow:0 4px 12px rgba(44,31,14,.10)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
}
html[data-theme="dark"] .pz-flow-stat{background:rgba(25,29,33,.82)!important;border-color:rgba(255,255,255,.12)!important;}
.pz-flow-stat span,.pz-flow-stat small{
  margin:0!important;
  font-size:clamp(9px,1.3vw,13px)!important;
  line-height:1!important;
  font-weight:1000!important;
  letter-spacing:.07em!important;
  color:#5e574e!important;
  text-transform:uppercase!important;
}
html[data-theme="dark"] .pz-flow-stat span,
html[data-theme="dark"] .pz-flow-stat small{color:#b8c0c7!important;}
.pz-flow-stat b{
  margin:0!important;
  font-size:clamp(20px,4vw,36px)!important;
  line-height:.98!important;
  font-weight:1000!important;
  color:#171b20!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}
html[data-theme="dark"] .pz-flow-stat b{color:#fff!important;}
.pz-flow-extras{
  min-height:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
  gap:6px!important;
}
.pz-flow-extras:empty{display:none!important;}
.pz-flow-extras img{
  display:block!important;
  width:auto!important;
  max-width:min(42%,220px)!important;
  max-height:70px!important;
  object-fit:contain!important;
}
.pz-flow-next{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  margin-top:2px!important;
}
.pz-flow-next img{display:block!important;width:min(250px,50vw)!important;max-height:72px!important;object-fit:contain!important;}
.pz-flow-next small{font-size:clamp(10px,1.1vw,12px)!important;font-weight:850!important;color:#61594f!important;}
html[data-theme="dark"] .pz-flow-next small{color:#c1c8ce!important;}

/* Czytelne napisy na kolorowej planszy - lekkie, nie dominujace kafelki. */
.pz-flow-level-card > strong,
.pz-flow-level-copy,
.pz-flow-title,
.pz-flow-next small{
  width:fit-content!important;
  max-width:min(92%,520px)!important;
  padding:5px 11px!important;
  border:1px solid rgba(92,67,38,.10)!important;
  border-radius:12px!important;
  background:rgba(255,250,240,.82)!important;
  box-shadow:0 3px 10px rgba(48,32,15,.08)!important;
  backdrop-filter:blur(2px)!important;
  -webkit-backdrop-filter:blur(2px)!important;
}
.pz-flow-level-copy{padding:6px 11px!important;}
.pz-flow-next small{border-radius:999px!important;padding:5px 10px!important;}
html[data-theme="dark"] .pz-flow-level-card > strong,
html[data-theme="dark"] .pz-flow-level-copy,
html[data-theme="dark"] .pz-flow-title,
html[data-theme="dark"] .pz-flow-next small{
  background:rgba(24,28,32,.84)!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 3px 10px rgba(0,0,0,.18)!important;
}

/* Sprint i Pamieciowka mialy final przyklejony do boku - wspolny final jest centralny. */
body.pz-sp-page .pz-sp-complete.pz-flow-screen,
body.pz-mem-page .pz-mem-complete.pz-flow-screen,
body.pz-od-page .pz-od-complete.pz-flow-screen,
body.pz-demontaz-page .pz-demontaz-complete.pz-flow-screen{
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  inset:0!important;
}

@media(max-width:820px) and (orientation:portrait){
  .pz-flow-intro{padding:10px!important;}
  .pz-flow-intro-card{
    width:min(92%,430px)!important;
    height:min(410px,calc(100% - 20px))!important;
    max-height:calc(100% - 20px)!important;
    overflow:hidden!important;
    padding:18px 17px!important;
    border-radius:18px!important;
    gap:8px!important;
  }
  .pz-flow-intro-card > strong,.pz-flow-intro-card > h2{font-size:24px!important;line-height:1.08!important;}
  .pz-flow-intro-card > p{font-size:14px!important;line-height:1.36!important;}
  .pz-flow-signoff{font-size:14px!important;}
  .pz-flow-ready{width:min(100%,330px)!important;padding-top:8px!important;gap:16px!important;}
  .pz-flow-ready img{max-height:82px!important;}
  .pz-flow-click-note{font-size:11px!important;line-height:1.2!important;}

  .pz-flow-level-card{width:min(96%,560px)!important;max-height:96%!important;padding:8px 4px!important;gap:7px!important;}
  .pz-flow-level-art{width:min(90%,500px)!important;max-height:min(25dvh,150px)!important;}

  .pz-flow-screen{padding:7px!important;}
  .pz-flow-transition-card,.pz-flow-final-card{width:min(98%,560px)!important;max-height:98%!important;padding:6px!important;gap:5px!important;}
  .pz-flow-level-badge{width:min(270px,56%)!important;max-height:64px!important;}
  .pz-flow-completed{width:min(78%,330px)!important;max-height:118px!important;}
  .pz-flow-awards{min-height:88px!important;gap:4px!important;}
  .pz-flow-count{width:min(42%,170px)!important;max-height:88px!important;}
  .pz-flow-trophy-stage{width:clamp(96px,28vw,145px)!important;height:clamp(82px,14vh,126px)!important;}
  .pz-flow-trophy{max-width:145px!important;max-height:126px!important;}
  .pz-flow-title{font-size:clamp(17px,5vw,24px)!important;}
  .pz-flow-stars > img,.pz-flow-stars .pz-mem-stars img{width:26px!important;height:26px!important;}
  .pz-flow-stars--final .pz-mem-stars img{width:17px!important;height:17px!important;}
  .pz-flow-star-total img{width:44px!important;height:44px!important;}
  .pz-flow-stats{gap:5px!important;}
  .pz-flow-stat{padding:6px 3px!important;}
  .pz-flow-stat span,.pz-flow-stat small{font-size:9px!important;}
  .pz-flow-stat b{font-size:clamp(18px,5.8vw,27px)!important;}
  .pz-flow-extras img{max-height:50px!important;}
  .pz-flow-next img{max-height:55px!important;}
}

@media(max-height:650px) and (orientation:landscape){
  .pz-flow-intro-card{height:calc(100% - 12px)!important;max-height:calc(100% - 12px)!important;overflow:hidden!important;padding:10px 16px!important;gap:4px!important;}
  .pz-flow-intro-card > strong,.pz-flow-intro-card > h2{font-size:20px!important;}
  .pz-flow-intro-card > p{font-size:12px!important;line-height:1.24!important;}
  .pz-flow-signoff{font-size:12px!important;}
  .pz-flow-ready{width:min(78%,320px)!important;padding-top:4px!important;gap:12px!important;}
  .pz-flow-ready img{max-height:48px!important;}
  .pz-flow-level-art{max-height:104px!important;}
  .pz-flow-completed{width:min(54%,300px)!important;max-height:82px!important;}
  .pz-flow-awards{min-height:72px!important;}
  .pz-flow-count{width:min(28%,150px)!important;max-height:68px!important;}
  .pz-flow-trophy-stage{width:96px!important;height:76px!important;}
  .pz-flow-trophy{max-width:96px!important;max-height:76px!important;}
  .pz-flow-stat{padding:4px 3px!important;}
  .pz-flow-stat b{font-size:19px!important;}
}

@media(prefers-reduced-motion:reduce){
  body.pz-game-page #countdown > img,
  body.pz-game-page #countdown > .pz-uk-status-art,
  body.pz-game-page #countdown > .pz-demontaz-status-art,
  body.pz-game-page #countdown > .pz-od-status-art,
  body.pz-game-page #countdown > .pz-od12-countdown-art,
  body.pz-game-page #countdown > .pz-sp-status-art,
  body.pz-game-page #countdown > .pz-mem-status-art{animation:none!important;}
}


/* Safety: hidden zawsze wygrywa nad historycznymi display:grid/flex. */
body.pz-game-page .pz-flow-screen[hidden],
body.pz-game-page .pz-flow-intro[hidden]{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}


/* Twarde ujednolicenie kart intro. Historyczne CSS-y poszczegolnych gier maja
   miejscami bardziej szczegolowe reguly z !important - te selektory celowo
   wygrywaja tylko wewnatrz nowej karty startowej. */
body.pz-game-page.pz-demontaz-page .pz-dem21-intro-card.pz-flow-intro-card,
body.pz-game-page.pz-od-page .pz-od12-intro-card.pz-flow-intro-card,
body.pz-game-page.pz-sp-page .pz-sp-welcome-card.pz-flow-intro-card,
body.pz-game-page.pz-mem-page .pz-mem-flow-card.pz-flow-intro-card{
  box-sizing:border-box!important;
  width:min(88%,520px)!important;
  height:auto!important;
  min-height:min(340px,calc(100% - 24px))!important;
  min-height:0!important;
  max-height:calc(100% - 24px)!important;
  overflow:hidden!important;
  padding:clamp(18px,2.4vw,24px)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  border-radius:20px!important;
}
body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card > strong{
  display:block!important;
  margin:0!important;
  font-size:clamp(23px,2.7vw,29px)!important;
  line-height:1.1!important;
  color:#2c2925!important;
  letter-spacing:-.025em!important;
  text-shadow:none!important;
}
body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card > p{
  display:block!important;
  margin:0!important;
  max-width:450px!important;
  font-size:clamp(14px,1.35vw,16px)!important;
  line-height:1.38!important;
}
body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-ready img{
  width:100%!important;
  height:auto!important;
  max-height:86px!important;
  object-fit:contain!important;
}
body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-click-note{
  display:block!important;
}
html[data-theme="dark"] body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card > strong{color:#f4f0e9!important;}

@media(max-width:820px) and (orientation:portrait){
  body.pz-game-page.pz-demontaz-page .pz-dem21-intro-card.pz-flow-intro-card,
  body.pz-game-page.pz-od-page .pz-od12-intro-card.pz-flow-intro-card,
  body.pz-game-page.pz-sp-page .pz-sp-welcome-card.pz-flow-intro-card,
  body.pz-game-page.pz-mem-page .pz-mem-flow-card.pz-flow-intro-card{
    width:min(92%,430px)!important;
    height:min(410px,calc(100% - 20px))!important;
    min-height:0!important;
    max-height:calc(100% - 20px)!important;
    padding:18px 17px!important;
    gap:8px!important;
    overflow:hidden!important;
    border-radius:18px!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card > strong{
    font-size:24px!important;
    line-height:1.08!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card > p{
    display:block!important;
    font-size:14px!important;
    line-height:1.36!important;
    max-width:100%!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-signoff,
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-signoff b,
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-signoff span{
    display:flex!important;
    font-size:14px!important;
    line-height:1.15!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-signoff b,
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-signoff span{
    display:block!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-ready{
    width:min(100%,330px)!important;
    margin-top:auto!important;
    padding-top:8px!important;
    grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)!important;
    gap:16px!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-ready img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:82px!important;
  }
  body.pz-game-page :is(.pz-dem21-intro-card,.pz-od12-intro-card,.pz-sp-welcome-card,.pz-mem-flow-card).pz-flow-intro-card .pz-flow-click-note{
    display:block!important;
    font-size:11px!important;
    line-height:1.2!important;
  }
}

/* ======================================================================
   FLOW4 - containment guard dla ekranow miedzy poziomami / finalow.
   Tylko prezentacja. Nie dotyka fizyki, zasad, czasu ani punktacji.
   Cel: zadna karta ani jej grafika nie moze wyjsc poza mate.
   ====================================================================== */

/* Kazdy ekran flow jest twardo ograniczony do powierzchni maty. */
body.pz-game-page .pz-flow-screen{
  box-sizing:border-box!important;
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  min-width:0!important;
  min-height:0!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  justify-content:center!important;
  overflow:hidden!important;
}
body.pz-game-page .pz-flow-screen > .pz-flow-transition-card,
body.pz-game-page .pz-flow-screen > .pz-flow-final-card,
body.pz-game-page .pz-flow-screen > .pz-flow-level-card{
  box-sizing:border-box!important;
  width:min(94%,620px)!important;
  max-width:calc(100% - 12px)!important;
  max-height:none!important;
  min-width:0!important;
  min-height:0!important;
  overflow:visible!important;
  flex-shrink:1!important;
  transform-origin:50% 50%!important;
}

/* Historyczne CSS-y Sprintu i Pamieciowki maja szerokie reguly
   typu `.phase-overlay img`. Ponizej resetujemy WYŁĄCZNIE grafiki
   nowego flow, z wieksza specyficznoscia. */
body.pz-game-page .pz-flow-screen .pz-flow-transition-card > img.pz-flow-level-badge,
body.pz-game-page .pz-flow-screen .pz-flow-final-card > img.pz-flow-level-badge{
  display:block!important;
  width:min(300px,48%)!important;
  height:auto!important;
  max-width:48%!important;
  max-height:82px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-transition-card > img.pz-flow-completed,
body.pz-game-page .pz-flow-screen .pz-flow-final-card > img.pz-flow-completed{
  display:block!important;
  width:min(76%,390px)!important;
  height:auto!important;
  max-width:76%!important;
  max-height:176px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-awards > img.pz-flow-count{
  display:block!important;
  width:min(40%,210px)!important;
  height:auto!important;
  max-width:40%!important;
  max-height:126px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-awards .pz-flow-trophy-stage > img.pz-flow-trophy{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:184px!important;
  max-height:160px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-extras > img{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:min(42%,220px)!important;
  max-height:70px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-next > img{
  display:block!important;
  width:min(250px,50vw)!important;
  height:auto!important;
  max-width:55%!important;
  max-height:72px!important;
  object-fit:contain!important;
}
body.pz-game-page .pz-flow-screen .pz-flow-stars > img,
body.pz-game-page .pz-flow-screen .pz-flow-stars .pz-mem-stars > img{
  display:block!important;
  width:clamp(24px,4.4vw,44px)!important;
  height:clamp(24px,4.4vw,44px)!important;
  max-width:44px!important;
  max-height:44px!important;
  object-fit:contain!important;
}

/* Mobilny profil przejsc: jedna kompaktowa kompozycja miesci sie miedzy panelami. */
@media(max-width:820px) and (orientation:portrait){
  body.pz-game-page .pz-flow-screen{
    padding:6px!important;
  }
  body.pz-game-page .pz-flow-screen > .pz-flow-transition-card,
  body.pz-game-page .pz-flow-screen > .pz-flow-final-card,
  body.pz-game-page .pz-flow-screen > .pz-flow-level-card{
    width:calc(100% - 8px)!important;
    max-width:calc(100% - 8px)!important;
    max-height:none!important;
    padding:4px!important;
    gap:4px!important;
    border-radius:16px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-transition-card > img.pz-flow-level-badge,
  body.pz-game-page .pz-flow-screen .pz-flow-final-card > img.pz-flow-level-badge{
    width:min(46%,220px)!important;
    max-width:46%!important;
    max-height:46px!important;
    padding:2px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-transition-card > img.pz-flow-completed,
  body.pz-game-page .pz-flow-screen .pz-flow-final-card > img.pz-flow-completed{
    width:min(64%,270px)!important;
    max-width:64%!important;
    max-height:78px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-awards{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:68px!important;
    gap:7px!important;
    flex:0 1 auto!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-awards > img.pz-flow-count{
    width:min(38%,145px)!important;
    max-width:38%!important;
    max-height:62px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-trophy-stage{
    width:74px!important;
    height:64px!important;
    min-width:0!important;
    min-height:0!important;
    flex:0 0 74px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-awards .pz-flow-trophy-stage > img.pz-flow-trophy{
    width:74px!important;
    height:64px!important;
    max-width:74px!important;
    max-height:64px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stars,
  body.pz-game-page .pz-flow-screen .pz-flow-stars .pz-mem-stars{
    gap:3px!important;
    flex-wrap:nowrap!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stars > img,
  body.pz-game-page .pz-flow-screen .pz-flow-stars .pz-mem-stars > img{
    width:22px!important;
    height:22px!important;
    max-width:22px!important;
    max-height:22px!important;
    flex:0 0 22px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-title{
    max-width:94%!important;
    padding:4px 9px!important;
    border-radius:10px!important;
    font-size:clamp(16px,4.6vw,21px)!important;
    line-height:1.05!important;
    letter-spacing:.025em!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stats{
    width:min(100%,430px)!important;
    gap:4px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stat{
    min-height:0!important;
    padding:4px 3px!important;
    border-radius:10px!important;
    gap:1px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stat span,
  body.pz-game-page .pz-flow-screen .pz-flow-stat small{
    font-size:8px!important;
    line-height:1!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-stat b{
    font-size:clamp(18px,5.4vw,24px)!important;
    line-height:1!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-extras{
    min-height:0!important;
    max-height:38px!important;
    gap:4px!important;
    overflow:hidden!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-extras > img{
    width:auto!important;
    height:auto!important;
    max-width:42%!important;
    max-height:36px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-next{
    margin-top:0!important;
    gap:1px!important;
    min-height:0!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-next > img{
    width:min(42%,160px)!important;
    max-width:42%!important;
    max-height:38px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-next > small{
    max-width:92%!important;
    padding:4px 8px!important;
    font-size:9px!important;
    line-height:1.15!important;
  }

  /* Pamieciowka: trzy gwiazdki miedzy poziomami sa dekoracja, nie glowna plansza. */
  body.pz-mem-page .pz-flow-screen .pz-flow-awards .pz-flow-stars{
    min-width:0!important;
    max-width:100px!important;
    flex:0 1 100px!important;
  }

  /* Sprint: nagroda dodatkowa ma byc akcentem, a nie kolejnym duzym ekranem. */
  body.pz-sp-page .pz-flow-screen .pz-flow-extras > img{
    max-width:150px!important;
    max-height:34px!important;
  }
}

/* Krotkie / niskie okno - dodatkowy bezpiecznik takze na desktopie. */
@media(max-height:760px){
  body.pz-game-page .pz-flow-screen > .pz-flow-transition-card,
  body.pz-game-page .pz-flow-screen > .pz-flow-final-card{
    gap:4px!important;
    padding:5px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-transition-card > img.pz-flow-completed,
  body.pz-game-page .pz-flow-screen .pz-flow-final-card > img.pz-flow-completed{
    max-height:88px!important;
  }
  body.pz-game-page .pz-flow-screen .pz-flow-level-badge{max-height:50px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-awards{min-height:0!important;max-height:76px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-count{max-height:68px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-trophy-stage{height:70px!important;width:82px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-trophy{max-height:70px!important;max-width:82px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-extras > img{max-height:38px!important;}
  body.pz-game-page .pz-flow-screen .pz-flow-next > img{max-height:42px!important;}
}