/* Strona w przeglądarce telefonu (9.10.2026).
   Wygląd aplikacji z mobile/ czeka na wersję na iOS (komentarz przy telefon.css
   w index.html), więc telefon dostaje zwykłą stronę. Tu poprawki, których ona
   wymagała na wąskim ekranie; warstwa telefonu dotąd je zasłaniała. */
@media (max-width:700px){
  /* Lupa: app.css centruje ikonę przesunięciem o pół wysokości, c-redesign
     przestawia ją na zwykły przepływ, ale przesunięcie zostawało i lupa
     wisiała 20 px nad pozostałymi ikonami. */
  .srch{display:flex;align-items:center;margin-top:0}
  .srch .ic{transform:none}
  .top.szukam .srch .ic{top:50%;transform:translateY(-50%)}

  /* Język i tryb duszka są też w Koncie → Wygląd. W pasku zabierały tytułowi
     prawie połowę szerokości: przy 375 px zostawało mu 67 px. */
  .top-r .jez-pas, .top-r .dz-btn{display:none}
}

/* Jeden krój w interfejsie (17.10.2026).
   Etykiety biorą krój z --f-mono. Na komputerze podmienia go z28-komputer.css
   (od 861 px), w aplikacji iOS warstwa v17 z telefon.css. Telefon w przeglądarce
   nie ma żadnej z nich, więc etykiety zostawały pismem maszynowym. Ta sama
   podmiana co w v17: krój maszynowy tylko w kodzie. */
@media (max-width:860px){
  :root{--f-mono:var(--f-sans)}
  html body :is(pre, code, kbd, samp, .kd, .kd *, .kd-meta, .kd-meta *){
    font-family:'IBM Plex Mono',ui-monospace,monospace !important}
}

/* Schowane panele nie wychodzą poza ekran (9.10.2026).
   Konrad: na telefonie stronę dało się przesuwać w lewo i w prawo. Menu boczne
   leżało 236 px za lewą krawędzią, czat z nauczycielem 375 px za prawą
   (transform: translateX). Chrome je przycina, ale Safari na iPhonie liczy
   przesunięty panel fixed do obszaru przesuwania, a starszy iOS nie zna
   overflow-x: clip. Teraz panel stoi na swoim miejscu i jest przycinany
   clip-path: chowa się i wysuwa tą samą krawędzią, a jego pudełko nigdy nie
   wystaje. Ujemny margines przycięcia w stanie otwartym zostawia cień. */
.czat{transform:none;clip-path:inset(0 0 0 100%);
  transition:clip-path .32s var(--ease),visibility .32s}
.czat.on{transform:none;clip-path:inset(0 0 0 -64px)}
@media(max-width:860px){
  .side{transform:none;clip-path:inset(0 100% 0 0);
    transition:clip-path .28s var(--ease),visibility .28s}
  .side.open{transform:none;clip-path:inset(0 -64px 0 0)}
}
/* Starszy Safari bez overflow-x: clip: hidden na body przechodzi na okno
   przeglądarki (html zostaje visible), więc nie psuje przyklejonego nagłówka. */
@supports not (overflow-x:clip){ html{overflow-x:visible} body{overflow-x:hidden} }