/* ============================================================
   Styka Intro — ekran ładowania (uniwersalny).
   ============================================================ */

:root{--styka-intro-bg:#0c0f0b;--styka-intro-accent:#a8c62c}

html.styka-intro-lock{overflow:hidden !important}

.styka-intro{
	position:fixed;inset:0;z-index:2147483000;
	display:grid;place-items:center;
	background:var(--styka-intro-bg);
	opacity:1;visibility:visible;
	transition:opacity .55s ease,visibility .55s ease;
}
/* Jeśli strona nie jest zablokowana (np. tryb „raz na sesję” po pierwszym razie) — nie pokazuj */
html:not(.styka-intro-lock) .styka-intro{opacity:0;visibility:hidden;pointer-events:none}
.styka-intro.is-done{opacity:0;visibility:hidden;pointer-events:none}

.styka-intro__inner{display:flex;flex-direction:column;align-items:center;gap:22px;padding:24px}

/* subtelna poświata za logo */
.styka-intro__inner::before{
	content:"";position:absolute;width:340px;height:340px;border-radius:50%;
	background:radial-gradient(circle,color-mix(in srgb,var(--styka-intro-accent) 22%,transparent),transparent 70%);
	filter:blur(30px);z-index:-1;
}

/* LOGO */
.styka-intro__logo img{display:block;height:auto;animation:styka-intro-breathe 1.9s ease-in-out infinite}
@keyframes styka-intro-breathe{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.07);opacity:1}}

/* NAPIS */
.styka-intro__text{
	font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
	font-weight:800;font-size:clamp(28px,6vw,52px);letter-spacing:-.02em;
	background:linear-gradient(90deg,#fff 0%,var(--styka-intro-accent) 50%,#fff 100%);
	background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
	animation:styka-intro-shimmer 2.4s linear infinite;
}
@keyframes styka-intro-shimmer{to{background-position:-200% 0}}

/* SPINNER: pasek */
.styka-intro__bar{position:relative;width:150px;height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.styka-intro__bar::before{content:"";position:absolute;top:0;left:0;height:100%;width:40%;border-radius:3px;
	background:linear-gradient(90deg,transparent,var(--styka-intro-accent),transparent);
	animation:styka-intro-bar 1.1s ease-in-out infinite}
@keyframes styka-intro-bar{0%{transform:translateX(-110%)}100%{transform:translateX(360%)}}

/* SPINNER: kółko */
.styka-intro__ring{width:38px;height:38px;border-radius:50%;
	border:3px solid rgba(255,255,255,.14);border-top-color:var(--styka-intro-accent);
	animation:styka-intro-spin .8s linear infinite}
@keyframes styka-intro-spin{to{transform:rotate(360deg)}}

/* SPINNER: kropki */
.styka-intro__dots{display:flex;gap:8px}
.styka-intro__dots span{width:9px;height:9px;border-radius:50%;background:var(--styka-intro-accent);animation:styka-intro-dot 1s ease-in-out infinite}
.styka-intro__dots span:nth-child(2){animation-delay:.15s}
.styka-intro__dots span:nth-child(3){animation-delay:.3s}
@keyframes styka-intro-dot{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-8px);opacity:1}}

@media(prefers-reduced-motion:reduce){
	.styka-intro__logo img,.styka-intro__text,.styka-intro__bar::before,.styka-intro__ring,.styka-intro__dots span{animation:none}
}
