/* Finał na mostku na telewizorze (public/mostek.js): scena 960x540 skalowana transformem, sala z polami jak .wz-room (wieza.css), wszystko w px sceny;
   rzeczy nad głowami są w spricie załogi (.tspr, px sali: razy 2,69 na scenie). Bez filtrów (WebKit). */
.mo{position:fixed;inset:0;z-index:0;overflow:hidden;background:#05060e;pointer-events:none}
.mo[hidden]{display:none}
.mo-sc{position:absolute;left:0;top:0;width:960px;height:540px;transform-origin:0 0}
.mo-sc>*{position:absolute}
.mo-sc>[hidden]{display:none}
/* nad głową: osłony i kropka „odpowiedział”, pod stopami ksywka, przy odpadnięciu napis i snop światła */
.mo .tspr .mo-od{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);margin-bottom:-5px;display:flex;flex-direction:column;align-items:center;gap:1px;z-index:2}
.mo .tspr .mo-tar{display:flex;gap:.5px;white-space:nowrap}
.mo .tspr .mo-tar img{width:6px;height:6px;image-rendering:pixelated}
.mo .tspr .mo-gotowe{width:4px;height:4px;border-radius:50%;background:#5fe3a8;border:1px solid #05060f;opacity:0;transition:opacity .2s}
.mo .tspr.gotowy .mo-gotowe{opacity:1}
.mo .tspr .mo-nk{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:-3px;font-family:var(--display);font-size:4px;line-height:5px;color:#e9ecff;background:#0b0e26e0;border:.5px solid var(--c);padding:0 1.5px;white-space:nowrap;z-index:2}
.mo .tspr.wygral .mo-nk{background:var(--yellow,#f2c14e);color:#1a1430}
.mo .tspr .mo-odp{position:absolute;left:50%;top:38%;transform:translateX(-50%) rotate(-8deg);font:400 5px var(--display);color:#fff;background:#ff6b7d;border:1px solid #05060f;padding:0 2px;display:none;z-index:4;white-space:nowrap}
.mo .tspr.odpada .mo-odp{display:block}
.mo .tspr .mo-snop{position:absolute;left:50%;bottom:-3px;width:38px;height:122px;margin-left:-19px;opacity:0;image-rendering:pixelated;z-index:3}
.mo .tspr.znika{opacity:0;transition:opacity .3s}
/* pytanie u góry (jak w pokoju pytania), pod nim Głos Stacji; kafle odpowiedzi pod polami */
.mo-zeg{display:block;height:4px;margin-top:4px;background:#5fc8f5;transform-origin:0 50%;animation:moZeg linear forwards}
@keyframes moZeg{to{transform:scaleX(0)}}
.mo .mo-a{transition:opacity .4s,transform .3s}
.mo .mo-a.no{opacity:.3}
.mo .mo-a.ok{transform:scale(1.06);z-index:2}
.mo-info{left:12px;top:12px;display:flex;gap:6px}
.mo-info span{font-family:var(--display);font-size:12px;color:#9aa3d0;background:#141834ee;border:2px solid #05060f;padding:3px 8px}
.mo-info b{color:#e9ecff;font-weight:400}
.mo-wid{right:12px;top:12px;display:flex;gap:3px;align-items:center;background:#141834ee;border:2px solid #05060f;padding:3px 6px}
.mo-wid span{font-family:var(--display);font-size:10px;color:#9aa3d0;margin-right:3px}
.mo-wid img{width:20px;height:20px;border:1px solid var(--c)}
.mo-ban{left:50%;top:12px;transform:translateX(-50%);font-family:var(--display);font-size:15px;color:var(--yellow,#f2c14e);background:#141834ee;border:3px solid #05060f;padding:4px 14px;white-space:nowrap}
.mo-glos{display:flex;gap:8px;align-items:center;background:#0b0e26ee;border:3px solid #05060f;padding:5px 10px;font-family:var(--tk,var(--display));font-size:13px;color:#e9ecff}
.mo-glos[hidden]{display:none}
.mo-glos img{width:26px;image-rendering:pixelated}
.mo-glos b{display:block;font-family:var(--display);font-weight:400;font-size:10px;color:#5fc8f5}
/* telefon: twoje osłony nad pytaniem, liczba osłon nad głowami na pasie mostka */
.mo-stan{display:flex;align-items:center;gap:8px;padding:6px 10px;font-size:12px;color:var(--mut,#9aa3d0)}
.mo-stan b{font-family:var(--display);font-weight:400;font-size:12px;color:var(--yellow,#f2c14e);white-space:nowrap}
.mo-stan .mo-tt{display:flex;gap:2px;flex:1}
.mo-stan .mo-tt img{width:22px;height:22px;image-rendering:pixelated}
.mo-stan.wid b{color:#9aa3d0}
.mo-odz{display:inline-flex;align-items:center;gap:1px}
.mo-odz img{width:11px;height:11px;image-rendering:pixelated}
/* ---------- Supernowa (public/supernowa.js, makieta propozycje/mostek-efekty, koncepcja A): efekty w px sceny, tylko transform i opacity,
   światło przez plus-lighter na krótko żyjących warstwach; w spoczynku poświata pod osłonami i rzadka gwiazdka (mała, w CSS) ---------- */
.mo .tspr .mo-tar img{image-rendering:auto}
.mo .tspr .mo-snop{display:none}
.mo .tspr .mo-tar:not(:empty){position:relative;padding:2px 4px;margin:-2px -4px;border-radius:50%;background:radial-gradient(ellipse closest-side,#5fe3f08c,#5fe3f000)}
.mo .tspr .mo-tar:not(:empty)::after{content:'';position:absolute;left:30%;top:0;width:7px;height:7px;margin:-1px 0 0 -3.5px;opacity:0;pointer-events:none;mix-blend-mode:plus-lighter;
  background:radial-gradient(circle closest-side,#fff 25%,#fff0 70%) center/3px 3px no-repeat,linear-gradient(#fff,#fff) center/1px 100% no-repeat,linear-gradient(#fff,#fff) center/100% 1px no-repeat;animation:moPet 3.4s ease-in-out infinite}
.mo .tspr:nth-child(3n+1) .mo-tar::after{animation-delay:-1.2s;left:70%}
.mo .tspr:nth-child(3n+2) .mo-tar::after{animation-delay:-2.3s;left:50%}
@keyframes moPet{0%,80%,100%{opacity:0;transform:scale(.2) rotate(0)}88%{opacity:1;transform:scale(1) rotate(45deg)}}
.mo .tspr.fx-znik{background-image:none!important}
.mo .tspr.fx-znik .fx-jasn{display:none}
.mo .fx-jasn{position:absolute;mix-blend-mode:plus-lighter;opacity:0;pointer-events:none}
.mo-fx{position:absolute;left:0;top:0;width:960px;height:540px;pointer-events:none}
.mo-fx>*{position:absolute;left:0;top:0}
.mo-fx .sw{mix-blend-mode:plus-lighter;border-radius:50%}
.mo-fx .ray{width:0;height:0;mix-blend-mode:plus-lighter}
.mo-fx .ray i{position:absolute;bottom:0;transform-origin:50% 100%;border-radius:50%}
.mo-fx .str{height:3px;border-radius:3px;transform-origin:0 50%;mix-blend-mode:plus-lighter;z-index:622}
.mo-fx .emb{width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;mix-blend-mode:plus-lighter;z-index:621}
.mo-fx .gw{width:0;height:0;mix-blend-mode:plus-lighter}
.mo-fx .gw i{position:absolute;border-radius:50%}
.mo-fx .minus{font:400 17px var(--display);color:#fff;text-shadow:0 0 6px #ff3d5e,0 0 14px #ff3d5e,0 2px 0 #7a0f22;z-index:640;white-space:nowrap}
.mo-fx .ekran{width:960px;height:540px;z-index:880;mix-blend-mode:plus-lighter}
.mo-fx .orb{width:0;height:0;z-index:700}
.mo-fx .orb>*{position:absolute}
.mo-fx .orb img{left:-11px;top:-11px;width:22px;height:22px;border-radius:50%;border:2px solid #fff}
.mo-fx .dym{z-index:610;opacity:0}
@media (prefers-reduced-motion:reduce){.mo .tspr .mo-tar::after{animation:none}}
