/* Malowana oprawa z makiety ekranów (propozycje/kosmos/plansza/makieta-ekrany.html), nakładana na stacja.css.
   Ramki, przyciski, odpowiedzi, dymek i pasek czasu to 9-slice z arkusza e3 (img/orbita/ui), treść pytań i odpowiedzi czcionką Orbita Tekst
   (piksel 5×7 z małymi literami i polskimi znakami), tła sekcji szerokie 16:9, na telewizorze pulpity zawodników pod spodem.
   Wydajność WebKit: bez filtrów i masek, animacje tylko transform/opacity. */
@font-face{font-family:'Orbita Tekst';font-display:block;src:url(fonts/orbita-pixel-tekst.woff2) format('woff2')}
:root{--tk:'Orbita Tekst',monospace;--ui:url(img/orbita/ui/)}
.pan,.mate,.hc,.ban,.rjw,.mocon,.fact,.xpclaim,.empty,.st1,.tyt,.traitor,.kikib,.dz,.lp .r,.h1.q,.ord .o,.err,.modal .pan,.rola{image-rendering:pixelated}
img.pxi,.pop img,.dr img,.rura img,.rura .spr,.odk img,.stik{image-rendering:pixelated}

/* ---------- tła ---------- */
.scene .tlo{background-image:url(img/orbita/tla/telefon.webp?v=2)}
.tvfx .tlo{background-image:url(img/orbita/tla/tv.webp)}
.scene[data-sek]:not([data-sek=""]) .dim{background:rgba(6,7,20,.62)}
.scene[data-sek="mostek"] .dim{background:none}
.tvfx[data-sek]:not([data-sek=""])::after{background:rgba(6,7,20,.5)}
.tvfx[data-sek="mostek"]::after{background:none}
.korytarz{background-image:url(img/orbita/tla/korytarz.webp)}

/* ---------- panele: malowana ramka ---------- */
.pan,.mate,.hc,.ban,.rjw,.mocon,.fact,.xpclaim,.empty,.st1,.tyt,.traitor,.kikib,.lp .r,.ord .o,.err{background:none!important;border:12px solid transparent!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/24px!important;box-shadow:none!important;border-radius:0!important}
.pan,.hc,.fact,.xpclaim,.empty{padding:4px 6px}
.ord .o.drag{border-image-source:url(img/orbita/ui/panel-zloty.webp)!important}
.lp .r{padding:0 4px 0 0!important;min-height:44px}

