/* r38-sb · pasek statusu iOS 1:1 z Apple (30.10.2026).
   Każdy pasek = jeden plik SVG 390 × 54 pt z assets/sb/: godzina w SF Pro Semibold 17 pt jako krzywe (bez fontu w przeglądarce),
   zasięg, Wi‑Fi i bateria zmierzone na zrzucie z symulatora iPhone 15 Pro, iOS 26.5 (@3x). Biały na ciemnym, czarny na jasnym.
   Pasek zajmuje górne 54 pt ekranu 390 pt i skaluje się tą samą jednostką co ekran (--u, --gu, --p lub szerokość telefonu).
   Stare dzieci (tekst godziny, ikony z CSS, „5G”) są ukryte; znaczniki w HTML zostają bez zmian. */

.h11-sb > *, .h19-sb > *, .g17-sb > *, .as-status > *, .h-sb > * { display: none !important; }

/* hero: telefon (ekran 390 × 844 u) */
.h11-sb { left: 0; right: auto; top: 0; width: calc(390 * var(--u)); height: calc(54 * var(--u)); color: #fff; }
/* ::before (cień pod paskiem z r11) zostaje pod spodem; sam pasek w ::after, nad cieniem */
.h11-sb::after { content: ""; position: absolute; inset: 0; background: url(sb/sb-2058-white.svg) 0 0 / 100% 100% no-repeat; }

/* hero: obrys telefonu na wokalistce (ekran w ramce, wcięcie 13.65 gu); zostaje dawna przezroczystość 0.8 */
.h19-sb { left: calc(13.65 * var(--gu)); right: auto; top: calc(13.65 * var(--gu)); width: calc(390 * var(--gu)); height: calc(54 * var(--gu));
  color: #fff; background: url(sb/sb-2058-white.svg) 0 0 / 100% 100% no-repeat; opacity: .8; }

/* porównanie: LineApp (ciemny ekran) */
.g17-sb { left: 0; right: auto; top: 0; width: calc(390 * var(--p)); height: calc(54 * var(--p)); display: block;
  background: url(sb/sb-2040-white.svg) 0 0 / 100% 100% no-repeat; }

/* porównanie: „Industry” (jasne ekrany) */
.as-status { left: 0; right: auto; top: 0; width: calc(390 * var(--u)); height: calc(54 * var(--u)); padding: 0; display: block;
  background: url(sb/sb-2040-black.svg) 0 0 / 100% 100% no-repeat; }
.idp .as-status { background-image: url(sb/sb-2040-white.svg); }

/* formularz: ekran główny w ramce (ciemny) */
.h-sb { display: block; width: 100%; aspect-ratio: 390 / 54; height: auto; padding: 0;
  background: url(sb/sb-1200-white.svg) 0 0 / 100% 100% no-repeat; }

/* porównanie: warstwa LineApp z obrazem/wideo (mapa, artysta). Wypalony w pliku stary pasek (szablon Figmy) usunięty
   w kopiach assets/sb/*-nosb.*; tu kładziemy pasek Apple, ten sam co na ekranie „Schedule”. */
.vs4-item[data-vs="map"] .lay.us::after, .vs4-item[data-vs="artist"] .lay.us::after { content: ""; position: absolute; left: 0; top: 0; width: 100%;
  aspect-ratio: 390 / 54; background: url(sb/sb-2040-white.svg) 0 0 / 100% 100% no-repeat; pointer-events: none; z-index: 3; }

/* telefony .ph4: Dynamic Island w wymiarach Apple (iPhone 15/16 Pro: 126 × 37.33 pt, 11 pt od góry ekranu),
   żeby godzina i ikony stały na jej osi jak w iOS; wcześniej 121 × 28.7 pt, 18.6 pt od góry. */
.ph4 > .scr::after { top: calc(11 / 844 * 100%); width: calc(126 / 390 * 100%); height: calc(37.33 / 844 * 100%); }

/* formularz: ekran w ramce nie miał Dynamic Island; pasek Apple stoi na jej osi, więc wyspa wraca (te same wymiary) */
.fin-ph .phone.home::before { content: ""; position: absolute; left: 50%; top: calc(11 / 844 * 100%); width: calc(126 / 390 * 100%);
  height: calc(37.33 / 844 * 100%); transform: translateX(-50%); border-radius: 999px; background: #000; z-index: 30; pointer-events: none; }

/* sponsorzy: podgląd miejsca reklamy w telefonie (r4.js podmienia zrzut). Zrzuty miały wypalone różne paski
   (LTE, „EE”, szablony Figmy); czyste kopie w assets/sb/sponsor/, a pasek Apple kładziemy tutaj, dobrany do zrzutu:
   20:40 domyślnie, 21:12 dla 09a–c (ta godzina była na zrzutach), ekran blokady 03 = bez godziny, jak w iOS 26. */
.cprev-ph > .scr::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; aspect-ratio: 390 / 54; z-index: 2; pointer-events: none; /* pod przyciemnieniem .cprev-spot (z 3), jak reszta zrzutu */
  background: url(sb/sb-2040-white.svg) 0 0 / 100% 100% no-repeat; }
.cprev-ph > .scr:has(.cprev-img[src*="/09"])::before { background-image: url(sb/sb-2112-white.svg); }
.cprev-ph > .scr:has(.cprev-img[src*="03-zone-push"])::before { background-image: url(sb/sb-lock-white.svg); }