:root{
  --red:#e30613;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial}

/* ===== PRELOADER ===== */
#preloader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;
  background:#fff url('expander_zmieniamy.png') center center/cover no-repeat fixed;
  transition:opacity .6s ease,visibility .6s ease}
#preloader.hidden{opacity:0;visibility:hidden}
#preloader .overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(255,255,255,.12),rgba(255,255,255,.5))}
#preloader .center{position:relative;display:grid;gap:10px;justify-items:center;text-align:center}
.spinner{width:44px;height:44px;border:4px solid rgba(255,255,255,.7);border-top-color:var(--red);border-radius:50%;animation:spin 1s linear infinite;filter:drop-shadow(0 1px 6px rgba(0,0,0,.25))}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-text{margin:0;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}

/* ===== APP (pełnoekranowa plansza) ===== */
.app[hidden]{display:none!important}
.app{position:relative;min-height:100dvh;background:#fff url('expander_zmieniamy.png') center center/cover no-repeat fixed}
.fullscreen-link{position:absolute;inset:0;display:block;text-indent:-9999px}
.fullscreen-link:focus-visible{outline:3px solid var(--red);outline-offset:-3px}

@media (prefers-reduced-motion:reduce){.spinner{animation:none;border-top-color:#bbb}#preloader{transition:none}}