/* ---------- Głos Stacji: malowany dymek z ogonkiem, obok interkom; tekst czcionką z pytań ---------- */
.say,.say.interkom{position:relative;background:none!important;box-shadow:none!important;border-radius:0!important;border-style:solid!important;border-color:transparent!important;border-width:8px 8px 22px 34px!important;border-image:url(img/orbita/ui/dymek.webp) 8 8 26 42 fill/8px 8px 22px 34px!important;padding:2px 4px 0 0!important;margin-left:30px;image-rendering:pixelated;display:block}
.say::before{content:"";position:absolute;left:-31px;top:-3px;width:28px;height:31px;background:url(img/orbita/ui/glos.webp) center/contain no-repeat;image-rendering:pixelated}
/* ikona Głosu Stacji (GS1, panel z falą): przy pojawieniu się dymka mówi 2,5 s (dwie klatki fali, zapalona lampka), potem cisza; dymek kamerobota ma własny obrazek */
.say:not(.kb)::before,.glosnik .gi{animation:glosMowi .36s steps(1) 7}
@keyframes glosMowi{0%{background-image:url(img/orbita/ui/glos-mowi-1.webp)}50%{background-image:url(img/orbita/ui/glos-mowi-2.webp)}}
/* telefon: ikona Głosu siedzi w lewej ramce dymka, więc bez wcięcia z lewej (dymek równo z panelami nad nim) */
body:not(.tv):not(.desk) .say{margin-left:0}
.glosnik .gi{display:block;width:100%;aspect-ratio:231/256;background:url(img/orbita/ui/glos.webp) center/contain no-repeat;image-rendering:pixelated}
.say .glos{display:none}
.say b{display:block;font-family:var(--display);font-weight:400;font-size:12px;color:var(--yellow);letter-spacing:.04em;margin:0}
.say p{margin:0;font-family:var(--tk);font-weight:400;font-size:20px;line-height:1.3;color:#e8ecff;-webkit-font-smoothing:none;letter-spacing:0}

/* ---------- przyciski: malowane (żółty główny, niebieski, ciemny panel) ---------- */
.btn{background:none!important;box-shadow:none!important;border-radius:0!important;border-style:solid!important;border-color:transparent!important;border-width:9px 12px 19px!important;border-image:url(img/orbita/ui/odp-c.webp) 14 14 28 14 fill/9px 12px 19px!important;color:#3a2400;padding:0 8px;min-height:58px;image-rendering:pixelated}
.btn:active{transform:translateY(2px)}
.btn.vi{border-image-source:url(img/orbita/ui/odp-b.webp)!important;color:#fff}
.btn.dk{border-width:10px!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/20px!important;color:var(--ink)}
.btn.sm{min-height:40px;font-size:12px}
.btn[disabled]{opacity:.5}
/* przyciski górnego paska (Wstecz, Pomoc, Dok, Znajomi...): jedna wielkość na każdym ekranie, także w poczekalni i na wąskim telefonie */
.kf{background:none!important;box-shadow:none!important;border:8px solid transparent!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/16px!important;width:40px;height:40px}
.kf .kz{font-size:19px}
.np,.np.pm{background:none!important;box-shadow:none!important;border-style:solid!important;border-color:transparent!important;border-width:10px 10px 10px 10px!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/20px!important}

/* ---------- pasek czasu: malowana rama, w środku cyjanowe segmenty ---------- */
.tbar{position:relative;height:26px!important;background:none!important;border:10px solid transparent!important;border-image:url(img/orbita/ui/pasek.webp?v=2) 28 fill/10px!important;box-shadow:none!important;overflow:visible}
.tbar i{position:absolute;left:-3px;top:-3px;bottom:-3px;max-width:calc(100% + 6px);background:repeating-linear-gradient(90deg,#55e6ff 0 12px,#2aa9cf 12px 14px)!important}

/* ---------- portrety: okrągłe, twarz z malowanej postaci ---------- */
.pop{border-radius:50%!important;border:2px solid #0b0d1c;box-shadow:0 0 0 2px var(--pc,#4a5290)!important;background:#1b1f3d;overflow:hidden}
.pop img{left:0;top:0;width:100%;height:100%;transform:none;object-fit:cover}
.pop.bot img{top:0;height:100%}
.pop.pat img.pxi{width:74%;height:74%;top:50%;transform:translate(-50%,-50%)}
.pl .pop{box-shadow:0 0 0 2px var(--pc)!important}
.pl.ans .pop{box-shadow:0 0 0 3px var(--mint)!important;outline:0}
.ans .a .whos .pop{border-width:1px}

/* ---------- pytanie i odpowiedzi ---------- */
.h1.q{border:12px solid transparent!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/24px!important;font-family:var(--tk)!important;font-weight:400!important;font-size:20px!important;line-height:1.3;letter-spacing:0;text-shadow:none;-webkit-font-smoothing:none;padding:4px 6px!important;color:#eef1ff}
.ans .a{background:none!important;box-shadow:none!important;border-radius:0!important;border-style:solid!important;border-color:transparent!important;border-width:9px 12px 19px!important;border-image:url(img/orbita/ui/odp-a.webp) 14 14 28 14 fill/9px 12px 19px!important;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;text-align:left;padding:0 6px!important;margin:0!important;color:#fff;image-rendering:pixelated}
.ans .a.c1{border-image-source:url(img/orbita/ui/odp-b.webp)!important}
.ans .a.c2{border-image-source:url(img/orbita/ui/odp-d.webp)!important}
.ans .a.c3{border-image-source:url(img/orbita/ui/odp-c.webp)!important;color:#3a2400}
.ans .a.c4{border-image-source:url(img/orbita/ui/odp-b.webp)!important}
.ans .a .l{flex:none;width:28px;height:28px;border-radius:4px!important;background:#0004!important;color:inherit!important;box-shadow:none!important;font-family:var(--display);font-size:18px;display:grid;place-items:center}
.ans .a .t{font-family:var(--tk)!important;font-weight:400!important;font-size:20px;line-height:1.2;-webkit-font-smoothing:none;letter-spacing:0}
.ans .a .whos{margin:0 0 0 auto!important;flex-wrap:nowrap}
.ans .a.pick{outline:3px solid var(--yellow);outline-offset:2px}
.ans .a.ok{outline:3px solid #fff;outline-offset:2px}
.ans .a.ok::before{display:none}
.ans .a.no,.ans.locked .a:not(.pick){opacity:.45}
.ans .a:active{transform:translateY(2px)}
body:not(.tv):not(.desk) .ans{grid-template-columns:1fr;gap:6px}
body:not(.tv):not(.desk) .ans .a{min-height:54px!important}
.ord .o span:not(.n){font-family:var(--tk)!important;font-weight:400!important;font-size:20px;-webkit-font-smoothing:none}
.ord .o{padding:0 4px!important;min-height:52px}
.pf button{background:none!important;box-shadow:none!important;border-radius:0!important;border-style:solid!important;border-color:transparent!important;border-width:9px 12px 19px!important;border-image:url(img/orbita/ui/odp-d.webp) 14 14 28 14 fill/9px 12px 19px!important;color:#fff;font-family:var(--display)!important;font-weight:400!important}
.pf button.nie{border-image-source:url(img/orbita/ui/odp-a.webp)!important}
.pf button i{background:none!important;box-shadow:none!important}
.pf.locked button:not(.pick){opacity:.4}
.pf button.pick{outline:3px solid var(--yellow);outline-offset:2px}

/* ---------- start: obraz stacji zamiast rzędu postaci ---------- */
.crewline{display:block;text-align:center;margin-top:10px}
.stik{width:min(236px,58vw);height:auto;border-radius:20px;box-shadow:0 0 0 3px #39407a,0 10px 30px #000c;animation:bob 2.4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-6px)}}
body.desk .stik{width:180px}

/* ---------- telewizor: głośnik z lewej, środek, dymek z prawej, pulpity zawodników na dole ---------- */
body.tv .tvmain{grid-template-columns:calc(12*var(--u)) 1fr calc(44*var(--u))}
body.tv .tvmain.bez-r{grid-template-columns:calc(12*var(--u)) 1fr calc(4*var(--u))}
body.tv .glosnik{width:calc(11*var(--u));padding:0;background:none;border:0;box-shadow:none}
body.tv .say,body.tv .pan.say{border-width:calc(1.4*var(--u)) calc(1.4*var(--u)) calc(4*var(--u)) calc(6.2*var(--u))!important;border-image-width:calc(1.4*var(--u)) calc(1.4*var(--u)) calc(4*var(--u)) calc(6.2*var(--u))!important;margin-left:calc(5.5*var(--u))}
body.tv .say::before{left:calc(-5.6*var(--u));width:calc(5*var(--u));height:calc(5.5*var(--u))}
body.tv .say p{font-size:calc(3.7*var(--u))}
body.tv .say b{font-size:calc(2.2*var(--u))}
body.tv .h1.q{font-size:calc(5.5*var(--u))!important;text-align:center;border-width:calc(2.4*var(--u))!important;border-image-width:calc(4.8*var(--u))!important}
body.tv .ans .a{min-height:calc(13*var(--u));border-width:calc(1.7*var(--u)) calc(2.2*var(--u)) calc(3.5*var(--u))!important;border-image-width:calc(1.7*var(--u)) calc(2.2*var(--u)) calc(3.5*var(--u))!important}
body.tv .ans .a .t{font-size:calc(3.7*var(--u))}
body.tv .ans .a .l{width:calc(5.4*var(--u));height:calc(5.4*var(--u));font-size:calc(3.6*var(--u))}
body.tv .btn{border-width:calc(1.7*var(--u)) calc(2.2*var(--u)) calc(3.5*var(--u))!important;border-image-width:calc(1.7*var(--u)) calc(2.2*var(--u)) calc(3.5*var(--u))!important}
body.tv .tbar{height:calc(5*var(--u))!important;border-width:calc(2*var(--u))!important;border-image-width:calc(2*var(--u))!important}
body.tv .pan,body.tv .rjw,body.tv .ban,body.tv .fact,body.tv .lp .r{border-width:calc(2.2*var(--u))!important;border-image-width:calc(4.4*var(--u))!important}
.pulp{display:flex;gap:calc(1.5*var(--u));margin-top:calc(4*var(--u));height:calc(12*var(--u));flex:none}
.pulp .pp{flex:1;min-width:0;position:relative;display:flex;align-items:center;gap:calc(1.4*var(--u));border:calc(1.9*var(--u)) solid transparent;border-image:url(img/orbita/ui/panel.webp) 26 fill/calc(3.8*var(--u));image-rendering:pixelated}
.pulp .pp::after{content:"";position:absolute;left:calc(-.8*var(--u));right:calc(-.8*var(--u));bottom:calc(-1.7*var(--u));height:calc(.75*var(--u));background:var(--pc)}
.pulp .pp.me{transform:translateY(-3px)}
.pulp .pp.off{opacity:.5}
.pulp .led{position:absolute;top:calc(-3.5*var(--u));left:50%;width:calc(4.8*var(--u));height:calc(1.1*var(--u));margin-left:calc(-2.4*var(--u));background:#2c3260;border:1px solid #0b0d1c}
.pulp .led.on{background:#5fd35f;box-shadow:0 0 calc(1.5*var(--u)) #5fd35f}
.pulp .mj{position:absolute;top:calc(-3.1*var(--u));left:calc(-2.6*var(--u));font-family:var(--display);font-size:calc(2.2*var(--u));background:#0b0d1c;border:2px solid #4a5290;border-radius:4px;padding:0 calc(.9*var(--u));line-height:calc(3*var(--u))}
.pulp .pp.me .mj{color:var(--yellow)}
.pulp .pop{width:calc(7*var(--u));height:calc(7*var(--u));flex:none}
.pulp .nm{min-width:0;line-height:1.1}
.pulp .nm b{display:block;font-family:var(--body);font-weight:800;font-size:calc(2.5*var(--u));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pulp .nm .sc{font-family:var(--display);color:var(--yellow);font-size:calc(2.6*var(--u))}
.pulp .zy{position:absolute;top:calc(-6.3*var(--u));right:calc(-.8*var(--u));font-family:var(--display);color:var(--mint);font-size:calc(3.1*var(--u));text-shadow:0 2px 0 #000a}
.pulp .zy.mn{color:var(--coral)}
/* przy 9+ graczach pulpity ciasne: bez nazwy, sam portret i energia */
.pulp:has(.pp:nth-child(9)) .nm b{display:none}

/* ---------- winda grawitacyjna na telewizorze ---------- */
.rura .rc{position:absolute;pointer-events:none}
@keyframes unos{50%{transform:translateY(calc(var(--wp)*-3))}}

/* ---------- mostek: odkrycie prowadzącego ---------- */
.odk{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.odk>*{position:absolute}
.odk .ciem{inset:0;background:#05061a;opacity:0;transition:opacity .6s}
.odk .snop{top:-40px;width:180px;height:620px;margin-left:-90px;transform-origin:50% 0;background:linear-gradient(rgba(255,244,200,0),rgba(255,244,200,.22) 60%,rgba(255,244,200,.05));clip-path:polygon(45% 0,55% 0,100% 100%,0 100%);opacity:0;transition:opacity .4s}
.odk .snop.mia{animation:mia 1.1s ease-in-out infinite alternate}
@keyframes mia{from{transform:rotate(-28deg)}to{transform:rotate(28deg)}}
.odk .lampa{width:36px}
.odk .prom{border-radius:50%;background:repeating-conic-gradient(rgba(255,210,63,.18) 0 9deg,transparent 9deg 18deg);opacity:0;animation:obrot 12s linear infinite;transition:opacity .5s}
@keyframes obrot{to{transform:rotate(360deg)}}
.odk .krz{width:0;height:0;transform-origin:50% 100%}
.odk .krz img{position:absolute;left:50%;bottom:0;transform:translateX(-50%)}
.odk .gw,.odk .dym,.odk .werbel{opacity:0}
.odk .werbel{width:56px;transition:opacity .4s}
.odk .flash{inset:0;background:#fff;opacity:0}
.odk .kfe{width:8px;height:8px}
.odk .naz{left:8px;right:8px;top:calc(var(--sat,0px) + 70px);display:flex;flex-wrap:wrap;gap:3px;justify-content:center;opacity:0}
.odk .naz.jest{opacity:1}
.odk .naz .lt{width:24px;height:30px;font-size:15px}
.odk .lin{left:44px;right:12px;top:calc(var(--sat,0px) + 150px);min-height:96px;opacity:0;transition:opacity .3s;border-style:solid;border-color:transparent;border-width:8px 8px 22px 34px;border-image:url(img/orbita/ui/dymek.webp) 8 8 26 42 fill/8px 8px 22px 34px;font-family:var(--tk);-webkit-font-smoothing:none;font-size:20px;line-height:1.3;color:#e8ecff;padding:2px 4px 0 0}
.odk .lin p{margin:0 0 6px;min-height:26px}
.odk .wyg{left:0;right:0;bottom:calc(var(--sab,0px) + 18px);text-align:center;opacity:0;transform:translateY(12px);transition:opacity .5s,transform .5s}
.odk .wyg.jest{opacity:1;transform:none}
body.tv .odk .naz{left:calc(9*var(--u));right:calc(31*var(--u));top:calc(12*var(--u))}
body.tv .odk .naz .lt{width:calc(5*var(--u));height:calc(6*var(--u));font-size:calc(3.2*var(--u))}
body.tv .odk .lin{left:auto;right:calc(3*var(--u));width:calc(52*var(--u));top:calc(33*var(--u));font-size:calc(3.7*var(--u));border-width:calc(1.4*var(--u)) calc(1.4*var(--u)) calc(4*var(--u)) calc(6.2*var(--u));border-image-width:calc(1.4*var(--u)) calc(1.4*var(--u)) calc(4*var(--u)) calc(6.2*var(--u))}
body.tv .odk .lin p{min-height:calc(4.8*var(--u))}
body.tv .odk .wyg{left:calc(4*var(--u));right:auto;bottom:calc(4*var(--u))}
body.tv .odk .wyg .chip{font-size:calc(2.8*var(--u))}
body.tv .odk .werbel{width:calc(12*var(--u))}

/* ---------- telewizor: korytarz z boku przy głosowaniu (tło 792x336, --bs = px sceny) ---------- */
.bok{--bs:calc(var(--u)*.142);position:relative;width:calc(var(--bs)*792);height:calc(var(--bs)*336);margin:0 auto;background:url(img/orbita/tla/korytarz.webp) 0 0/100% 100% no-repeat;image-rendering:pixelated;overflow:hidden;box-shadow:0 0 0 calc(.5*var(--u)) #39407a,0 calc(1.4*var(--u)) calc(4*var(--u)) #000a}
.bok img{position:absolute;image-rendering:pixelated}
.bok .bw{position:absolute;width:calc(var(--bs)*128);height:calc(var(--bs)*128);margin-left:calc(var(--bs)*-64);margin-top:calc(var(--bs)*-122);transition:left .9s ease-in-out,top .9s ease-in-out}
.bok .bw .spr{position:absolute;inset:0;background-repeat:no-repeat;background-size:400% 400%;image-rendering:pixelated}
.bok .bw .spr{background-position:0 66.67%;animation:stoi 1.4s steps(1) 40}
.bok .bw.me.glos .spr{animation:macha .6s steps(1) 12}
@keyframes stoi{0%{background-position:0 66.67%}50%{background-position:33.33% 66.67%}}
@keyframes macha{0%{background-position:66.67% 66.67%}50%{background-position:100% 66.67%}}
.bok .bw b{position:absolute;left:50%;top:calc(var(--bs)*14);transform:translateX(-50%);font-family:var(--body);font-weight:800;font-size:calc(1.25*var(--u));white-space:nowrap;background:#0b0d1cd0;border:1px solid var(--pc);padding:0 3px;color:#fff}
.bok .bw.me b{color:var(--yellow)}
body.tv .tvmain .cen:has(.bok){gap:calc(1.4*var(--u))}

/* ---------- korytarz między pokładami: sprity w marszu (proporcja tła: postać ok. 0,85 drzwi) ---------- */
@keyframes idzie{0%{background-position:0 0}16.67%{background-position:20% 0}33.33%{background-position:40% 0}50%{background-position:60% 0}66.67%{background-position:80% 0}83.33%{background-position:100% 0}}
/* ---------- ściany korytarza K1–K4 i rekwizyty K5 (--sp = px sceny 784x336) ---------- */
.bok{background-image:url(img/orbita/bok/sciana-drzwi.webp);overflow:visible;margin-bottom:calc(var(--bs)*64)}
.bok{--sp:var(--bs)}
.korytarz{--sp:calc(190px / 336);height:190px}
body.tv .korytarz{--sp:calc(36 * var(--u) / 336)}
.kdrzwi{bottom:auto!important;height:calc(var(--sp)*120)!important}

/* postacie w pełnej rozdzielczości malunku (klatka 256 px): przeglądarka zmniejsza je gładko, bez skalowania pikselowego, żeby były ostre */
.pop img,.btn img,.bok .bw .spr,.fin img{image-rendering:auto!important}
/* scena z drzwiami mniejsza, żeby opisy drzwi pod nią nie wchodziły na pulpity */
.bok{--bs:calc(var(--u)*.122)}

/* ---------- poczekalnia na telefonie: plakietki w dwóch kolumnach (twarz, ksywka, rola), mieszczą 12 osób bez ucinania ---------- */
.crew{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px 8px!important;align-content:start}
.crew .mate{display:grid!important;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;align-items:center;justify-items:start;text-align:left;min-width:0;min-height:0!important;height:auto;padding:2px 2px!important;border-width:9px!important;border-image-width:18px!important;position:relative}
.crew .mate .pop{grid-row:1 / 3;width:34px!important;height:34px!important;margin:0}
.crew .mate b{grid-column:2;min-width:0;max-width:100%;font-family:var(--body);font-weight:800;font-size:13px;letter-spacing:0;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;margin:0}
.crew .mate .tag{grid-column:2;min-width:0;max-width:100%;background:none!important;padding:0!important;margin:0;font-size:11px;line-height:1.2;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crew .mate.me b{color:var(--sky)}
.crew .mate.host::before{left:auto;right:2px;top:2px}
.crew .mate.add .pop{opacity:.7}
.crew .mate.add .plus{position:absolute;left:24px;top:-2px;right:auto;width:16px;height:16px;font-size:13px;line-height:16px}

/* ---------- telewizor: start z kodem (obraz stacji i malowany panel, kod na czterech kaflach) ---------- */
.tvstart{flex:1;display:flex;align-items:center;justify-content:center;gap:calc(7*var(--u))}
.stik.duza{width:calc(62*var(--u));border-radius:calc(4.5*var(--u));box-shadow:0 0 0 calc(.7*var(--u)) #39407a,0 calc(2*var(--u)) calc(8*var(--u)) #000c}
body.tv .tvjoin{max-width:none;width:calc(66*var(--u));margin:0;gap:calc(2.6*var(--u));padding:calc(2*var(--u)) calc(2.4*var(--u))}
body.tv .tvjoin .h1{font-size:calc(4.2*var(--u))}
.kodk{position:relative;display:flex;gap:calc(1.6*var(--u));justify-content:center;cursor:text}
.kodk .kodin{position:absolute;inset:0;opacity:0;width:100%;height:100%;font-size:16px;border:0;padding:0;caret-color:transparent}
body.tv .kodk .lt{width:calc(10*var(--u));height:calc(12*var(--u));font-size:calc(7*var(--u));display:grid;place-items:center}
.kodk .lt.pusty{opacity:.32}
.kodk .lt.teraz{opacity:.6;animation:mrug 1s steps(2) infinite}
/* to samo pole na telefonie (okno Dołącz) i na desktopie (karta Dołącz): duże kafle zamiast zwykłego inputu */
body:not(.tv) .kodk{gap:10px;margin:8px 0 2px}
body:not(.tv) .kodk .lt{width:min(60px,15vw);height:min(70px,18vw);font-size:min(36px,9vw);display:grid;place-items:center}
.hc .kodk .lt{width:54px;height:62px;font-size:32px}
.kodk .kodin{color:transparent;background:none;-webkit-user-select:text}
/* ksywka w kaflach (app.js podepnijKsywke): kafel dochodzi z każdą literą, za ostatnim miga następny (tylko gdy pole ma fokus); zakazana = szare kafle */
.nickk{position:relative;display:block;width:min(360px,calc(100vw - 32px));margin:0 auto;container-type:inline-size;cursor:text}
.nickk .kodin{position:absolute;inset:0;opacity:0;width:100%;height:100%;font-size:16px;border:0;padding:0;caret-color:transparent;color:transparent;background:none;-webkit-user-select:text}
.nkl{--w:min(34px,calc((100cqw - (var(--n) - 1) * 5px) / var(--n)));display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:7px calc(var(--w) * .55);min-height:calc(var(--w) * 1.2 + 4px);pointer-events:none}
.nkl .lt{width:var(--w);height:calc(var(--w) * 1.2);font-size:calc(var(--w) * .64);flex:none;display:grid;place-items:center}
.nkl .nkw{display:flex;gap:5px}
.nkl .lt.teraz{opacity:.4}
.nickk:focus-within .lt.teraz{opacity:.6;animation:mrug 1s steps(2) infinite}
.nkl .lt.nowy{animation:nkpop .16s ease-out}
@keyframes nkpop{from{opacity:0;transform:translateY(5px) scale(.55)}to{opacity:1;transform:none}}
.nkl .nkph{font-family:var(--display);font-size:14px;color:var(--muted);margin-left:4px;white-space:nowrap}
.nkl.zla .lt:not(.gap):not(.teraz){background:#5d5a74;color:#2a2840}
.nkzla{display:none;text-align:center;font-size:12.5px;font-weight:700;color:#ff8a8a}
.nkzla.on{display:block}
body.tv .tvjoin .btn{min-height:calc(8*var(--u));font-size:calc(2.6*var(--u));padding:0 calc(5*var(--u))}
.tvalbo{align-items:center;gap:calc(1.6*var(--u))}
.tvalbo .sub{flex:0 0 auto}
.tvalbo .btn.dk{font-size:calc(2.2*var(--u))!important;min-height:calc(7*var(--u))!important}

/* ---------- drzwi: skrzydła rozsuwają się płynnie po wyniku głosowania (animacja, bo ekran buduje się od razu z otwartymi) ---------- */
/* czekanie na głosy: znaczek przy imieniu, kto już zagłosował */
.bok .bw.glos:not(.idzie) b::after{content:"";display:inline-block;width:calc(.8*var(--u));height:calc(.8*var(--u));margin-left:calc(.5*var(--u));background:var(--mint);vertical-align:middle}
.bok .bw.me.glos .spr{animation:stoi 1.4s steps(1) 40}
.bok .bw.me.idzie .spr{animation:macha .6s steps(1) 12}

/* wybrana odpowiedź bez obwódki: wystarczy, że reszta przygasa (to samo przy odsłonie, prawdzie i fałszu, stawce windy) */
.ans .a.pick,.ans .a.ok,.pf button.pick{outline:none!important}
.ans .a.pick,.ans .a.ok{box-shadow:none!important}
.ans .a.no,.ans.locked .a:not(.pick),.pf.locked button:not(.pick){opacity:.35}

/* ---------- telefon: tło sekcji w całej szerokości ekranu jako pas przez środek (cały pokój, bez zbliżenia), wyżej i niżej ciemny kosmos ---------- */
@media (max-aspect-ratio:4/5){
  .scene .sek{background:linear-gradient(180deg,#0b0f1f 0,rgba(11,15,31,0) 14%,rgba(11,15,31,0) 86%,#0b0f1f 100%) center/100% 56.25vw no-repeat,var(--sek,none) center/100% auto no-repeat,#0b0f1f}
}

/* ---------- kolejność: jasny tekst na ciemnym panelu, numer w kolorze wyniku, mała plakietka zamiast napisu ---------- */
.ord .o{color:#eef1ff!important;gap:10px!important}
.ord .o span:not(.n):not(.grip):not(.mark){flex:1;min-width:0;line-height:1.15}
.ord .o .grip{flex:none;width:18px;height:14px;background:repeating-linear-gradient(180deg,#8f9ad0 0 2px,transparent 2px 5px)}
.ord .o .mark{flex:none!important;font-family:var(--display)!important;font-size:10px!important;line-height:1;color:#03301b;background:var(--mint);padding:4px 6px;letter-spacing:.04em}
.ord .o .mark:empty{display:none}
.ord .o.ok .n{background:var(--mint);box-shadow:inset 0 -3px 0 #1c9462;color:#03301b}
.ord .o.bad .n{background:#ff8fa3;box-shadow:inset 0 -3px 0 #b03a52;color:#3a0010}
.ord.locked .o{opacity:.6}

/* ---------- punkty: pikselowa cyfra bez cienia (cień wyglądał jak podwojony napis) ---------- */
.res .pts,.pts{text-shadow:none!important}

/* ---------- telefon, odsłona: wszystko na jednym ekranie: odpowiedzi 2x2, niskie wiersze rankingu, mniejsze odstępy ---------- */
body:not(.tv):not(.desk) .grow.wyn{gap:8px!important;justify-content:flex-start!important}
body:not(.tv):not(.desk) .wyn .h1.q{font-size:16px!important;line-height:1.25}
body:not(.tv):not(.desk) .wyn .ans{grid-template-columns:1fr 1fr!important;gap:6px!important}
body:not(.tv):not(.desk) .wyn .ans .a{min-height:46px!important;padding:2px 4px!important;gap:2px!important}
body:not(.tv):not(.desk) .wyn .ans .a .t{font-size:14px!important;line-height:1.15}
body:not(.tv):not(.desk) .wyn .ans .a .l{width:20px!important;height:20px!important;font-size:12px!important}
/* kto wybrał: własny rząd pod treścią w środku kafla (wcześniej wystawał nad kafel i overflow go ucinał) */
body:not(.tv):not(.desk) .wyn .ans .a{flex-wrap:wrap;align-content:center}
body:not(.tv):not(.desk) .wyn .ans .a .whos{flex:0 0 100%;margin:1px 0 0!important;justify-content:center;flex-wrap:wrap;row-gap:2px}
body:not(.tv):not(.desk) .wyn .ans .a .whos:empty{display:none}
body:not(.tv):not(.desk) .wyn .ans .a .whos .pop{width:20px;height:20px;margin:0 -2px}
body:not(.tv):not(.desk) .wyn .ord .o{min-height:36px!important}
body:not(.tv):not(.desk) .wyn .fact{padding:2px 4px!important}
body:not(.tv):not(.desk) .wyn .fact img{width:32px;height:32px}
body:not(.tv):not(.desk) .wyn .fact p{font-size:12.5px;line-height:1.25}
body:not(.tv):not(.desk) .wyn .lp{gap:4px}
body:not(.tv):not(.desk) .wyn .lp .r{min-height:34px!important;font-size:11.5px}
body:not(.tv):not(.desk) .wyn .lp .r .pop{width:28px!important;height:28px!important}
body:not(.tv):not(.desk) .wyn .report{margin-top:2px}

/* ---------- telefon, odsłona C1 (propozycje/odslona-karty): przy punktach najwyżej dwie linie o kartach, które dotyczyły ciebie;
   ranking całej załogi w siatce 2 kolumny (od 9 osób 3), w komórce miejsce, imię, suma, a pod spodem zysk i mała karta ---------- */
body:not(.tv):not(.desk) .wyn .res{gap:10px}
.res .pts{flex:none}
.res .tyl{min-width:0;display:flex;flex-direction:column;gap:3px;text-align:left}
.res .tyl .w{display:flex;align-items:center;gap:6px;font-family:var(--tk, 'Orbita Tekst', monospace);font-size:12px;line-height:1.2;color:#e9ecff}
.res .tyl .w img{width:14px;height:auto;flex:none;max-width:none}
.res .tyl em{font-style:normal;color:var(--mint)}
.res .tyl em.m{color:#ff8fa3}
.res .tyl em.z{color:#ffd27a}
body:not(.tv):not(.desk) .wyn .lp.zc{grid-template-columns:1fr 1fr;gap:3px}
body:not(.tv):not(.desk) .wyn .lp.zc.k3{grid-template-columns:1fr 1fr 1fr}
body:not(.tv):not(.desk) .wyn .lp.zc .r{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:4px;row-gap:1px;align-items:center;min-height:34px!important;padding:1px 3px 1px 1px!important;border-width:7px!important;border-image-width:14px!important;font-size:9.5px}
body:not(.tv):not(.desk) .wyn .lp.zc .r .pop{grid-row:1/3;grid-column:1;width:22px!important;height:22px!important}
body:not(.tv):not(.desk) .wyn .lp.zc .r .pl1{grid-column:2;width:auto;height:auto;background:none;font-size:9px;color:var(--muted)}
body:not(.tv):not(.desk) .wyn .lp.zc .r .n{grid-column:3}
/* dwie kolumny (do 8 graczy): ksywki i punkty czytelne, 11 px zamiast 9,5 px; trzy kolumny zostają ciasne */
body:not(.tv):not(.desk) .wyn .lp.zc:not(.k3) .r{font-size:11px}
body:not(.tv):not(.desk) .wyn .lp.zc:not(.k3) .r .pop{width:26px!important;height:26px!important}
body:not(.tv):not(.desk) .wyn .lp.zc .r b{grid-column:4;text-align:right}
body:not(.tv):not(.desk) .wyn .lp.zc .r .dol{grid-column:2/5;grid-row:2;display:flex;justify-content:flex-end;align-items:center;gap:3px;height:14px}
body:not(.tv):not(.desk) .wyn .lp.zc .r .dol img{width:10px;height:auto;max-width:none}
body:not(.tv):not(.desk) .wyn .lp.zc .r .g{font-size:9px;padding:1px 4px}
body:not(.tv):not(.desk) .wyn .lp.zc .r .g.m{background:#ff8fa3;color:#3a0010}
body:not(.tv):not(.desk) .wyn .lp.zc .r .g.zero{background:none;color:var(--muted)}
body:not(.tv):not(.desk) .wyn .lp.zc.k3 .r{min-height:32px!important;border-width:6px!important;border-image-width:12px!important}
/* twoja komórka jaśniejsza (nakładka zamiast filter: wiersze przesuwają się w animacji rankingu) */
body:not(.tv):not(.desk) .wyn .lp.zc .r.me{position:relative}
body:not(.tv):not(.desk) .wyn .lp.zc .r.me::after{content:"";position:absolute;inset:-2px;background:rgba(150,175,255,.2);pointer-events:none}

/* ---------- Magazyn: malowany regał (M2) ze skrzyniami (M1); półki w % obrazka regału 1400x735 (wnętrze górne 128-347, dolne 430-593) ---------- */
.hcards{grid-template-columns:repeat(2,minmax(0,330px))!important}

/* ---------- ranking telefonu w odsłonie: plakietka punktów pokazuje się, gdy wiersze zamieniają się miejscami ---------- */
.lp[data-anim] .r .g{opacity:0;transform:scale(.6);transition:opacity .3s,transform .3s}
.lp[data-anim] .r .g.on{opacity:1;transform:none}

/* odsłona z pokojem: wynik (energia) pokazuje się, gdy załoga dojdzie do swoich kolorów */
body:not(.tv) .wyn.chodza .res{animation-delay:1.9s!important}
body:not(.tv) .wyn.chodza .res.in{animation-fill-mode:both!important}

/* ---------- odsłona na ekranie pytania, telefon bez telewizora (propozycje/odslona-rozmiar, koncepcja A; app.js odslTel, rezyser.js odslonaTel) ----------
   kafle nie zmieniają rozmiaru ani miejsca: złe przykrywa szary kafel (tylko opacity), dobry się podnosi i jaśnieje; potem pytanie i złe odchodzą,
   dobry jedzie do gniazda pod salą (.odw-slot), wyniki (.odw) wjeżdżają po kolei. Tylko transform i opacity (WebKit) */
.pyt.odsl{position:relative}
body:not(.tv):not(.desk) #app>.pyt.odsl{flex:1 1 auto!important;min-height:0;overflow:visible!important}
.pyt.odsl [data-ods]{overflow:visible!important;opacity:1;transition:transform .6s cubic-bezier(.6,0,.25,1),opacity .4s ease}
.pyt.odsl [data-ods]>:not(.osz):not(.ogl):not(.ozn):not(.oty){position:relative;z-index:2}
.pyt.odsl .osz{position:absolute;z-index:1;inset:-9px -12px -19px;border-style:solid;border-color:transparent;border-width:9px 12px 19px;border-image:url(img/orbita/ui/odp-szary.webp) 14 14 28 14 fill/9px 12px 19px;image-rendering:pixelated;opacity:0;transition:opacity .35s;pointer-events:none}
.pyt.odsl .ogl{position:absolute;z-index:0;inset:-9px -12px -19px;background:radial-gradient(closest-side,rgba(255,250,215,.42),rgba(255,250,215,0));opacity:0;transition:opacity .45s;pointer-events:none}
.pyt.odsl .ozn,.pyt.odsl .oty{position:absolute;z-index:3;top:-13px;font:400 11px/1 var(--display);letter-spacing:.06em;padding:4px 6px 3px;box-shadow:2px 2px 0 #05060f;pointer-events:none}
.pyt.odsl .ozn{right:-14px;background:#fff;color:#16704a;opacity:0;transform:translateY(6px) scale(.8);transition:opacity .25s,transform .3s cubic-bezier(.3,1.6,.5,1)}
.pyt.odsl .ozn.szm{background:#2b3566;color:#aab4e0}
.pyt.odsl .oty{left:-14px;background:var(--yellow,#f2c14e);color:#2a1c00;font-size:10px}
.pyt.odsl [data-ods].on .ozn{opacity:1;transform:none}
.pyt.odsl [data-ods=wyl].on .osz,.pyt.odsl [data-ods=szum].on .osz{opacity:1}
.pyt.odsl [data-ods=wyl].on,.pyt.odsl [data-ods=szum].on{color:#dfe4ff}
.pyt.odsl [data-ods=wyl].on .t,.pyt.odsl [data-ods=szum].on .t{opacity:.6}
.pyt.odsl [data-ods=dobra]{z-index:3}
.pyt.odsl [data-ods=dobra].on .ogl{opacity:1}
.pyt.odsl :not(.odw-slot)>[data-ods=dobra].on{transform:translateY(-4px)}
/* wyjście: pytanie, baner i złe kafle odchodzą (złe opadają po kolei), dobry jedzie pod salę (transform z rezyser.js) */
.pyt.odsl>:not(.odw):not(.ans):not(.pf){transition:opacity .4s ease,transform .45s cubic-bezier(.5,0,.3,1)}
.pyt.odsl.wyj>:not(.odw):not(.ans):not(.pf){opacity:0;transform:translateY(-24px)}
.pyt.odsl.wyj [data-ods]:not([data-ods=dobra]){opacity:0;transform:translateY(50px)}
.pyt.odsl.wyj [data-ods]:nth-child(2){transition-delay:.07s}
.pyt.odsl.wyj [data-ods]:nth-child(3){transition-delay:.14s}
.pyt.odsl.wyj [data-ods]:nth-child(4){transition-delay:.21s}
.pyt.odsl.wyj [data-ods]:nth-child(5){transition-delay:.28s}
.pyt.odsl.wyj [data-ods=dobra]{transition-delay:.12s}
/* wyniki: gniazdo z dobrym kaflem i punkty w jednym rzędzie, pod nimi chipy, ciekawostka, ranking, zgłoszenie */
/* .odw wystaje 14 px na boki i ma 13 px u góry: plakietki DOBRZE i TY na kaflu w gnieździe nie chowają się pod przewijaniem */
.pyt.odsl .odw{position:absolute;inset:0 -14px;padding:13px 14px 0;z-index:1;display:flex;flex-direction:column;gap:8px;overflow:auto;visibility:hidden;pointer-events:none}
.pyt.odsl.wyniki .odw{visibility:visible;pointer-events:auto}
.pyt.odsl .odw-r1{flex:none;display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.pyt.odsl .odw-slot{display:block!important;flex:none;margin:0!important;padding:0!important}
.pyt.odsl .odw-slot>[data-ods]{width:100%!important;height:100%!important;min-height:0!important;margin:0!important}
.pyt.odsl .odw-r1 .res{flex:1 1 130px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px}
.pyt.odsl .odw-d{display:flex;flex-direction:column;gap:8px}
.pyt.odsl .odw-r1 .res,.pyt.odsl .odw-d>*{opacity:0;transform:translateY(14px);transition:opacity .4s ease calc(var(--i,0) * 90ms + 100ms),transform .45s cubic-bezier(.2,.8,.3,1) calc(var(--i,0) * 90ms + 100ms)}
.pyt.odsl.wyniki .odw-r1 .res,.pyt.odsl.wyniki .odw-d>*{opacity:1;transform:none}
/* kto wszedł w trakcie odsłony: od razu stan końcowy minionych kroków */
.pyt.odsl.bez,.pyt.odsl.bez *{transition:none!important}
@media (prefers-reduced-motion:reduce){.pyt.odsl *{transition-duration:.01s!important;transition-delay:0s!important}}

/* ---------- Gorący przewód: malowana platforma, generator, płyty graczy i bezpieczniki (karty G1, G2) ---------- */
@keyframes przew{50%{transform:translateY(-1px) rotate(4deg)}}
/* ekran główny: tytuł jako pikselowy neon (bez kafelków liter z Państw Miast), stacja bez boksu na pikselowej wiązce */
.neon{text-align:center;font-family:var(--display);line-height:1;letter-spacing:0}
.neon .n1{font-size:min(30px,7.6vw);letter-spacing:.12em;color:#ffd6f4;text-shadow:2px 2px 0 #b0187a,0 0 10px #ff4fc8,0 0 22px #ff4fc8aa}
.neon .nz{display:inline-block;font-size:.66em;color:var(--yellow);text-shadow:2px 2px 0 #7a4a00,0 0 8px #ffb02e;vertical-align:middle;margin-left:.3em;letter-spacing:0}
.neon .n2{font-size:min(58px,14.6vw);letter-spacing:.04em;color:#e6fdff;margin-top:8px;text-shadow:3px 3px 0 #0b6fa0,0 0 12px #3fd8ff,0 0 30px #3fd8ffaa}
.neon.mini{display:flex;align-items:baseline;gap:calc(1.4*var(--u))}
.neon.mini .n1{font-size:calc(2.4*var(--u));text-shadow:calc(.25*var(--u)) calc(.25*var(--u)) 0 #b0187a,0 0 calc(1.2*var(--u)) #ff4fc8}
.neon.mini .n2{font-size:calc(3.6*var(--u));margin:0;text-shadow:calc(.3*var(--u)) calc(.3*var(--u)) 0 #0b6fa0,0 0 calc(1.4*var(--u)) #3fd8ff}
body.desk .neon .n1{font-size:clamp(28px,2.4vw,40px)}
body.desk .neon .n2{font-size:clamp(54px,5vw,84px)}
.stik.solo{border-radius:0;box-shadow:none;width:min(250px,62vw,30vh);position:relative;z-index:2}
body.desk .stik.solo{width:210px}
#app[data-ekran=home]>:not(.wiazka){position:relative;z-index:1}
/* wiązka pod stacją: warstwy przycinane schodkami w JS (wiazka()), raster 4 px jak piksele gry; ruch tylko transform/opacity, bez filtrów i masek,
   żyje wyłącznie na ekranie głównym: pasy światła płyną w dół (dwie prędkości), iskry dryfują w górę, poświata pod kadłubem i lądowisko oddychają w rytmie unoszenia stacji (2,4 s),
   co kilka sekund linia skanu zjeżdża spod stacji na przyciski i rozświetla lądowisko */
.wiazka{position:absolute;left:0;right:0;z-index:0;pointer-events:none}
.wiazka>i{position:absolute;inset:0;display:block}
.wiazka .w0{background:repeating-conic-gradient(#bff4ff0a 0 25%,#0000 0 50%) 0 0/4px 4px,linear-gradient(#5fd8ff1c,#5fd8ff0a calc(var(--b) - 25%),#5fd8ff12 var(--b),#5fd8ff00 100%)}
.wiazka .w1{background:repeating-conic-gradient(#bff4ff10 0 25%,#0000 0 50%) 0 0/4px 4px,linear-gradient(#5fd8ff30,#5fd8ff12 calc(var(--b) - 25%),#5fd8ff1c var(--b),#5fd8ff00 100%)}
.wiazka .w2{background:repeating-linear-gradient(#0000 0 6px,#bff4ff0e 6px 8px),linear-gradient(#7ee6ff60,#7ee6ff1a calc(var(--b) - 30%),#7ee6ff30 var(--b),#7ee6ff00 100%)}
.wiazka .w3{background:repeating-conic-gradient(#ffffff18 0 25%,#0000 0 50%) 0 0/4px 4px,linear-gradient(#f2feffd0,#bff4ff60 10%,#9ef0ff20 calc(var(--b) - 25%),#9ef0ff38 var(--b),#9ef0ff00 100%)}
/* pasy światła: gradient liczony w JS (gasną ku lądowisku), element o 32 px wyższy i przesuwany o okres, więc pętla jest niewidoczna */
.wiazka .w2>s,.wiazka .w3>s{position:absolute;top:-32px;bottom:0;display:block;animation:wplyn 2s linear infinite}
.wiazka .w3>s{animation-duration:1.25s}
@keyframes wplyn{to{transform:translateY(32px)}}
/* linia skanu: 28 px, jasna krawędź na dole, zjeżdża w 2,2 s i znika do następnego cyklu (7,5 s); --yb = wysokość lądowiska w px */
.wiazka .sk{position:absolute;left:0;right:0;top:-28px;height:28px;display:block;background:linear-gradient(#f2feff00,#bff4ff50 55%,#ffffffd0 86%,#ffffffd0 100%);animation:wskan 7.5s cubic-bezier(.3,.1,.5,1) infinite}
@keyframes wskan{0%{transform:translateY(0);opacity:1}29%{transform:translateY(calc(var(--yb) + 44px));opacity:1}29.5%,100%{transform:translateY(calc(var(--yb) + 44px));opacity:0}}
/* poświata pod kadłubem: gładka elipsa bez rastra (równomierny raster zdradzał prostokąt elementu), pozycja i rozmiar z JS (środek na dolnej krawędzi kadłuba, wystaje spod dysz i narożników) */
.wiazka .hal{inset:auto;background:radial-gradient(ellipse 50% 50% at 50% 50%,#f2feffe6,#a4efff90 32%,#7ee6ff30 54%,#7ee6ff00 70%);animation:whalo 2.4s ease-in-out infinite}
@keyframes whalo{50%{opacity:.55}}
.wiazka .pl,.wiazka .lad{inset:auto -8px auto -8px;top:calc(var(--b) - 46px);height:92px;background:linear-gradient(#7ee6ff00,#7ee6ff22 40%,#bff4ff30 55%,#7ee6ff00);clip-path:polygon(0 30%,6% 30%,6% 14%,18% 14%,18% 0,82% 0,82% 14%,94% 14%,94% 30%,100% 30%,100% 70%,94% 70%,94% 86%,82% 86%,82% 100%,18% 100%,18% 86%,6% 86%,6% 70%,0 70%);animation:wladow 2.4s -1.2s ease-in-out infinite}
@keyframes wladow{50%{opacity:.5}}
/* błysk lądowiska, gdy dociera skan (ten sam zegar 7,5 s co .sk) */
.wiazka .lad{background:linear-gradient(#bff4ff00,#e6fdff70 45%,#ffffffa8 55%,#bff4ff00);opacity:0;animation:wblysk 7.5s linear infinite}
@keyframes wblysk{0%,25%{opacity:0}30%{opacity:1}48%,100%{opacity:0}}
.wiazka .isk b{position:absolute;width:4px;height:4px;background:#e6fdff;box-shadow:0 0 0 2px #7ee6ff55,0 0 0 4px #7ee6ff22;opacity:0;animation:wiskra var(--t,3s) var(--d,0s) ease-in-out infinite}
@keyframes wiskra{0%{transform:translateY(0);opacity:0}25%{opacity:1}75%{opacity:.8}100%{transform:translateY(-56px);opacity:0}}
@media (prefers-reduced-motion:reduce){.wiazka *{animation:none!important}.wiazka .sk,.wiazka .lad{display:none}.wiazka .isk b{opacity:1}}
/* neonowe gwiazdki po bokach tytułu: biały rdzeń na większej różowej poświacie (dwie gwiazdy z clip-path, bez filtrów) */
.neon .gw{position:relative;display:inline-block;width:.34em;height:.34em;margin:0 .6em;vertical-align:.2em}
.neon .gw::before,.neon .gw::after{content:'';position:absolute;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%)}
.neon .gw::before{inset:-45%;background:#ff4fc855}
.neon .gw::after{inset:0;background:#fff}
.neon .gw.g2{width:.22em;height:.22em;vertical-align:.75em;margin-left:.45em}
#app[data-ekran=home] .crewline{margin-top:clamp(12px,calc(9vh - 22px),64px)}
body:not(.desk) #app[data-ekran=home] .home-mid{padding-top:clamp(16px,calc(22vh - 100px),110px)}
body.tv .stik.solo.duza{width:calc(56*var(--u));border-radius:0;box-shadow:none}
/* telewizor: duży neon nad stacją na ekranie startowym, większy neon w nagłówku gry */
body.tv .tvlewa{display:flex;flex-direction:column;align-items:center;gap:calc(4*var(--u))}
body.tv .tvlewa .stik.solo.duza{width:calc(46*var(--u))}
.neon.tvd .n1{font-size:calc(5*var(--u));text-shadow:calc(.35*var(--u)) calc(.35*var(--u)) 0 #b0187a,0 0 calc(1.4*var(--u)) #ff4fc8,0 0 calc(3*var(--u)) #ff4fc8aa}
.neon.tvd .n2{font-size:calc(11*var(--u));margin-top:calc(1.2*var(--u));text-shadow:calc(.5*var(--u)) calc(.5*var(--u)) 0 #0b6fa0,0 0 calc(1.8*var(--u)) #3fd8ff,0 0 calc(4.5*var(--u)) #3fd8ffaa}
/* nagłówek gry na telewizorze: większy neon, „Z” tuż przy „KOSMOSU” (gwiazdka po Z znika, mały odstęp) */
.neon.mini .n1{font-size:calc(4*var(--u))}
.neon.mini .n2{font-size:calc(6.4*var(--u))}
.neon.mini{gap:calc(.9*var(--u))}
.neon.mini .gw.g2{display:none}
.neon.mini .nz{margin-left:.25em}
/* odpowiedzi nie łamią się: jedna linia, czcionkę zmniejsza dopasujOdp w app.js; .lam = nie zmieściło się nawet najmniejszą, wtedy wolno złamać */
.ans .a .t{white-space:nowrap!important;overflow:hidden;min-width:0;max-width:100%;flex:0 1 auto;overflow-wrap:normal!important;word-break:normal!important}
.ans .a .t.lam{white-space:normal!important;overflow:visible}
/* zegar fazy: wyświetlacz stacji wielkości kafla wstecz (propozycje/zegar, koncepcja B bez diod): panel, sama świecąca cyfra; pasek w kolorze cyfry */
.secs{justify-self:end;width:44px;min-width:44px!important;height:44px;padding:0;display:grid;place-items:center;background:none!important;border:9px solid transparent!important;border-image:url(img/orbita/ui/panel.webp) 26 fill/18px!important;border-radius:0!important;box-shadow:none!important;image-rendering:pixelated;font-family:var(--display);font-size:19px;line-height:1;letter-spacing:0;color:#55e6ff;text-shadow:0 0 6px #55e6ff99,2px 2px 0 #05070f}
.secs.pol{color:#ffcc4d;text-shadow:0 0 6px #ffcc4d99,2px 2px 0 #05070f}
.secs.low,.secs.dzw{color:#ff5c7a;background:none!important;text-shadow:0 0 7px #ff5c7aaa,2px 2px 0 #05070f;animation:secsMrug 1s steps(1) infinite}
@keyframes secsMrug{0%{opacity:1}85%{opacity:.35}}
.secs.dzw:not(.low){animation:none}
.tbar.pol i{background:repeating-linear-gradient(90deg,#ffcc4d 0 12px,#9a6a10 12px 14px)!important}
.tbar.low i{background:repeating-linear-gradient(90deg,#ff5c7a 0 12px,#8a1f36 12px 14px)!important}
body.tv .secs{width:calc(7*var(--u));min-width:calc(7*var(--u))!important;height:calc(7*var(--u));border-width:calc(1.4*var(--u))!important;border-image-width:calc(2.8*var(--u))!important;font-size:calc(3*var(--u))}
@media (prefers-reduced-motion:reduce){.secs.low{animation:none}}
/* odsłonięcie: identyfikator prowadzącego z pieczęcią (app.js odIdent), kafle tylko dla Papugi Kiki */
.odk .naz:has(.odid){display:block}
.odid{position:relative;margin:0 auto;max-width:340px;display:grid;grid-template-columns:78px 1fr;gap:10px;background:#e9e2cc;border:4px solid #05060f;box-shadow:6px 6px 0 #05060f;color:#241a3a;padding:9px 11px;transform:rotate(-2deg);animation:odidWj .5s cubic-bezier(.2,1.3,.4,1) both}
@keyframes odidWj{from{transform:translateY(-260px) rotate(-12deg)}to{transform:rotate(-2deg)}}
.odid-f{width:78px;height:90px;background:#1c2350;border:3px solid #241a3a;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.odid-f img{width:118%;max-width:none;margin-bottom:-6px;image-rendering:pixelated}
.odid-t{min-width:0;text-align:left}
.odid-t small{display:block;font-family:var(--display);font-size:9px;letter-spacing:.12em;color:#6a5a7a}
.odid-t b{display:block;font-family:var(--display);font-weight:400;font-size:18px;line-height:1.1;margin:2px 0 5px;color:#241a3a}
.odid-k{display:block;height:14px;margin-top:6px;background:repeating-linear-gradient(90deg,#241a3a 0 2px,transparent 2px 4px,#241a3a 4px 5px,transparent 5px 8px)}
.odid-p{position:absolute;right:-12px;bottom:-14px;font-family:var(--display);font-size:14px;letter-spacing:.08em;color:#d42a4a;border:3px solid #d42a4a;padding:3px 7px;background:#e9e2cce0;transform:rotate(-12deg);animation:odidP .35s cubic-bezier(.3,1.6,.5,1) .7s both}
@keyframes odidP{from{transform:rotate(-12deg) scale(3);opacity:0}to{transform:rotate(-12deg)}}
.odk:has(.odid) .lin{top:calc(var(--sat,0px) + 205px)}
body.tv .odid{max-width:none;width:calc(58*var(--u));grid-template-columns:calc(14*var(--u)) 1fr;gap:calc(2*var(--u));padding:calc(1.6*var(--u)) calc(2*var(--u));border-width:calc(.6*var(--u));box-shadow:calc(1*var(--u)) calc(1*var(--u)) 0 #05060f}
body.tv .odid-f{width:calc(14*var(--u));height:calc(16*var(--u));border-width:calc(.5*var(--u))}
body.tv .odid-t small{font-size:calc(1.6*var(--u))}
body.tv .odid-t b{font-size:calc(3.6*var(--u))}
body.tv .odid-k{height:calc(2.6*var(--u))}
body.tv .odid-p{font-size:calc(2.6*var(--u));border-width:calc(.5*var(--u));padding:calc(.5*var(--u)) calc(1.2*var(--u));right:calc(-2*var(--u));bottom:calc(-2.4*var(--u))}
@media (prefers-reduced-motion:reduce){.odid,.odid-p{animation:none}}

/* ---------- Gorący przewód „Podaj dalej” (propozycje/konkurencje-specjalne, P1): ładunki, lont, załoga w kolejce ---------- */
.gp-gora{display:flex;align-items:center;gap:12px;margin:2px 4px 0}
.gp-lad{display:inline-flex;gap:3px;align-items:flex-end;flex:none}
.gp-lad img{width:34px;height:auto;image-rendering:pixelated}
.gp-lont{position:relative;flex:1;height:12px;background:#0b0e26;border:2px solid #39407a}
.gp-lont::before{content:"";position:absolute;top:0;bottom:0;right:0;left:var(--min,60%);background:repeating-linear-gradient(135deg,rgba(255,92,122,.4) 0 5px,transparent 5px 10px)}
.gp-lont i{position:absolute;inset:0;transform-origin:left center;transform:scaleX(0);background:repeating-linear-gradient(90deg,#ff9f4a 0 6px,#f2c14e 6px 12px)}
.gp-lont .gp-is{position:absolute;inset:0;transform:translateX(0);pointer-events:none}
.gp-lont b{position:absolute;left:-13px;top:-11px;width:26px;height:29px;background:url(img/orbita/przewod/iskra-1.webp) center/contain no-repeat;image-rendering:pixelated}
.gp-zal{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:2px 6px;margin-top:4px}
.gp-o{display:flex;flex-direction:column;align-items:center;width:52px;opacity:.55;transition:transform .18s,opacity .18s}
.gp-o::before{content:"";display:block;width:36px;height:20px;margin-bottom:2px}
.gp-o .pop{width:40px;height:40px}
.gp-o b{font-family:var(--tk);font-weight:400;font-size:10px;color:#c9cff0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gp-o.ja b{color:var(--yellow)}
.gp-o em{font-style:normal;font-family:var(--tk);font-size:10px;color:#5fe3a8;min-height:12px;line-height:12px}
.gp-o.nast{opacity:1}
.gp-o.ma{opacity:1;transform:translateY(-3px) scale(1.16)}
.gp-o.ma::before{background:url(img/orbita/przewod/wtyczka.webp) center/contain no-repeat;image-rendering:pixelated}
.gp-zal.wiele .gp-o{width:44px}
.gp-zal.wiele .gp-o .pop{width:32px;height:32px}
.gp-zal.wiele .gp-o::before{height:16px}
.pf.gp-off{opacity:.3;pointer-events:none}
.gp-kto{text-align:center;margin-top:6px}
.gp-zw{display:flex;flex-direction:column;align-items:center;gap:6px}
.gp-zw b{font-family:var(--display);font-weight:400;font-size:30px;letter-spacing:.05em;color:#ff9f4a}
.gp-zw img{width:150px;height:auto;image-rendering:pixelated}
#gpq.flash-ok{animation:fok .45s ease-out}
#gpq.flash-bad{animation:fbad .45s ease-out}
body.tv .gp-tv{align-self:center;display:flex;align-items:center;gap:14px;width:420px;background:#0b0d1ce6;border:2px solid #39407a;padding:8px 14px}
body.tv .gp-tv .gp-lad img{width:44px}
@media (max-height:720px){.gp-o::before{height:14px}.gp-o .pop{width:34px;height:34px}.gp-zw img{width:110px}}
@media (prefers-reduced-motion:reduce){.gp-o{transition:none}}