/* ============================================================
   Sezónní výzdoba – společný základ (inc/vyzdoba.php, CSS/LAYOUT.md)

   Načítá se jen se zapnutou výzdobou, před CSS sezóny. PHP vypíše
   <div class="vz vz-<sezona> vz-<vrstva> vz-f1 … vz-fN"> s prázdnými
   <i class="vz-<prvek>">. Prvky jsou skryté; CSS sezóny je ukazuje
   podle fáze (třídy fází se sčítají: vz-f3 = je aspoň fáze 3).
   ============================================================ */

.vz i {
    display: none;
    position: absolute;
    background: no-repeat center / contain;
}

/* --- Cedulky s ozdobou na horní hraně -----------------------
   Hogwarts::cedulkaUrl() s Vyzdoba::CEDULKY_NAD vrátí obrázek
   o 8 px vyšší (přípona -n8). Atributy width/height drží 162 × 25,
   tady se výška dopočítá z poměru a obrázek se vytáhne nahoru,
   takže řádek tabulky zůstane stejně vysoký a dýně sedí na hraně
   nad ním. position: relative = kreslí se přes blok nad cedulkou. */

img[src*="/nadpisy/ced-"][src$="-n8.png"] {
    height: auto;
    margin-top: -8px;
    position: relative;
}

/* --- Profil postavy -----------------------------------------
   Vrstva .vz-profil leží ve vizitce (.pf-vizitka, user_menu.php),
   polohy od jejích okrajů. */

.pf-vizitka:has(> .vz-profil) {
    position: relative;
}
.vz-profil {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

/* --- Hlavička ------------------------------------------------
   .vz-kotva obaluje obrázek hlavičky (760 × 95), polohy prvků
   jsou v % jeho rozměrů, takže sedí i na mobilu, kde se hlavička
   zmenší na šířku sloupce. */

.vz-kotva {
    position: relative;
    width: 760px;
    max-width: 100%;
    margin: 0 auto;
}

.vz-kotva img {
    display: block;   /* bez mezery pod řádkem, ať výška kotvy = výška obrázku */
}

.vz-hlavicka {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

/* Patky sloupců: sezóna si na ně sahá pseudoelementem přes
   .hrad:has(.vz-<sezona>.vz-fN). Jsou prázdné, takže jim
   position: relative nic nepřepíše. Každá patka má jen jeden
   ::before – dvě sezóny současně nikdy neběží. */
.hrad:has(.vz-hlavicka) :is(.section_levy_end, .section_pravy_end, .section_central_end) {
    position: relative;
}

/* --- Zeď kolem hradu -----------------------------------------
   Vrstva leží mimo .hrad (zoom na ni nepůsobí), pod hradem
   a nad texturou zdi: z-index -1 v kořenovém kontextu. Prvky se
   drží okraje hradu: ten je 381 px × zvětšení od středu okna. */

.vz-pozadi {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;

    /* rozměry prvků rostou se zvětšením hradu, ať k němu velikostí sedí */
    --vz-z: var(--hg-zoom, 1);
    --vz-okraj: calc(381px * var(--vz-z) + 14px);
}

/* Kolem hradu je místo až od 1280 px (okraj ≥ 145 px při
   automatickém zvětšení 1,30). */
@media (max-width: 1279px) {
    .vz-pozadi i { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .vz i { animation: none !important; }
}