/* ═══════════════ Plakietka makiety ═══════════════
   Makiety sa linkowane publicznie z /realizacje, wiec ktos moze trafic na nie
   z pominieciem kontekstu (link wyslany dalej, zakladka, historia). Stopka
   kazdej makiety ma pelny disclaimer, ale dopiero na samym koncu strony —
   plakietka mowi to samo od pierwszego ekranu i prowadzi z powrotem do zorna.

   Arkusz jest wspolny dla trzech makiet i celowo nie korzysta z ich tokenow:
   ma wygladac jak warstwa zorna nalozona na cudzy projekt, a nie jak jego
   element. Lewy dolny rog jest wolny we wszystkich trzech makietach
   (plywajace CTA Meridiana siedzi po prawej), z-index 70 trzyma plakietke
   pod nawigacja i preloaderem, nad trescia. */
.zorna-plakietka{
  position:fixed;left:clamp(.75rem,2.4vw,1.4rem);bottom:clamp(.75rem,2.4vw,1.4rem);
  z-index:70;display:inline-flex;align-items:center;gap:.55em;
  padding:.62em 1em;border-radius:999px;
  background:rgba(5,6,7,.82);border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:#eef0f2;text-decoration:none;
  font:400 11.5px/1 'JetBrains Mono','SFMono-Regular',ui-monospace,monospace;
  letter-spacing:.04em;
  transition:border-color .3s ease,background .3s ease;
}
.zorna-plakietka:hover,
.zorna-plakietka:focus-visible{border-color:rgba(255,255,255,.45);background:rgba(5,6,7,.94)}
.zorna-plakietka:focus-visible{outline:2px solid #eef0f2;outline-offset:3px}
.zorna-plakietka b{font-weight:500}
.zorna-plakietka-kropka{
  width:6px;height:6px;flex:none;border-radius:50%;background:#eef0f2;
  animation:zornaPlakietkaPuls 1.8s ease-in-out infinite;
}
@keyframes zornaPlakietkaPuls{0%,100%{opacity:1}50%{opacity:.35}}

/* Na waskich ekranach plakietka zjada miejsce pod tresc, wiec zostaje sam
   skrot bez drugiego zdania. */
.zorna-plakietka-dlugi{display:inline}
@media (max-width:560px){
  .zorna-plakietka{font-size:10.5px;padding:.55em .8em}
  .zorna-plakietka-dlugi{display:none}
}

@media (prefers-reduced-motion:reduce){
  .zorna-plakietka-kropka{animation:none}
  .zorna-plakietka{transition:none}
}

@media print{.zorna-plakietka{display:none}}