/* Ekran "Wysłane" (G1, 27.09.2026): wspolny komponent potwierdzenia wysylki maila.
   Uzycie i API: assets/wspolne/wyslano.js (window.IPWyslano). Wszystkie klasy z prefiksem
   ipw-, bez zmiennych i regul globalnych, zeby nie ruszac strony, na ktorej siedzi.
   Kolory marki: zielen #0d6b4e, papier #fffdf6. Animacja ok. 1,5 s: list wsuwa sie do
   koperty, klapka sie zamyka, koperta odlatuje, rysuje sie zielony znaczek. Przy
   prefers-reduced-motion od razu znaczek, bez koperty. */
.ipw{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;max-width:520px;margin:0 auto;
  padding:18px 16px 16px;border:1px solid #d9d2c1;border-radius:14px;background:#fffdf6;color:#141b18;text-align:center;
  font:inherit;line-height:1.5}
.ipw *,.ipw *::before,.ipw *::after{box-sizing:border-box}
.ipw-scena{position:relative;width:132px;height:92px;margin:0 auto 2px}
.ipw-scena svg{display:block;width:100%;height:100%;overflow:visible}
.ipw p.ipw-tytul{margin:0;line-height:1.35;font-size:17px;font-weight:700;letter-spacing:-.005em;color:#141b18;outline:none;overflow-wrap:anywhere}
.ipw p.ipw-tytul b,.ipw p.ipw-tresc b{font-weight:700;color:#0d6b4e;white-space:nowrap}
.ipw p.ipw-tresc{margin:0;line-height:1.5;max-width:440px;font-size:14px;color:#444e48;overflow-wrap:anywhere}
.ipw-akcje{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}
.ipw a.ipw-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border:1px solid #0d6b4e;border-radius:999px;
  background:#fff;color:#0d6b4e;font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .15s,color .15s}
.ipw a.ipw-btn:hover{background:#0d6b4e;color:#fffdf6}
.ipw a.ipw-btn:focus-visible,.ipw button.ipw-ponow:focus-visible{outline:2px solid #0d6b4e;outline-offset:2px}
.ipw a.ipw-btn svg{width:15px;height:15px;flex:none}
.ipw p.ipw-dol{margin:6px 0 0;line-height:1.5;font-size:13px;color:#5c6660}
.ipw button.ipw-ponow{display:inline;width:auto;min-width:0;min-height:0;padding:0;margin:0;border:0;border-radius:0;background:none;box-shadow:none;filter:none;opacity:1;flex:none;font:inherit;line-height:1.5;font-size:13px;font-weight:600;color:#0d6b4e;
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.ipw button.ipw-ponow:hover{filter:none;color:#0a5a41}
.ipw button.ipw-ponow:disabled{opacity:1;color:#5c6660;text-decoration:none;cursor:default;font-weight:500}
.ipw-licznik{font-variant-numeric:tabular-nums}
.ipw .ipw-info{display:block;min-height:0;margin-top:2px;font-size:12.5px;color:#0d6b4e}
.ipw .ipw-info.ipw-blad{color:#a3281f}
.ipw .ipw-info:empty{display:none}

/* Scena: list, koperta (cialo + klapka), kolo i znaczek. */
.ipw-list{fill:#fff;stroke:#b9b09c;stroke-width:1.5}
.ipw-linia{stroke:#d9d2c1;stroke-width:2;stroke-linecap:round}
.ipw-kop{fill:#f1ead9;stroke:#0d6b4e;stroke-width:2;stroke-linejoin:round}
.ipw-kop-v{fill:none;stroke:#0d6b4e;stroke-width:1.6;stroke-linejoin:round;opacity:.55}
.ipw-klapa{fill:#e6ddc6;stroke:#0d6b4e;stroke-width:2;stroke-linejoin:round}
.ipw-kolo{fill:#0d6b4e}
.ipw-znak{fill:none;stroke:#fffdf6;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:44;stroke-dashoffset:44}
.ipw-g-koperta{transform-box:view-box;transform-origin:66px 58px}
.ipw-g-list{transform-box:view-box}
.ipw-klapa{transform-box:view-box;transform-origin:66px 34px}
.ipw-g-znak{transform-box:view-box;transform-origin:66px 46px;opacity:0;transform:scale(.4)}

/* Przebieg (1,5 s). Klasa ipw-gra wlacza animacje, ipw-koniec to stan koncowy bez animacji. */
.ipw-gra .ipw-g-list{animation:ipw-list .38s cubic-bezier(.3,.7,.4,1) both}
.ipw-gra .ipw-klapa{animation:ipw-klapa .26s .34s cubic-bezier(.4,0,.2,1) both}
.ipw-gra .ipw-g-koperta{animation:ipw-odlot .5s .62s cubic-bezier(.55,0,.8,.3) both}
.ipw-gra .ipw-g-znak{animation:ipw-kolo .34s 1.02s cubic-bezier(.2,.9,.3,1.25) both}
.ipw-gra .ipw-znak{animation:ipw-rysuj .3s 1.2s ease-out both}
@keyframes ipw-list{from{transform:translateY(-30px)}to{transform:translateY(0)}}
@keyframes ipw-klapa{from{transform:scaleY(-1)}to{transform:scaleY(1)}}
@keyframes ipw-odlot{0%{transform:translate(0,0) rotate(0) scale(1);opacity:1}
  100%{transform:translate(78px,-70px) rotate(-14deg) scale(.35);opacity:0}}
@keyframes ipw-kolo{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes ipw-rysuj{from{stroke-dashoffset:44}to{stroke-dashoffset:0}}
.ipw-koniec .ipw-g-koperta{display:none}
.ipw-koniec .ipw-g-znak{opacity:1;transform:none}
.ipw-koniec .ipw-znak{stroke-dashoffset:0}

@media (prefers-reduced-motion:reduce){
  .ipw-gra .ipw-g-list,.ipw-gra .ipw-klapa,.ipw-gra .ipw-g-koperta,.ipw-gra .ipw-g-znak,.ipw-gra .ipw-znak{animation:none}
  .ipw .ipw-g-koperta{display:none}
  .ipw .ipw-g-znak{opacity:1;transform:none}
  .ipw .ipw-znak{stroke-dashoffset:0}
  .ipw a.ipw-btn{transition:none}
}
@media (max-width:420px){
  .ipw{padding:16px 12px 14px}
  .ipw-akcje{flex-direction:column;align-items:stretch;width:100%}
  .ipw a.ipw-btn{width:100%}
}