/* AUTOGENEROVANO CORALEM, neupravovat.
 * Zdroj pravdy je stejnojmenny .less soubor, tento .css se pri kazde
 * synchronizaci prepisuje. Upravy delej v .less souboru. */
/* Světlina 68: styly obrazovky Učení. Každý soubor LESS se překládá zvlášť, proto tu nejsou proměnné ani mixiny jádra; sklo, barvy, tlačítka a pole bere z 001-svetlina. */
/* Světlina 87: v učícím režimu se tabule jen rozsvítí bělejším sklem (--sv-belost
   v jádře), hrana, čára i stín zůstávají stejné jako jinde a nic nežloutne
   (Ondra 24. 9. 2026: „v učícim režimu nebude žloutnout"). */
.sv-uceni__panel .sv-panel__hluboko {
  display: none;
}
/* Ucici mod: jen ucebni plocha, Zpet a nastroje. */
.sv-ram[data-obrazovka="uceni"] .sv-sloupec,
.sv-ram[data-obrazovka="uceni"] .sv-lista,
.sv-ram[data-obrazovka="uceni"] .sv-asistent,
.sv-ram[data-obrazovka="uceni"] .sv-hlavicka {
  display: none;
}
.sv-ram[data-obrazovka="uceni"] .sv-plocha::before {
  display: none;
}
/* Světlina 54: slogan nálady v učení nestojí pod polem, pole pak sedí u spodní hrany
   stejně jako v bočním chatu (Ondra 24. 9. 2026: „V učícím režimu je moc velký
   odsazení od spodního okraje toho zadávacího políčka"). */
.sv-ram[data-obrazovka="uceni"] .sv-slogan {
  display: none;
}
/* Světlina 24: v učícím režimu je plocha jeden sloupec přes celý rám (chat
   vpravo tu není), obsah pak stojí opravdu uprostřed. */
@media (min-width: 768px) {
  .sv-ram[data-obrazovka="uceni"] .sv-plocha__telo {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: 'obsah' 'prehravac';
  }
}
/* Ucici mod: hlavicka, vyber predmetu, napady, a panel pruvodce pres zbytek vysky. */
.sv-ram[data-obrazovka="uceni"] .sv-obrazovky {
  display: flex;
  flex-direction: column;
}
.sv-ram[data-obrazovka="uceni"] .sv-obrazovka.je-aktivni,
.sv-ram[data-obrazovka="uceni"] .sv-obrazovka.je-aktivni > [data-sv-obsah] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.sv-uceni {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
}
.sv-uceni .sv-hlava {
  margin-bottom: 12px;
}
.sv-uceni .sv-hlava h1 {
  font-size: clamp(22px, calc(20.34px + 0.442vw), 28px);
}
.sv-uceni__predmety,
.sv-uceni__napady {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sv-mezera-cipu);
  margin-bottom: 10px;
}
.sv-uceni__napady .sv-tl {
  min-height: var(--sv-tl-maly);
  padding: 6px 14px;
  border-radius: 999px;
  corner-shape: round;
  font-size: var(--sv-tl-pismo);
}
.sv-uceni__panel {
  flex: 1;
  min-height: 260px;
  display: flex;
  flex-direction: column;
}
/* UČÍCÍ REŽIM (Světlina 23, 24), od nuly. Ondra 23. 9. 2026: „Aby na mobilu
   učící režim nebyl totálně designová sračka, ale byl fakt jako funkční,
   krásnej" a „to horní menu ... to je katastrofa designová".
   Hlavička je jeden řádek jednoho stylu: Zpět, název, předměty a vpravo
   nastavení, historie a nový chat; na počítači uhne plovoucímu zvuku a oku.
   Na telefonu je Zpět jen šipka v řádku se zvukem a okem a pod ním řádek
   předmětů s nástroji. Obsah pod hlavičkou stojí uprostřed rámu. */
.sv-uceni > :not(.sv-uceni__hlava-obal) {
  width: 100%;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}
.sv-uceni__hlavicka {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: var(--sv-tl-horni);
  margin: 0 0 var(--sv-g);
  padding-right: calc(2 * var(--sv-tl-horni) + 2 * var(--sv-mezera-nastroju));
}
.sv-uceni__hlavicka h1 {
  margin: 0;
  font-size: var(--sv-h2);
  white-space: nowrap;
}
.sv-uceni__vyber {
  display: flex;
  min-width: 0;
}
/* Světlina 51: výběr předmětu je vysoký přesně jako tlačítka vpravo, jinak
   by řada narostla a nástroje by stály o pixel níž než zvuk a oko. */
