*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#141009;color:#e9dcc0;font:22px/1.45 "EB Garamond",Georgia,serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:#e3bd72;text-underline-offset:5px}button:focus-visible,a:focus-visible{outline:2px solid #f6deb1;outline-offset:6px}button{border-radius:0}.topbar{height:86px;padding:0 5vw;display:flex;gap:36px;align-items:center;background:linear-gradient(#141009b0,#141009b0),url("assets/skora.png");border-bottom:1px solid #b17921;position:relative;z-index:2}.brand{font:30px Cinzel,serif;text-decoration:none;letter-spacing:.14em}.topbar nav{display:flex;gap:30px;margin-left:auto}.topbar nav a{font:14px Cinzel,serif;text-decoration:none}.play-game{background:#4e3416;border:1px solid #c68f30;box-shadow:inset 0 0 0 4px #21170b,inset 0 0 0 5px #a1722a;padding:12px 28px;font:16px Cinzel,serif}.play-game span{padding-left:18px}.hero{position:relative;isolation:isolate;min-height:820px;height:calc(100svh - 86px);max-height:1200px}.panorama,.shade{position:absolute;inset:0;z-index:-3}.panorama{background:url("assets/ruiny-gorskie.webp") center/cover no-repeat}.shade{z-index:-2;background:linear-gradient(90deg,#100d09ed 0%,#100d09ad 40%,#100d0933 76%),linear-gradient(0deg,#141009 0%,#14100900 36%,#14100933)}.frame{position:absolute;inset:12px 13px 18px;pointer-events:none;border:1px solid #b1792180;outline:1px solid #a1722a66;outline-offset:7px}.frame i{position:absolute;width:36px;height:36px;background:url("assets/okucie-narozne.png") center/contain no-repeat}.frame i:nth-child(1){top:-7px;left:-7px}.frame i:nth-child(2){top:-7px;right:-7px;transform:rotate(90deg)}.frame i:nth-child(3){bottom:-7px;right:-7px;transform:rotate(180deg)}.frame i:nth-child(4){bottom:-7px;left:-7px;transform:rotate(270deg)}.hero-grid{width:88%;max-width:1700px;margin:auto;display:grid;grid-template-columns:1.25fr 1fr;gap:5vw;align-items:center;height:100%;padding:38px 0 85px}.story{min-width:0}.logo-crop{width:340px;max-width:80%;aspect-ratio:1536/650;overflow:hidden;mix-blend-mode:lighten;margin:0 0 28px -38px}.logo-crop img{display:block;width:100%;height:auto}.eyebrow{font:11px/1.6 Cinzel,serif;letter-spacing:.17em;color:#e3bd72}.headlines{display:grid;margin-top:28px}.slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .45s ease;pointer-events:none}.slide.active{opacity:1;visibility:visible}.slide.leaving{opacity:0;visibility:visible}.slide h1{font:400 clamp(34px,3.35vw,64px)/1.07 "EB Garamond",serif;letter-spacing:-.02em;margin:0 0 22px;text-wrap:balance;text-shadow:0 2px 18px #000}.slide p{font-size:clamp(19px,1.4vw,26px);color:#d8c9af;max-width:610px;margin:0;line-height:1.45}.rotation{display:flex;gap:25px;align-items:center;margin-top:34px}.dots{display:flex;gap:12px}.dots button{background:none;border:0;border-bottom:1px solid #9d784050;min-width:40px;padding:8px 4px;color:#c1b393;font:12px "JetBrains Mono",monospace}.dots button[aria-pressed=true]{color:#e3bd72;border-color:#e3bd72}.rotation>button{font:13px "EB Garamond",serif;background:none;border:0;color:#d8c9af;padding:10px}.film-invitation{text-align:center;display:flex;align-items:center;flex-direction:column;padding-top:60px;text-shadow:0 2px 18px #000}.main-play{width:112px;height:112px;border:1px solid #e3bd72;border-radius:50%;outline:1px solid #e3bd7266;outline-offset:9px;background:#14100988;display:grid;place-items:center;margin:44px 0 26px;box-shadow:0 8px 60px #0006;transition:background .2s,transform .2s}.main-play:hover{background:#493017cc;transform:scale(1.04)}svg{width:50px;fill:#e3bd72}.film-invitation h2{font:28px Cinzel,serif;margin:0}.film-invitation>p{font-size:19px;color:#e0d1b7;margin:8px 0 38px}.gameplay{background:#141009a8;border:1px solid #b17921;padding:16px 32px;font:16px Cinzel,serif;min-width:280px}.gameplay span{color:#e3bd72;font-size:25px;margin-right:10px}.gameplay small{display:block;font:17px "EB Garamond",serif;color:#c4b494;margin-top:5px}.gameplay:hover{background:#36281bdc}.pending{font-size:14px;color:#e1d1b8;margin-top:22px}.hero-bottom{position:absolute;left:6%;right:6%;bottom:39px;display:flex;justify-content:space-between;font:10px Cinzel,serif;color:#cab998;letter-spacing:.13em}.review-note{max-width:1020px;margin:auto;padding:65px 28px}.review-note h2{font-size:36px;font-weight:400}.review-note p{color:#c7b798}dialog{width:min(1000px,92vw);max-height:90svh;overflow:auto;border:1px solid #c68f30;background:#201a12;color:#e9dcc0;padding:38px;box-shadow:0 0 0 6px #141009,0 0 0 7px #795524}dialog::backdrop{background:#090704da}dialog h2{font:28px Cinzel,serif;margin:12px 0 25px}.close{position:absolute;right:14px;top:8px;background:none;border:0;font:32px Georgia}.video-slot{aspect-ratio:16/9;background:linear-gradient(#141009ad,#141009f0),url("assets/ruiny-gorskie.webp") center/cover;display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #795524;padding:20px;text-align:center}.video-slot p{max-width:560px;font-size:22px}.dialog-note{font-size:15px;color:#baaa90}.return{background:none;border:1px solid #a1722a;padding:8px 20px}body.modal-open{overflow:hidden}@media(max-width:1100px){.hero{height:auto;min-height:820px}.hero-grid{grid-template-columns:1.15fr 1fr;gap:35px;min-height:820px}.slide h1{font-size:44px}.logo-crop{width:290px}.film-invitation>.eyebrow{max-width:220px}.rotation{gap:6px}.dots{gap:3px}}@media(max-width:700px){.topbar{height:70px;padding:0 20px;gap:8px}.brand{font-size:20px}.topbar nav{display:none}.play-game{margin-left:auto;font-size:12px;padding:12px 18px}.play-game span{display:none}.hero-grid{grid-template-columns:1fr;gap:15px;padding:25px 0 90px;min-height:0;width:calc(100% - 52px)}.hero{min-height:0}.logo-crop{width:220px;margin:0 0 12px -23px}.eyebrow{font-size:9px}.headlines{margin-top:20px}.slide h1{font-size:36px}.slide h1 br{display:none}.slide p{font-size:19px}.rotation{margin-top:20px;justify-content:space-between}.dots{gap:3px}.dots button{min-width:36px}.film-invitation{padding-top:14px}.film-invitation>.eyebrow{display:none}.main-play{width:70px;height:70px;margin:15px 0 20px}.main-play svg{width:35px}.film-invitation h2{font-size:22px}.film-invitation>p{font-size:16px;margin:7px 0 20px}.gameplay{min-width:0;width:100%;font-size:13px;padding:10px 18px}.gameplay small{font-size:15px}.pending{margin-top:14px;font-size:12px}.hero-bottom{font-size:8px;bottom:30px}.review-note{padding-top:30px}.review-note h2{font-size:30px}dialog{padding:30px 20px}.video-slot{aspect-ratio:auto;min-height:260px}.video-slot p{font-size:19px}.shade{background:linear-gradient(90deg,#100d09e0,#100d0970),linear-gradient(0deg,#141009,#14100900 65%)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* v4 — pełna oprawa i płynne przenikanie */
.hero{min-height:760px;max-height:1050px}
.hero::before{content:"";position:absolute;inset:0;border:25px solid #18130c;pointer-events:none;z-index:-1;box-shadow:inset 0 0 20px #0009}
.frame{inset:2px;border:30px solid transparent;border-image:url("assets/rama-wykroj.png") 88 round;outline:none}
.frame i{display:none}
.slide{transition:opacity 1.2s cubic-bezier(.4,0,.2,1),visibility 0s linear 1.2s}
.slide.active{transition:opacity 1.2s cubic-bezier(.4,0,.2,1),visibility 0s linear}
.topbar{gap:25px;padding-inline:4vw}
.topbar nav{gap:22px;align-items:center}
.topbar nav button{font:14px Cinzel,serif;color:#e3bd72;border:0;background:none;padding:10px 0}
.topbar nav a{padding:10px 0}
.topbar nav button:hover,.topbar nav a:hover{color:#fff0cb}
.menu-toggle{display:none}
@media(max-width:1200px){.topbar{gap:18px;padding-inline:3vw}.topbar nav{gap:15px}.topbar nav a,.topbar nav button{font-size:12px}.brand{font-size:24px}.play-game{padding-inline:20px}}
@media(max-width:1000px){.menu-toggle{display:block;margin-left:auto;background:none;border:1px solid #a1722a;padding:10px 12px;font:12px Cinzel,serif}.topbar nav{display:none;position:absolute;right:20px;top:calc(100% - 1px);background:#21190ef7;border:1px solid #a1722a;min-width:225px;padding:18px 26px;box-shadow:0 15px 40px #000b;flex-direction:column;align-items:stretch;gap:2px}.topbar nav.open{display:flex}.topbar nav button,.topbar nav a{text-align:left;font-size:14px}.play-game{margin-left:0}}
@media(max-width:700px){.topbar{padding-inline:17px;gap:9px}.brand{font-size:18px;letter-spacing:.08em}.play-game{padding-inline:13px}.hero{height:auto;min-height:0}.hero::before{border-width:16px}.frame{border-width:20px}.hero-grid{width:calc(100% - 62px)}.hero-bottom{left:30px;right:30px;gap:15px}.hero-bottom span:first-child{max-width:160px}}

/* v5 — finalizacja kompozycji pierwszego ekranu */
.topbar{height:88px;padding:0 4.5vw;box-shadow:0 3px 20px #0008;background:linear-gradient(0deg,#141009e8,#241b11cc),url("assets/skora.png")}
.brand{display:flex;align-items:center;justify-content:center;width:135px;height:74px;flex-shrink:0}
.brand img{display:block;width:132px;height:66px;object-fit:contain}
.topbar nav{gap:28px}
.topbar nav a,.topbar nav button{font-size:13px;letter-spacing:.025em}
.topbar nav [aria-current=page]{color:#f4dfb7;box-shadow:0 1px #d1a154}
.play-game{min-height:46px;background:linear-gradient(#715025,#4c3115);box-shadow:inset 0 0 0 3px #21170b,inset 0 0 0 4px #a1722a,0 4px 12px #0005;transition:background .2s,box-shadow .2s}
.play-game:hover{background:linear-gradient(#896132,#60441e);box-shadow:inset 0 0 0 3px #21170b,inset 0 0 0 4px #d0a35a,0 4px 18px #0008}
.play-game:active{background:#493018}
.hero{height:clamp(730px,42vw,870px);min-height:730px;max-height:none;margin:14px 20px 0}
.panorama{inset:23px;background-image:url("assets/ruiny-wzgorza.webp");background-position:50% 53%}
.panorama canvas{display:block;pointer-events:none}
.shade{inset:23px;background:linear-gradient(90deg,#100c0890 0%,#100c0858 29%,#100c0818 57%,#100c0800 76%),linear-gradient(0deg,#100c0870 0%,#100c0800 38%,#100c0814)}
.story{text-shadow:0 2px 9px #100c08c9,0 0 20px #100c0888}
.film-invitation>.eyebrow{text-shadow:0 1px 3px #100c08}
.video-slot{background-image:linear-gradient(#141009ad,#141009f0),url("assets/ruiny-wzgorza.webp")}
.hero::before{border-color:#161008;box-shadow:inset 0 0 22px #000a}
.frame{border-width:28px;filter:drop-shadow(0 3px 5px #0008)}
.hero-grid{width:88%;grid-template-columns:1.05fr 1fr;gap:8%;padding:30px 0 66px;min-height:0}
.hero-logo{width:350px;max-width:80%;margin:0 0 20px -17px;filter:drop-shadow(0 2px 4px #0008)}
.hero-logo img{width:100%;height:auto;display:block}
.story>.eyebrow{font-size:10px;letter-spacing:.18em;margin:12px 0}
.headlines{margin-top:25px}
.slide h1{font-size:clamp(38px,3.1vw,59px);line-height:1.06;margin-bottom:20px;text-shadow:0 2px 10px #0009}
.slide p{font-size:23px;line-height:1.35;max-width:590px;color:#e0d3be}
.rotation{margin-top:25px;gap:26px}
.dots button{min-width:42px;min-height:40px}
.rotation>button{font-size:14px;min-height:40px}
.film-invitation{padding:18px 0 0;align-self:center;position:relative}
.film-invitation>.eyebrow{font-size:11px;letter-spacing:.23em;padding:8px 20px;background:radial-gradient(ellipse,#141009b0,transparent 72%);color:#f0d4a0}
.main-play{width:108px;height:108px;margin:30px 0 24px;background:radial-gradient(circle,#332211e6,#100b07c9);border-color:#e3bd72;outline-color:#d6a64a85;box-shadow:0 3px 24px #0008,inset 0 0 20px #d6a64a12}
.main-play:hover{background:radial-gradient(circle,#69502be8,#211407e0);transform:scale(1.04)}
.main-play:active{transform:scale(.98)}
.film-invitation h2{font-size:30px;letter-spacing:.025em;text-shadow:0 2px 8px #000,0 0 30px #000}
.film-invitation>p{font-size:20px;margin:8px 0 26px;text-shadow:0 2px 7px #000,0 0 20px #000}
.gameplay{min-width:330px;padding:18px 24px;background:linear-gradient(#1b130bf0,#20180ee8),url("assets/skora.png");box-shadow:inset 0 0 0 4px #21160d,inset 0 0 0 5px #a1722a66,0 8px 28px #0007;border-color:#ad7c32;transition:background .2s,border-color .2s}
.gameplay small{font-size:16px;color:#d0bea1;margin-top:8px}
.gameplay:hover{background:linear-gradient(#392815eb,#261b0ef0),url("assets/skora.png");border-color:#e3bd72}
.pending{font-size:13px;background:#141009a6;padding:4px 12px;margin-top:20px}
.hero-bottom{left:6%;right:6%;bottom:39px;font-size:9px;letter-spacing:.11em;color:#d7c5a5}
.review-note{padding-top:40px}
dialog{background:linear-gradient(#201a12ed,#17110af5),url("assets/skora.png")}
.return:hover{background:#5b3d1d}
@media(max-width:1200px){.topbar nav{gap:16px}.topbar{padding-inline:3vw;gap:20px}.hero-grid{gap:5%;width:87%}.hero-logo{width:310px}.slide h1{font-size:44px}.slide p{font-size:22px}.gameplay{min-width:290px}.hero{margin-inline:12px}}
@media(max-width:1000px){.topbar nav{gap:3px}.topbar nav [aria-current=page]{box-shadow:none}.brand{width:120px}.brand img{width:120px}.hero-grid{grid-template-columns:1.1fr 1fr;gap:25px}.gameplay{min-width:0;width:100%;font-size:14px}}
@media(max-width:700px){.topbar{height:76px;padding-inline:18px;gap:12px}.brand{width:108px;height:62px}.brand img{width:108px;height:54px}.play-game{font-size:12px;min-height:42px;padding-inline:14px}.hero{height:auto;min-height:0;margin:8px 5px 0}.hero::before{border-width:15px}.panorama,.shade{inset:17px}.panorama{background-position:57% center}.shade{background:linear-gradient(0deg,#100c08df,#100c0880 50%,#100c08b8),linear-gradient(90deg,#100c0860,#100c0800)}.frame{border-width:19px}.hero-grid{grid-template-columns:1fr;width:calc(100% - 59px);padding:23px 0 80px;gap:12px}.hero-logo{width:245px;max-width:95%;margin:0 0 22px -9px}.story>.eyebrow{font-size:9px;line-height:1.7;max-width:270px;letter-spacing:.1em}.headlines{margin-top:20px}.slide h1{font-size:35px;line-height:1.07}.slide p{font-size:20px}.rotation{margin-top:16px;gap:8px}.dots button{min-width:34px}.rotation>button{font-size:13px;padding:8px 0}.film-invitation{padding-top:12px}.main-play{width:78px;height:78px;margin:16px 0 24px}.film-invitation h2{font-size:23px}.film-invitation>p{font-size:17px;margin-bottom:24px}.gameplay{padding:14px 16px}.gameplay small{font-size:14px;line-height:1.4}.pending{font-size:11px;padding:4px 8px;margin-top:17px}.hero-bottom{left:29px;right:29px;font-size:8px;bottom:30px}.hero-bottom span:last-child{max-width:110px;text-align:right}.review-note{padding:30px 24px}}

/* v6 — Zagraj: skóra i przygaszony mosiądz, bez bursztynowego wypełnienia */
.play-game{
  color:#e9dcc0;
  border-color:#a1722a;
  background:linear-gradient(#241f17e8,#141009ed),url("assets/skora.png");
  box-shadow:inset 0 0 0 3px #141009,inset 0 0 0 4px #a1722a70,0 3px 10px #0005;
  text-shadow:0 1px 2px #000;
}
.play-game:hover{
  color:#f3e4c8;
  border-color:#c49a56;
  background:linear-gradient(#342b1eef,#241f17f2),url("assets/skora.png");
  box-shadow:inset 0 0 0 3px #141009,inset 0 0 0 4px #c49a5680,0 3px 12px #0007;
}
.play-game:active{
  color:#e9dcc0;
  border-color:#a1722a;
  background:linear-gradient(#141009f2,#211b13f0),url("assets/skora.png");
  box-shadow:inset 0 0 0 3px #141009,inset 0 0 0 4px #a1722a60,inset 0 3px 8px #0008;
}

/* v7: wygaszanie całego bloku kontroluje Web Animations API, a nie kaskada transition. */
.headlines{opacity:1}
.slide,.slide.active,.slide.leaving{transition:none!important}
.slide{visibility:hidden;opacity:0}
.slide.active{visibility:visible;opacity:1}
.rotation>button{max-width:180px}
@media(max-width:700px){.shade{background:linear-gradient(0deg,#100c08a0,#100c084a 50%,#100c0866),linear-gradient(90deg,#100c084a,#100c0800)}}

/* 24.09.2026 — przed wczytaniem panoramy czarne tło zamiast figur zastępczych (weather-hero.js, `pokazGdyGotowa`). */
.panorama{background:#000!important}.panorama canvas{opacity:0;transition:opacity .7s ease}.panorama.gotowa canvas{opacity:1}