/* Tablica załogi „Kto na kogo” (propozycje/kto-na-kogo, koncepcja C): po oknie kart kafel na osobę, co dostaje i co rzuca.
   Telewizor i komputer w jednostkach --u (1/100 wysokości sceny), telefon w px. Zaznaczenie bez ramek: podniesienie i jaśniejsze tło.
   Animacja tylko transform i opacity, raz na kartę (WebKit). */
.tb-tag{display:inline-block;font:400 9px/1.2 var(--display, 'Orbita Pixel', monospace);color:#fff;border:2px solid #05060f;padding:1px 4px;white-space:nowrap;letter-spacing:.03em}
.tb-tag.no{background:#b8283f}.tb-tag.sz{background:#3a4170}.tb-tag.fi{background:#6a3fb0}.tb-tag.or{background:#b0600f}.tb-tag.ok{background:#1d7a52}
.tb-tw{display:block;flex:none;width:22px;height:22px;border:2px solid var(--c);background:#0b0d1c;image-rendering:pixelated}
.tb-kt{display:block;width:24px;height:auto;image-rendering:auto;-webkit-user-drag:none}
.tb-h{font:400 10px var(--display, 'Orbita Pixel', monospace);color:#9aa3d0;letter-spacing:.06em}
.tb-strz{flex:none;width:0;height:0;border-left:8px solid var(--c);border-top:5px solid transparent;border-bottom:5px solid transparent}
.tb-ss{flex:none;font:400 9px var(--display, 'Orbita Pixel', monospace);color:#5fe3a8}
.tb-pust{font-family:var(--tk, 'Orbita Tekst', monospace);font-size:11px;color:#6b73a8}
.tb-c,.tb-r{animation:tbWjazd .35s cubic-bezier(.2,1.6,.4,1) both}
@keyframes tbWjazd{from{transform:translateY(8px) scale(.6);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.tb-c,.tb-r{animation:none}}
.tb-c.blok .tb-kt,.tb-c.lustro .tb-kt{opacity:.45}

/* ---------- kafel (wspólny szkielet) ---------- */
.tb-k{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;background:#0b0e26e8;border:2px solid #05060f;box-shadow:inset -2px -2px 0 #0008,inset 2px 2px 0 #ffffff12;padding:4px}
.tb-k.cel{background:#3a1622f0}
.tb-gl{display:flex;align-items:center;gap:4px;width:100%;min-width:0}
.tb-nk{font:400 10px var(--display, 'Orbita Pixel', monospace);color:#e9ecff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tb-dost{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;align-items:center;min-height:22px}
.tb-rz{display:flex;align-items:center;justify-content:center;gap:3px;flex-wrap:wrap}
.tb-r{display:flex;align-items:center;gap:2px}
.tb-c{position:relative}
.tb-ik{position:absolute;left:-4px;top:-4px;width:12px;height:auto;image-rendering:auto}

/* ---------- telefon ---------- */
.tb-tel{flex:1 1 auto;gap:7px;padding:0 4px 8px;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}

/* ---------- telewizor i komputer: kafle na przyciemnionej sali (scena wieży, --u) ---------- */
#app.namapie .tb-ciem{position:fixed;inset:0;z-index:2;background:#05060f;opacity:.5;pointer-events:none}
#app.namapie .tb-tv{position:fixed;left:calc(5*var(--u));right:calc(5*var(--u));top:calc(18*var(--u));bottom:calc(4*var(--u));z-index:3;display:flex;flex-direction:column;align-items:center;gap:calc(2.2*var(--u));pointer-events:none}
body.desk #app.namapie .tb-tv{right:calc(400px + 32px)}
.tb-tv .tb-info{font-family:var(--tk, 'Orbita Tekst', monospace);font-size:calc(2.6*var(--u));color:#cfd4f5;background:#0d1030ee;border:calc(.5*var(--u)) solid #05060f;padding:calc(.6*var(--u)) calc(2.4*var(--u))}
.tb-tv .tb-siatka{flex:1;min-height:0;width:100%;display:grid;grid-template-columns:repeat(var(--k),minmax(0,1fr));grid-auto-rows:minmax(0,1fr);padding-top:calc(2.6*var(--u));gap:calc(1.8*var(--u))}
.tb-tv .tb-k{padding:calc(1*var(--u)) calc(.9*var(--u));gap:calc(.8*var(--u));border-width:calc(.45*var(--u));box-shadow:inset calc(-.45*var(--u)) calc(-.45*var(--u)) 0 #0008,inset calc(.45*var(--u)) calc(.45*var(--u)) 0 #ffffff12}
.tb-tv .tb-k.cel{transform:translateY(calc(-1.4*var(--u))) scale(1.03)}
.tb-tv .tb-nac{position:absolute;top:calc(-2.2*var(--u));left:50%;transform:translateX(-50%);font-size:calc(1.7*var(--u));border-width:calc(.3*var(--u));padding:calc(.15*var(--u)) calc(.8*var(--u))}
.tb-tv .tb-sp{height:calc(19*var(--u));width:auto;image-rendering:auto}
.tb-tv .tb-nk{font-size:calc(2.2*var(--u));background:#0008;border:calc(.35*var(--u)) solid var(--c);padding:calc(.2*var(--u)) calc(.9*var(--u));max-width:100%}
.tb-tv .tb-gl{justify-content:center;gap:calc(.8*var(--u))}
.tb-tv .tb-gl .tb-tw{width:calc(5.4*var(--u));height:calc(5.4*var(--u));border-width:calc(.35*var(--u))}
.tb-tv .tb-h{font-size:calc(1.5*var(--u));align-self:flex-start}
.tb-tv .tb-dost{width:100%;flex-wrap:wrap;gap:calc(1.2*var(--u));min-height:calc(14*var(--u));align-items:flex-start;padding:0 calc(1*var(--u))}
.tb-tv .tb-dost .tb-c{flex:0 1 auto;width:min(calc(10*var(--u)),calc((100% - (var(--n) - 1)*1.2*var(--u))/var(--n)))}
.tb-tv .tb-dost .tb-kt{width:100%}
.tb-tv .tb-dost .tb-tw{position:absolute;right:calc(-.5*var(--u));bottom:calc(-.6*var(--u));width:45%;height:auto;aspect-ratio:1/1;max-width:calc(4*var(--u));border-width:calc(.3*var(--u))}
.tb-tv .tb-ik{left:calc(-.6*var(--u));top:calc(-.6*var(--u));width:40%;max-width:calc(4*var(--u))}
.tb-tv .tb-pust{font-size:calc(1.8*var(--u));padding-top:calc(3*var(--u))}
.tb-tv .tb-rz{margin-top:auto;gap:calc(.8*var(--u))}
.tb-tv .tb-r{gap:calc(.5*var(--u))}
.tb-tv .tb-rz .tb-kt{width:calc(4.3*var(--u))}
.tb-tv .tb-rz .tb-tw{width:calc(3.9*var(--u));height:calc(3.9*var(--u));border-width:calc(.3*var(--u))}
.tb-tv .tb-strz{border-left-width:calc(1.6*var(--u));border-top-width:calc(1*var(--u));border-bottom-width:calc(1*var(--u))}
.tb-tv .tb-ss{font-size:calc(1.4*var(--u))}
.tb-tv .tb-tag{font-size:calc(1.4*var(--u));border-width:calc(.25*var(--u))}
/* ponad 6 osób: dwa rzędy, głowa z twarzą zamiast postaci */
.tb-tv .tb-siatka.duzo .tb-dost{min-height:calc(9*var(--u))}
.tb-tv .tb-siatka.duzo .tb-dost .tb-c{width:min(calc(5.6*var(--u)),calc((100% - (var(--n) - 1)*1.2*var(--u))/var(--n)))}

.tb-tv .tb-siatka.duzo .tb-nk{font-size:calc(1.9*var(--u))}
/* telewizor bez sceny (mostek): tablica w ramce tvFrame */
body.tv #app:not(.namapie) .tb-tv{position:relative;width:100%;height:60vh;display:flex;flex-direction:column;align-items:center;gap:calc(2*var(--u))}
body.tv #app:not(.namapie) .tb-ciem{display:none}
/* telefon: lista skutków (propozycje/poprawki-ekranow, koncepcja B): nagłówek, wiersz na kartę, twoje rzuty, chipy reszty załogi */
.tl-gl{display:flex;align-items:center;gap:10px}
.tl-gl .tb-tw{width:44px;height:44px;border-color:#f2c14e}
.tl-gl b{display:block;font:400 14px var(--display, 'Orbita Pixel', monospace);color:#f2c14e;letter-spacing:.04em}
.tl-gl small{display:block;font:400 15px/1.2 var(--tk, 'Orbita Tekst', monospace);color:#cfd4f5}
.tl-gl .tb-tag{margin-left:auto}
.tl-w{display:grid;grid-template-columns:72px 1fr;gap:10px;align-items:center;padding:8px;background:#0d1030;border:2px solid #2a3060;box-shadow:3px 3px 0 #05060f}
.tl-kt{width:72px;height:auto;display:block;image-rendering:auto}
.tl-t{min-width:0}
.tl-t b{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font:400 14px var(--display, 'Orbita Pixel', monospace);letter-spacing:.04em;color:#fff}
.tl-od{display:flex;align-items:center;gap:6px;font:400 14px var(--tk, 'Orbita Tekst', monospace);color:#9aa3d0;margin:3px 0}
.tl-t p{margin:0;font:400 16px/1.2 var(--tk, 'Orbita Tekst', monospace);color:#e8ecff;-webkit-font-smoothing:none}
.tl-w.blok,.tl-w.lustro{background:#141834;border-color:#3a4170}
.tl-w.blok .tl-kt,.tl-w.lustro .tl-kt{opacity:.5}
.tl-w.blok p,.tl-w.lustro p{color:#9aa3d0}
.tl-nic{padding:12px;text-align:center;font:400 16px var(--tk, 'Orbita Tekst', monospace);color:#9aa3d0;background:#0d1030;border:2px solid #2a3060}
.tl-h{margin-top:4px;font:400 11px var(--display, 'Orbita Pixel', monospace);letter-spacing:.08em;color:#9aa3d0}
.tl-rz{display:flex;align-items:center;gap:8px;font:400 15px var(--tk, 'Orbita Tekst', monospace);color:#e8ecff}
.tl-rz .tb-tag{margin-left:auto}
.tl-km{width:30px;height:auto;display:block;flex:none}
.tl-reszta{display:flex;flex-wrap:wrap;gap:6px}
.tl-chip{display:flex;align-items:center;gap:4px;background:#0d1030;border:2px solid #2a3060;padding:3px 5px}
.tl-chip.cel{border-color:#b8283f}
.tl-chip .tb-tw{width:26px;height:26px}
.tl-chip .tl-km{width:20px}
.tl-chip .tl-km.blok,.tl-chip .tl-km.lustro{opacity:.45}
.tl-chip small{font:400 13px var(--tk, 'Orbita Tekst', monospace);color:#9aa3d0}