.sv-uceni__vyber .sv-tl {
  height: var(--sv-tl-horni);
  min-height: var(--sv-tl-horni);
  padding-top: 0;
  padding-bottom: 0;
  max-width: 100%;
}
.sv-uceni__vyber .sv-tl span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sv-uceni__nastroje {
  display: flex;
  align-items: center;
  gap: var(--sv-mezera-nastroju);
  margin-left: auto;
  flex-shrink: 0;
}
.sv-uceni__nastroje .sv-tl--ikona {
  width: var(--sv-tl-horni);
  min-height: var(--sv-tl-horni);
}
.sv-uceni__zpet {
  flex-shrink: 0;
}
/* Světlina 41: výběr předmětů je nabídka pod tlačítkem, ne modál. */
.sv-uceni__vyber {
  position: relative;
}
.sv-uceni__vyber .sv-tl [data-coral-ikona="chevron-down"] {
  opacity: 0.7;
}
.sv-uceni__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: max-content;
  min-width: 240px;
  max-width: min(320px, calc(100vw - 32px));
  max-height: min(60vh, 420px);
  overflow-y: auto;
  padding: 8px;
  border-radius: calc(16px * var(--sv-roh-hladky, 1));
  corner-shape: squircle;
  border: 1px solid var(--sv-plovouci-hrana);
  background: var(--sv-plovouci);
  backdrop-filter: var(--sv-plovouci-rozmazani);
  -webkit-backdrop-filter: var(--sv-plovouci-rozmazani);
  box-shadow: var(--sv-plovouci-stin);
  transform-origin: top left;
  animation: sv-vyskok 160ms cubic-bezier(0.22, 1, 0.36, 1);
}
.sv-uceni__menu .sv-radek {
  font-size: var(--sv-text-m);
}
.sv-uceni__fajfka {
  margin-left: auto;
  width: 18px;
  height: 18px;
  color: var(--sv-zluta-tmava);
}
.sv-uceni .coral-asistent__hlava {
  display: none !important;
}
/* Světlina 46: čipy a uvítání jsou první věci v těle chatu (005-uceni.js)
   a odrolují s rozhovorem, pod hlavičkou nic připnuté není. V prázdném chatu
   stojí čipy nahoře, uvítání uprostřed a pole dole; s první zprávou nebo
   otevřenou historií uvítání zmizí. Obsah při rolování měkce mizí pod
   hlavičkou, mezera mezi hlavičkou a čipy zůstává stejná. */
.sv-uceni__zacatek {
  display: contents;
}
.sv-uceni__panel .sv-uceni__napady {
  flex: 0 0 auto;
  margin-bottom: 0;
}
/* Pole je vždycky dole nalepené, chat roste nahoru (Ondra 21. 9. 2026). */
.sv-uceni__panel .coral-asistent__panel {
  justify-content: flex-end;
}
.sv-uceni__panel:has(.sv-historie) .sv-uceni__znak {
  display: none;
}
@media (max-width: 767px) {
  /* Světlina 51: hlavička je skrytá, první řada (Zpět a Učící mód) proto
       stojí na stejné ose jako zvuk a oko (stejný výpočet jako u nich). */
  .sv-ram[data-obrazovka="uceni"] .sv-obrazovka {
    padding-top: calc((var(--sv-hlavicka) - 1px - var(--sv-tl-v) - 2px) / 2);
  }
  /* Světlina 34: vedle šipky zpět je nápis Učící mód (Ondra 23. 9. 2026:
       „na mobilu může bejt napsáno učící mód vedle tlačítka zpět, vejde se to
       tam"). Vpravo nad ním leží zvuk a oko, proto odsazení. */
  .sv-uceni__hlavicka {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: 'zpet nadpis nadpis' 'vyber vyber nastroje';
    gap: 0 8px;
    padding-right: 0;
    margin-bottom: var(--sv-g);
  }
  .sv-uceni__zpet {
    grid-area: zpet;
    justify-self: start;
    align-self: center;
    border: 0;
    background: none;
    box-shadow: none;
  }
  .sv-uceni__zpet span {
    display: none;
  }
  .sv-uceni__hlavicka h1 {
    grid-area: nadpis;
    align-self: center;
    min-width: 0;
    padding-right: calc(2 * var(--sv-tl-horni) + 2 * var(--sv-mezera-nastroju));
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--sv-h2);
  }
  .sv-uceni__vyber {
    grid-area: vyber;
  }
  .sv-uceni__nastroje {
    grid-area: nastroje;
  }
  .sv-uceni__napady .sv-tl {
    min-height: var(--sv-tl-maly);
    padding: 4px 12px;
    font-size: var(--sv-maly);
  }
}
/* Úzký sloupec i na PC (vedle kina, úzké okno): hlavička ve dvou řadách jako
   na telefonu, ať se název vejde v každém jazyce a předměty ukážou text.
   Kontejner je jen obal hlavičky: kontejner drží pevné prvky uvnitř sebe,
   takže na celém učení by posunul nabídky a okna průvodce. Obal je nad
   panelem, ať nabídka předmětů leží přes chat. */
