#ekranRanking, #ekranWynik, #ekranSamouczek { background: radial-gradient(ellipse at 50% 15%, #313e6570, #070b1fe8); }
.karta.podmenu { background: var(--panel-tlo); border: 2px solid var(--panel-ramka); border-radius: 10px;
  box-shadow: var(--panel-cien); padding: 18px 16px; }
.podmenu .szyld-podmenu { padding: 10px 14px; margin-bottom: 14px; }
.szyld-podmenu::before, .szyld-podmenu::after { box-shadow: none; top: 10px; }
.szyld-podmenu .nadtytul { color: #d7ddf0; font-size: 11px; line-height: 1.4; letter-spacing: 2px; }
.szyld-podmenu h2 { display: flex; justify-content: center; align-items: center; gap: 10px;
  margin: 5px 0 0; font-size: clamp(20px, 5.6vw, 26px); color: #ffd24a; text-shadow: 0 2px 0 #5f4215; }
.szyld-podmenu h2 svg { flex-shrink: 0; width: 25px; height: 25px; fill: none; stroke: currentColor;
  stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.szyld-podmenu .duzy { margin: 7px 0 2px; color: #ffd24a; }
.szyld-podmenu .duzy.blad { color: var(--blad); }
.podmenu .przycisk { --ciemny: #27683a; --jasny: #4c9a48; --krawedz: #9bc779;
  border: 2px solid var(--krawedz); border-radius: 8px; color: #fff;
  background: linear-gradient(110deg, var(--jasny), var(--ciemny)); text-shadow: 0 2px 0 #0005;
  box-shadow: 0 5px 0 #091225, inset 0 2px 0 #ffffff30; }
.podmenu .przycisk.drugi, #btnRankingPowrot { --ciemny: #1d4c87; --jasny: #487ab3; --krawedz: #81a4d2; }
.podmenu #btnRankingOdswiez { --ciemny: #84571e; --jasny: #ae7c2b; --krawedz: #e7bc68; }
.podmenu .przycisk:active { transform: translateY(3px); box-shadow: 0 2px 0 #091225, inset 0 2px 0 #ffffff30; }
.podmenu .lista-wyniku { background: #101a2d80; border: 1px solid #61718f; border-radius: 8px; padding: 10px 12px; }
.podmenu .lista-wyniku span { color: #bfcbe0; }
.podmenu .lista-wyniku li { border-bottom-color: #8392af30; }
.podmenu #imie { background: var(--szyld-tlo); border-color: #7b86a8; border-radius: 8px;
  font: 700 18px 'Trebuchet MS', 'Segoe UI', sans-serif; }
.podmenu #imie:focus { border-color: var(--zloto); }
.podmenu #naglowekFormularza { font-size: 20px; color: #e4c77d; }
.karta.ranking.podmenu { padding: 14px 12px; }
.ranking.podmenu #rankingLista { border: 1px solid #61718f; border-radius: 8px; background: #101a2d80; }
.ranking.podmenu #rankingLista th { background: linear-gradient(#253854, #172239); color: #d7ddf0; border-bottom: 2px solid #a17a38; }
.ranking.podmenu #rankingLista td { border-bottom-color: #8392af30; }
.ranking.podmenu #rankingLista th, .ranking.podmenu #rankingLista td { padding-left: 4px; padding-right: 4px; }
.ranking.podmenu #rankingLista th { padding-left: 2px; padding-right: 2px; }
.ranking.podmenu #rankingLista th:nth-child(1), .ranking.podmenu #rankingLista td:nth-child(1) { width: 16%; }
.ranking.podmenu #rankingLista th:nth-child(2), .ranking.podmenu #rankingLista td:nth-child(2) { width: 27%; }
.ranking.podmenu #rankingLista th:nth-child(3), .ranking.podmenu #rankingLista td:nth-child(3) { width: 27%; }
.ranking.podmenu #rankingLista th:nth-child(4), .ranking.podmenu #rankingLista td:nth-child(4) { width: 30%; }
.ranking.podmenu #rankingLista tr:nth-child(even) td { background: #1d2d4540; }
.ranking.podmenu #rankingStatus { color: #c0cbe0; }
.ranking.podmenu #rankingStatus.blad { color: var(--blad); }
.nauka.podmenu .szyld-podmenu { margin-bottom: 12px; }
.nauka.podmenu .postep-nauki { margin: 8px 0; }
.nauka.podmenu .postep-nauki i { border: 1px solid #7888a5; border-radius: 2px; background: #243552; }
.nauka.podmenu .postep-nauki .aktywny { border-color: #ffe1a0; background: #d9aa42; box-shadow: 0 0 8px #ffd24a30; }
.nauka.podmenu .proba-nauki { background: #101a2d80; border: 1px solid #61718f; border-radius: 8px; color: #c7e6a4; }
@media (max-width: 360px) and (orientation: portrait) {
  .karta.podmenu { padding: 12px; }
  .podmenu .szyld-podmenu { padding: 8px 12px; }
  .szyld-podmenu .nadtytul { font-size: 10px; letter-spacing: 1.5px; }
  .nauka.podmenu .tekst-nauki { margin: 10px 0; }
  .nauka.podmenu .szyld-podmenu { padding-top: 6px; padding-bottom: 6px; margin-bottom: 6px; }
  .nauka.podmenu .postep-nauki { margin: 4px 0; }
  .nauka.podmenu .proba-nauki { margin: 8px 0; padding: 6px 8px; }
}
@media (orientation: landscape) {
  .nauka.podmenu { max-width: 720px; padding: 10px 16px; }
  .nauka.podmenu .szyld-podmenu { display: grid; grid-template-columns: 1fr 1fr;
    align-items: center; gap: 4px 12px; padding: 6px 12px; margin-bottom: 8px; }
  .nauka.podmenu .szyld-podmenu .nadtytul { grid-column: 1; text-align: left; }
  .nauka.podmenu .postep-nauki { grid-column: 1; margin: 0; justify-content: flex-start; }
  .nauka.podmenu .szyld-podmenu h2 { grid-column: 2; grid-row: 1 / 3; margin: 0; }
  .nauka.podmenu .tekst-nauki, .nauka.podmenu .pauzy-nauki, .nauka.podmenu .proba-nauki { margin-top: 6px; margin-bottom: 6px; }
}