/* R7355. Scoped UI/UX polish for the public index. No puzzle pieces, engines,
   auth scripts, catalog widgets or application state are modified. */
body.home-story-v2{
  --r7355-text:16px;
  --r7355-leading:1.65;
  --r7355-subtitle:clamp(27px,2.45vw,36px);
}
body.home-story-v2 #main .home-marta-question,
body.home-story-v2 #main .home-marta-question strong,
body.home-story-v2 #main .home-marta-question em,
body.home-story-v2 #main .home-r7355-story-short__question,
body.home-story-v2 #main .home-r7355-story-short__question strong,
body.home-story-v2 #main .home-r7355-story-short__question em {
  font-family:Manrope,system-ui,sans-serif!important;
  font-size:var(--r7355-text)!important;
  line-height:1.5!important;
  font-style:italic!important;
  font-weight:800!important;
  letter-spacing:-.015em!important;
}
body.home-story-v2 #main .home-section-head > p,
body.home-story-v2 #main .home-controls-demo__lead,
body.home-story-v2 #main .home-r8-gallery-copy > p,
body.home-story-v2 #main .home-marta-games-lead,
body.home-story-v2 #main .home-platform-definition,
body.home-story-v2 #main .home-marta-examples span,
body.home-story-v2 #main .home-r7355-story-short p,
body.home-story-v2 #top .home-refresh-hero__lead,
body.home-story-v2 #main .home-refresh-steps article p,
body.home-story-v2 #main .home-refresh-faq .home-section-head p {
  font-family:Manrope,system-ui,sans-serif!important;
  font-size:var(--r7355-text)!important;
  line-height:var(--r7355-leading)!important;
  letter-spacing:0!important;
}
body.home-story-v2 #main .home-section-head h2,
body.home-story-v2 #main .home-controls-demo__head h2,
body.home-story-v2 #main .home-gallery-head h2,
body.home-story-v2 #main .home-games-head h2,
body.home-story-v2 #main .home-refresh-archive__copy h2,
body.home-story-v2 #main .home-refresh-support__copy h2,
body.home-story-v2 #main .home-auth-section__copy h2,
body.home-story-v2 #main .home-r2-information__head h2 {
  font-size:var(--r7355-subtitle)!important;
  line-height:1.2!important;
  letter-spacing:-.033em!important;
  text-wrap:balance;
  max-width:25ch;
}
body.home-story-v2 #main .home-marta-examples strong,
body.home-story-v2 #main .home-refresh-steps h3{font-size:16px!important;line-height:1.42!important}
body.home-story-v2 #main .home-refresh-steps article{min-width:0}
body.home-story-v2 #jak-to-dziala .home-refresh-steps,
body.home-story-v2 #jak-to-dziala .home-marta-examples{position:relative;z-index:9}
body.home-story-v2 #jak-to-dziala .home-marta-examples>div{
  padding:17px 19px!important;
  border:1px solid var(--border,#e6e7eb)!important;
  border-radius:17px!important;
  background:var(--surface,#fff)!important;
  box-shadow:0 8px 20px rgba(16,24,40,.035);
}
body.home-story-v2 #jak-to-dziala .home-platform-definition{
  position:relative;z-index:9;max-width:76ch;
  padding:15px 19px!important;
  border:1px solid var(--border,#e6e7eb);
  background:var(--surface,#fff);
  border-radius:17px;
}
body.home-story-v2 #jak-to-dziala .home-platform-definition strong{margin-right:.35em}

/* The personal story is available in full on /oprojekcie.html. The home page
   offers a calm teaser instead of repeating 10 long interview questions. */
body.home-story-v2 #galeria .home-r7355-story-short{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:23px 27px;margin:27px auto 6px;
  border:1px solid var(--border,#e6e7eb);
  border-radius:22px;background:var(--surface,#fff);
  box-shadow:0 10px 32px rgba(15,23,42,.045);
  position:relative;z-index:9;
}
body.home-story-v2 #galeria .home-r7355-story-short__copy{min-width:0;max-width:690px}
body.home-story-v2 #galeria .home-r7355-story-short__question{margin:7px 0!important}
body.home-story-v2 #galeria .home-r7355-story-short__copy>p:last-child{margin:0!important;color:var(--muted,#4b5563)}
body.home-story-v2 #galeria .home-r7355-story-short__link{flex:0 0 auto;white-space:normal;text-align:center}
body.home-story-v2 #galeria .home-r7355-story-short__link span{margin-left:7px}
body.home-story-v2 #galeria .home-r7355-swipe-hint{display:none}

/* Text must stay legible if a floating decorative puzzle moves behind it.
   The puzzle element and its pointer/drag logic are left entirely untouched. */
body.home-story-v2 #galeria .home-gallery-head,
body.home-story-v2 #mini-gry .home-games-head,
body.home-story-v2 #faq .home-section-head,
body.home-story-v2 #faq .home-faq,
body.home-story-v2 #archiwum-home .home-refresh-archive__copy,
body.home-story-v2 #wspolna-motywacja .home-refresh-support__copy{
  position:relative;z-index:9;
}
body.home-story-v2 #galeria .home-r8-gallery-copy,
body.home-story-v2 #mini-gry .home-r8-gallery-copy{
  padding:10px 15px;
  border-radius:15px;
  background:var(--surface,#fff);
  border:1px solid var(--border,#e6e7eb);
}
body.home-story-v2 #faq .home-section-head>p{
  background:var(--surface,#fff);border-radius:12px;padding:9px 13px;
}
body.home-story-v2 #faq .home-faq details{
  background:var(--surface,#fff)!important;
}

@media(min-width:821px){
  /* A strong compact hero: artwork + explanation occupy one readable row;
     right side remains open for the existing floating interactive puzzle. */
  body.home-desktop-r7 #top.home-refresh-hero{
    min-height:490px!important;
    height:auto!important;
    padding:35px 0 36px!important;
  }
  body.home-desktop-r7 #top .home-refresh-hero__inner{
    display:grid!important;
    grid-template-columns:minmax(200px,295px) minmax(0,510px)!important;
    width:min(calc(100% - 72px),1150px)!important;
    max-width:1150px!important;
    align-items:center!important;
    justify-content:start!important;
    min-height:0!important;
    gap:clamp(24px,3.1vw,43px)!important;
    padding:0!important;
    margin:0 auto!important;
  }
  body.home-desktop-r7 #top .home-refresh-hero__visual{
    width:100%!important;min-width:0!important;
    min-height:0!important;height:auto!important;
    margin:0!important;padding:0!important;align-self:center!important;
  }
  body.home-desktop-r7 #top .home-r3-hero-carousel{
    width:100%!important;max-width:295px!important;min-width:0!important;
    aspect-ratio:1!important;overflow:visible!important;
  }
  body.home-desktop-r7 #top .home-r3-hero-photo{
    display:block!important;width:100%!important;height:auto!important;
    max-width:295px!important;aspect-ratio:1!important;object-fit:contain!important;
  }
  body.home-desktop-r7 #top .home-refresh-hero__copy{
    width:100%!important;max-width:510px!important;min-width:0!important;
    padding:0!important;margin:0!important;
  }
  body.home-desktop-r7 #top h1{
    font-size:clamp(34px,3.15vw,46px)!important;
    line-height:1.1!important;letter-spacing:-.043em!important;
    margin:4px 0 11px!important;
  }
  body.home-desktop-r7 #top .home-refresh-hero__lead{margin:4px 0 8px!important}
  body.home-desktop-r7 #top .home-hero-promise{margin:8px 0 12px!important}
  body.home-desktop-r7 #top .home-hero-actions{gap:8px!important;margin:13px 0 10px!important}
  body.home-desktop-r7 #top .home-hero-actions>.btn{
    min-height:42px;padding:11px 14px!important;font-size:12px!important;
  }
  body.home-desktop-r7 #top .home-beta-short{margin:5px 0 0!important;font-size:12px!important;line-height:1.55!important}
  body.home-desktop-r7 #top .home-beta-details{margin-top:10px!important}
  body.home-desktop-r7 #top .home-r8-hero-arrow{
    bottom:14px!important;
  }
  body.home-desktop-r7 #main>#zapis-dnia-podglad{margin-top:5px!important}
  body.home-desktop-r7 #main #jak-to-dziala,
  body.home-desktop-r7 #main #galeria,
  body.home-desktop-r7 #main #mini-gry,
  body.home-desktop-r7 #main #faq{padding-top:44px!important;padding-bottom:42px!important}
  body.home-desktop-r7 #main #galeria .home-gallery-head{
    gap:25px!important;align-items:start!important;
  }
  body.home-desktop-r7 #mini-gry .home-games-head{gap:24px!important}
  body.home-desktop-r7 #mini-gry .home-r8-gallery-copy{max-width:57ch}
  body.home-desktop-r7 #main #faq .home-section-head{margin-bottom:20px!important}
}

