/* PANEL · v2 · reguły funkcjonalne (3.11, Panel): ładowane PO te.css, te-base.css i te-panel-v2.css (Design, bez zmian).
   Tylko to, czego v2 nie ma, a bez czego panel nie działa poprawnie: ukrywanie [hidden], teksty dla czytnika ekranu,
   „Przejdź do treści”, ekran starej przeglądarki, odtwarzacz 9:16, zgoda, pomoc, błąd pola. Wzięte 1:1 z styl.css (v1). */
[hidden], #pasek-wyloguj[hidden], .numer-zam:empty { display: none !important; }
.dla-czytnika { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pomin { position: absolute; left: -9999px; z-index: 60; } .pomin:focus { left: 12px; top: 12px; background: var(--zloto); color: var(--tlo); padding: 8px 12px; }
@keyframes pojaw { to { visibility: visible; } }
.stara-przegladarka { visibility: hidden; animation: pojaw 0.01s linear 3s forwards; }
@media (prefers-reduced-motion: reduce) { .stara-przegladarka { animation: pojaw 0.01s linear 3s forwards !important; } }
.odtwarzacz { position: fixed; inset: 0; background: var(--tlo); display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 8px; padding: max(16px, env(safe-area-inset-top, 0px)) 16px max(16px, env(safe-area-inset-bottom, 0px)); z-index: 70; }
.odtwarzacz .drobne { max-width: 420px; text-align: center; margin: 0; }
.odtwarzacz .przycisk { max-width: 320px; margin-top: 4px; }
.ramka-9x16 { height: min(72vh, calc((100vw - 32px) * 16 / 9)); aspect-ratio: 9 / 16; background: #000; border: 1px solid var(--linia); border-radius: 12px; overflow: hidden; }
.ramka-9x16 iframe { width: 100%; height: 100%; border: 0; }
@supports not (aspect-ratio: 9 / 16) {
  .ramka-9x16 { width: min(calc(72vh * 9 / 16), calc(100vw - 32px)); height: auto; position: relative; }
  .ramka-9x16::before { content: ""; display: block; padding-top: 177.78%; }
  .ramka-9x16 iframe { position: absolute; inset: 0; }
}
.pole-zgody { display: flex; gap: 12px; align-items: flex-start; margin: 16px 0; padding: 16px; background: var(--plyta); border: 1px solid var(--linia-2); border-radius: 6px; }
.pole-zgody input { width: 24px; height: 24px; margin-top: 2px; flex: none; accent-color: var(--turkus); }
.pole-zgody label { font-weight: 400; margin: 0; }
.ramka-kontakt { display: grid; gap: 4px; padding: 14px 16px; margin: 0 0 16px; background: var(--plyta); border: 1px solid var(--linia); border-radius: 6px; }
.pytanie { border: 1px solid var(--linia); border-radius: 6px; background: var(--plyta); margin: 0 0 8px; }
.pytanie > summary { cursor: pointer; min-height: 52px; padding: 14px 16px; font-weight: 600; color: var(--tekst); }
.pytanie > p { padding: 0 16px 14px; color: var(--body); }
.pomoc { border-left: 3px solid var(--linia-2); padding: 4px 0 4px 14px; margin: 8px 0 16px; }
.pomoc p { margin: 8px 0; }
.blad-pola { margin: 6px 0 0; font-size: 14px; color: var(--zloto); }
.blad-pola::before { content: "! "; font-weight: 700; }
#adres-kodu { word-break: break-all; }
.material-stan:empty { display: none; }
/* Nagłówek ekranu dostaje fokus z programu (czytnik ekranu) – bez ramki jak w v1; ramka zostaje dla klawiatury na kontrolkach. */
.ekran h1:focus, .ekran h1:focus-visible { outline: none; }
/* Znacznik ma ukośniki w tekście (Kanon: // TEKST //) – bez podwójnych ukośników z arkusza v2. */
.znacznik::before, .znacznik::after { content: none !important; }
/* TQ-R2P-04 (4.11): numer zamówienia widoczny także na telefonie – PG-17 („Numer zamówienia jest na górze panelu.”) do niego odsyła. */
@media (max-width: 639px) { .numer-zam { display: inline-flex; font-size: 10px; letter-spacing: .06em; } }
/* TQ-R2P-05 (4.11): wąskie telefony – mniejsze logo, „Wyloguj” jako sama ikona (nazwa zostaje dla czytnika ekranu). */
@media (max-width: 420px) {
  .naglowek-panelu .container-x { gap: 8px; padding-left: 12px; padding-right: 12px; }
  .naglowek-panelu .marka img { width: 180px !important; height: auto !important; }
  #pasek-wyloguj { padding-left: 10px !important; padding-right: 10px !important; min-width: 44px; justify-content: center; }
  #pasek-wyloguj .wyloguj-tekst { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 359px) { .naglowek-panelu .marka img { width: 150px !important; } }
/* 360-W03 (4.11): „Głos syntetyczny · AI” i klauzula w osobnych wierszach (span w v2 był w jednej linii). */
.grupa .podpis-grupy { display: block; }
/* 360-B04 (4.11): „Pobierz” widoczne przy PDF i audio (jak przy ZIP i filmie); znacznik pobrania obok. */
.plik-krotki .akcja { margin-left: auto; }