.sv-uceni__hlava-obal {
  position: relative;
  z-index: 3;
  align-self: stretch;
  width: 100%;
  container: sv-uceni-hlava / inline-size;
}
@container sv-uceni-hlava (max-width: 560px) {
  .sv-uceni__hlavicka {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: 'zpet nadpis nadpis' 'vyber vyber nastroje';
    gap: 0 8px;
    padding-right: 0;
  }
  .sv-uceni__zpet {
    grid-area: zpet;
    justify-self: start;
    align-self: center;
  }
  .sv-uceni__hlavicka h1 {
    grid-area: nadpis;
    align-self: center;
    min-width: 0;
    padding-right: calc(2 * var(--sv-tl-horni) + 2 * var(--sv-mezera-nastroju));
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sv-uceni__vyber {
    grid-area: vyber;
  }
  .sv-uceni__nastroje {
    grid-area: nastroje;
  }
}
/* Ucici mod ma vlastni napady, panel uz je znovu nekresli. */
.sv-uceni__panel .sv-napady,
.sv-uceni__panel .coral-asistent__uvod {
  display: none;
}
/* Hlava panelu (historie, novy rozhovor) sedi uvnitr panelu, aby nelezla do napadu. */
.sv-uceni__panel {
  padding-top: 0;
}
.sv-uceni__panel .coral-asistent__hlava {
  position: static;
  display: flex;
  gap: 2px;
  order: -2;
  align-self: flex-end;
  margin-bottom: 4px;
}
/* Pocitac: ucici mod je jeden sloupec uprostred, nic se neroztahuje pres celou sirku. */
@media (min-width: 768px) {
  .sv-uceni .sv-hlava {
    margin-bottom: 10px;
  }
  .sv-uceni__panel .coral-asistent__rezimy {
    max-width: 420px;
  }
}
/* Chat je vzdycky dole nalepeny, telo roste nahoru (Ondra 21. 9.). */
.sv-uceni__panel {
  justify-content: flex-end;
  margin-top: calc(-1 * var(--sv-g));
}
.sv-uceni__panel .coral-asistent__telo {
  flex: 1;
  min-height: 0;
  padding-top: max(10px, var(--sv-g));
}
/* Telefon: hlavicka drobna, vyber a napady na jeden posuv do strany, panel dostane zbytek vysky. */
@media (max-width: 767px) {
  .sv-uceni .sv-hlava {
    margin-bottom: 8px;
  }
  .sv-uceni .sv-hlava__veta {
    display: none;
  }
  .sv-uceni__predmety,
  .sv-uceni__napady {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    margin-bottom: 8px;
    padding-bottom: 2px;
  }
  .sv-uceni__predmety::-webkit-scrollbar,
  .sv-uceni__napady::-webkit-scrollbar {
    display: none;
  }
  .sv-uceni__predmety .sv-tl,
  .sv-uceni__napady .sv-tl {
    flex-shrink: 0;
  }
  .sv-uceni__panel {
    min-height: 0;
  }
  /* Světlina 46: čipy odrolují s chatem, místo tedy není vzácné; všechny
       čtyři jsou vidět ve dvou řadách, žádný neschovaný za okrajem. */
  .sv-uceni__panel .sv-uceni__napady {
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow: visible;
    padding-bottom: 0;
  }
}
/* Ondra 22. 9. 2026: „ten ohýnek bych udělal o dvě třetiny nebo o něco větší,
   ale aby nebyl vůbec průhledný, a pod ním byla hláška, co se hodí podle doby,
   kdy to otevřeš." Znak se střídá (oheň, duha, jednorožec a další) a animaci
   mu dá vrstva Coralu. */
.sv-uceni__znak {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-size: clamp(64px, 16vh, 160px);
  line-height: 1;
  opacity: 1;
  pointer-events: none;
  user-select: none;
  text-align: center;
}
.sv-uceni__znak img {
  width: clamp(64px, 16vh, 160px);
  height: clamp(64px, 16vh, 160px);
}
/* Stín jako u nadpisů, ne silnější (Ondra 22. 9. 2026: „u toho písma pod tím
   měsícem má to až moc extrémní ten stín; u hlavního nadpisu vypadá správně"). */
/* Stín jako u nadpisů, ne silnější (Ondra 22. 9. 2026: „u toho písma pod tím
   měsícem má to až moc extrémní ten stín; u hlavního nadpisu vypadá správně").
   Mixin `.zapusteno()` bydlí v 001-svetlina.less a ten se překládá zvlášť,
   takže se tu sáhne rovnou na proměnnou. */
.sv-uceni__pozdrav {
  font-size: var(--sv-h3);
  font-weight: 700;
  line-height: 1.4;
  max-width: 320px;
  color: var(--sv-text);
  text-shadow: 0 1px 0 var(--sv-odlesk);
}
.sv-uceni__panel:has(.coral-asistent__zprava) .sv-uceni__znak {
  display: none;
}
/* Světlina 35: uvítání, které se nevejde nad pole, se schová celé (hlídá 005-uceni.js). */
.sv-uceni__znak.je-mimo {
  visibility: hidden;
}
.sv-tl--ikonaText {
  padding: 8px 14px;
}
/* V ucicim modu se premysleni voli z nabidky, prepinac rezimu z pluginu je pryc. */
.sv-uceni__panel .coral-asistent__rezimy {
  display: none !important;
}
.sv-uceni__panel .sv-panel__hluboko {
  display: inline-flex !important;
}
/* Světlina 35: na telefonu se při rozbaleném diktování Do hloubky na chvíli
   schová, jinak by se Odeslat nevešlo do řádku (jako v bočním panelu). */
@media (max-width: 767px) {
  .sv-uceni__panel .coral-asistent__spodek:has(.coral-dikt.je-rozbaleno) .sv-panel__hluboko {
    display: none !important;
  }
}
/* Karticky primo v ucicim rezimu: kolo zabere misto panelu chatu, chat se
   jen schova a vrati se tlacitkem Zpet do chatu. */
/* Kartičky v učícím režimu rolují pod čarou, ne těsně pod řádkem předmětů (Světlina 25). */
.sv-uceni__karticky {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-top: var(--sv-g);
  border-top: 1px solid var(--sv-linka);
}
.sv-uceni.je-karticky .sv-uceni__panel {
  display: none;
}
.sv-uceni.je-karticky .sv-uceni__napady {
  display: none;
}
.sv-uceni__nabidka {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: var(--sv-r-pole);
  corner-shape: squircle;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  font-weight: 700;
  font-size: var(--sv-pismo);
  animation: sv-vyskok 180ms cubic-bezier(0.22, 1, 0.36, 1);
}
.sv-uceni__nabidka > span {
  flex: 1;
  min-width: 140px;
}
/* Pilulky v ucicim rezimu se natahovaly na vysku radku (flex je ve vychozim
   stavu natahuje), takze z 34 px vyrostly na 62. Ondra 22. 9. 2026:
   „hrozně narostly ty boxíky, toho jazyka, toho předmětu, vysvětli mi to,
   teď tvoříme, vyzkoušej mě, kartičky; hrozně se to zvětšilo." */
.sv-uceni__predmety,
.sv-uceni__napady {
  align-items: center;
}
.sv-uceni__napady .sv-tl,
.sv-uceni__predmety .sv-tl {
  height: auto;
  align-self: center;
}