/* Main site gallery: smooth horizontal scroll is native, so swiping never relies
   on external plugins. Both legacy thumb and R7 viewport layouts are supported. */
@media(max-width:820px){
  body.home-story-v2{--r7355-text:15px;--r7355-leading:1.58;--r7355-subtitle:clamp(24px,5.9vw,28px)}
  /* Compact top illustration: no 400px empty square before the call to action. */
  body.home-story-v2 #top .home-refresh-hero__visual{
    display:block!important;width:100%!important;height:auto!important;
    min-height:0!important;max-height:none!important;overflow:visible!important;
  }
  body.home-story-v2 #top .home-r3-hero-carousel{
    width:min(240px,64vw)!important;max-width:240px!important;
    height:auto!important;aspect-ratio:1!important;
    margin:5px auto 1px!important;overflow:visible!important;
  }
  body.home-story-v2 #top .home-r3-hero-photo{
    display:block!important;width:100%!important;height:auto!important;
    max-width:240px!important;aspect-ratio:1!important;
    object-fit:contain!important;margin:0 auto!important;
  }
  body.home-story-v2 #top .home-refresh-hero__copy h1{font-size:clamp(25px,6.7vw,32px)!important;line-height:1.1!important}
  body.home-story-v2 #top .home-refresh-hero__lead{line-height:1.52!important;margin-bottom:9px!important}
  body.home-story-v2 #top .home-hero-promise{font-size:14px!important;line-height:1.5!important}
  body.home-story-v2 #top .home-hero-actions{display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin:12px 0!important}
  body.home-story-v2 #top .home-hero-actions>.btn:first-child{
    display:inline-flex!important;min-height:44px;width:auto!important;max-width:100%;padding:10px 14px!important;font-size:13px!important;
  }
  body.home-story-v2 #top .home-hero-actions>.btn:nth-child(2){display:none!important}
  body.home-story-v2 #top .home-hero-actions>.home-marta-about-cta{
    display:inline-flex!important;min-height:44px;padding:10px 14px!important;font-size:12px!important;
  }
  body.home-story-v2 #galeria{
    width:100%!important;max-width:100%!important;min-width:0!important;
    overflow:hidden!important;
  }
  body.home-story-v2 #galeria .home-platform-gallery{
    min-width:0!important;width:calc(100% - 18px)!important;
    max-width:calc(100% - 18px)!important;
    padding:16px 8px!important;overflow:hidden!important;
    margin:0 auto!important;
  }
  body.home-story-v2 #galeria .home-gallery-head{display:block!important;min-width:0!important;margin-bottom:12px!important}
  body.home-story-v2 #galeria .home-gallery-head h2{font-size:clamp(24px,6vw,28px)!important;line-height:1.16!important}
  body.home-story-v2 #galeria .home-r8-gallery-copy{
    padding:0!important;border:0!important;background:transparent!important;
  }
  body.home-story-v2 #galeria .home-r8-gallery-copy p:not(.home-marta-question):last-child{
    font-size:13px!important;line-height:1.55!important;color:var(--muted,#64748b);
  }
  body.home-story-v2 #galeria .home-gallery-tabs{
    display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;
    max-width:100%!important;min-width:0!important;gap:7px!important;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
    padding:2px 1px 8px!important;
  }
  body.home-story-v2 #galeria .home-gallery-tabs::-webkit-scrollbar{display:none}
  body.home-story-v2 #galeria .home-gallery-tabs>button{flex:0 0 auto!important;white-space:nowrap!important}
  body.home-story-v2 #galeria .home-r7355-swipe-hint{
    display:flex;align-items:center;justify-content:center;gap:9px;
    text-align:center;font-size:12px;line-height:1.45;
    color:var(--muted,#64748b);margin:6px 4px 9px;padding:0;
  }
  body.home-story-v2 #galeria .home-r7355-swipe-hint span{font-size:18px;color:var(--orange,#ff5a00)}
  body.home-story-v2 #galeria .home-gallery-browser{
    display:flex!important;align-items:center!important;
    flex-direction:row!important;gap:3px!important;
    width:100%!important;min-width:0!important;
    overflow:visible!important;
  }
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs{
    display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
    grid-template-columns:none!important;gap:15px!important;
    width:100%!important;max-width:100%!important;min-width:0!important;
    height:auto!important;max-height:360px!important;min-height:0!important;
    overflow-x:auto!important;overflow-y:hidden!important;
    overscroll-behavior-x:contain;
    scroll-behavior:smooth;scroll-snap-type:x proximity;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y;
    align-items:center!important;justify-content:flex-start!important;
    padding:14px max(4px,6vw) 18px!important;
    margin:0!important;
  }
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs::-webkit-scrollbar{display:none}
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs>*{
    box-sizing:border-box!important;display:block!important;
    flex:0 0 clamp(178px,60vw,238px)!important;
    width:clamp(178px,60vw,238px)!important;
    max-width:clamp(178px,60vw,238px)!important;
    height:auto!important;max-height:335px!important;min-height:0!important;
    scroll-snap-align:center;
    margin:0!important;
    transform:rotate(-2deg);
    transform-origin:center center;
  }
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs>*:nth-child(2n){transform:rotate(1.8deg)}
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs>*:nth-child(3n){transform:rotate(-1deg)}
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs>*:focus-visible{outline:3px solid var(--orange,#ff5a00);outline-offset:3px}
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-thumbs img{
    box-sizing:border-box!important;
    display:block!important;width:100%!important;max-width:100%!important;
    height:clamp(222px,72vw,288px)!important;max-height:288px!important;
    aspect-ratio:auto!important;object-fit:contain!important;
    object-position:center center!important;
    border-radius:10px;
  }
  body.home-story-v2 #galeria .home-gallery-browser .home-gallery-page-arrow{
    display:flex!important;flex:0 0 34px!important;width:34px!important;max-width:34px!important;
    height:38px!important;min-height:38px!important;
    align-items:center;justify-content:center;
    padding:0!important;z-index:12;
    position:relative!important;
  }
  body.home-story-v2 #galeria .home-gallery-browser__foot{font-size:12px!important;padding:5px 10px!important}
  /* Alternate gallery used by desktop R7 code on some deployments. */
  body.home-story-v2 #galeria .home-r7-gallery-shell{display:block!important;min-width:0!important;max-width:100%!important;overflow:hidden!important}
  body.home-story-v2 #galeria .home-r7-gallery-viewport{
    display:block!important;overflow-x:auto!important;overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;max-width:100%!important;width:100%!important;
    padding:15px 15px 22px!important;
  }
  body.home-story-v2 #galeria .home-r7-gallery-viewport::-webkit-scrollbar{display:none}
  body.home-story-v2 #galeria .home-r7-gallery-track{
    display:flex!important;flex-wrap:nowrap!important;gap:14px!important;
    width:max-content!important;max-width:none!important;min-width:max-content!important;
  }
  body.home-story-v2 #galeria .home-r7-gallery-card{
    display:block!important;flex:0 0 clamp(205px,71vw,270px)!important;
    width:clamp(205px,71vw,270px)!important;min-width:0!important;
    transform:rotate(-2deg);scroll-snap-align:center;
  }
  body.home-story-v2 #galeria .home-r7-gallery-card:nth-child(2n){transform:rotate(2deg)}
  body.home-story-v2 #galeria .home-r7-gallery-card img{
    width:100%!important;height:clamp(225px,72vw,300px)!important;
    max-height:300px!important;object-fit:contain!important;
  }
  body.home-story-v2 #galeria .home-r7355-story-short{
    flex-direction:column!important;align-items:flex-start!important;
    margin:15px auto!important;padding:18px 17px!important;
    width:calc(100% - 22px)!important;max-width:calc(100% - 22px)!important;gap:13px!important;
  }
  body.home-story-v2 #galeria .home-r7355-story-short__link{width:100%;justify-content:center}
  body.home-story-v2 #jak-to-dziala .home-marta-examples>div{padding:13px!important}
  body.home-story-v2 #jak-to-dziala .home-platform-definition{padding:12px!important}
  body.home-story-v2 #mini-gry .home-r8-gallery-copy{padding:10px!important}
  body.home-story-v2 #main #galeria,
  body.home-story-v2 #main #jak-to-dziala,
  body.home-story-v2 #main #mini-gry{min-height:0!important;height:auto!important}
}
@media(prefers-reduced-motion:reduce){
  body.home-story-v2 #galeria .home-gallery-thumbs,
  body.home-story-v2 #galeria .home-r7-gallery-viewport{scroll-behavior:auto!important}
}