/* =====================================================================
   themes/halloween.css  ·  sezónní vrstva (říjen 2026)

   Zapíná ji includes/components/seasonal-theme.php (20. 10. – 1. 11.),
   načítá se úplně poslední, ZA quiet.css. Vše je pod body.theme-halloween,
   bez té třídy soubor nedělá nic.

   Barevné role po dobu Halloweenu:
     dýňová #ff7a1a  = akce a akcenty (místo fialové a cyanu)
     noční fialová   = pozadí a mlha (značka zůstává poznat)
     jedový zelený   = jen drobnosti (oči pavouka, pár odlesků)
     Tokyo magenta   = beze změny, je to značka partnera

   Dekorace (měsíc, mlha, pavučiny, pavouk, netopýři) leží v .hw-layer,
   jsou aria-hidden a pointer-events: none. Na obsah se nesahá.
   ===================================================================== */

body.theme-halloween {
    --hw-pumpkin: #ff7a1a;
    --hw-pumpkin-h: #ff9238;
    --hw-pumpkin-deep: #d9540a;
    --hw-ember: #ffa552;            /* akcentní text, AA na tmavé */
    --hw-slime: #a3ff3c;
    --hw-night: #120a1f;
    --hw-moon: #f4ecd9;

    /* tokeny zklidňující vrstvy */
    --q-action: #e8600c;
    --q-action-h: #ff7a1a;
    --q-data: #ffa552;

    /* starší tokeny, které komponenty ještě používají */
    --neon-cyan: #ff8a2b;
    --neon-cyan-rgb: 255, 138, 43;
    --color-primary: #ff8a2b;
    --color-primary-rgb: 255, 138, 43;
    --primary: #ff8a2b;
    --respinners-secondary: #ff8a2b;
    --respinners-gradient: #e8600c;
    --gradient-respinners: #e8600c;

    /* WebGL pozadí (shader-bg.js čte proměnné z <body>, musí být hex) */
    --sbg-base: #07050b;
    --sbg-c1: #2a1408;   /* doutnající oranžová od horizontu */
    --sbg-c2: #1a0f30;   /* noční fialová */
    --sbg-c3: #0e2112;   /* nazelenalý přísvit z hřbitova */
    --sbg-symbols: 0.55;
}

body.theme-halloween ::selection { background: rgba(255, 122, 26, 0.45); color: #fff; }

/* ---------------------------------------------------------------------
   1. Akcenty: menu, nadpisy, tlačítka
   --------------------------------------------------------------------- */
body.theme-halloween .nav-link.active .nav-ico,
body.theme-halloween .nav-big.active .nav-ico,
body.theme-halloween .nav-menu > li > .nav-link[aria-current] .nav-ico,
body.theme-halloween .nav-menu > li > .nav-link.active .nav-ico,
body.theme-halloween .nav-coins-pill .nav-coins-icon,
body.theme-halloween .mega-link:hover .mega-link-ico { color: var(--hw-pumpkin) !important; }

body.theme-halloween .nav-underline {
    background: var(--hw-pumpkin) !important;
    box-shadow: 0 0 12px rgba(255, 122, 26, 0.55) !important;
}

body.theme-halloween .navbar .nav-menu > li > .nav-link.active:not(.nav-link-tokyo) {
    border-color: rgba(255, 122, 26, 0.6) !important;
    background: rgba(255, 122, 26, 0.08) !important;
}

body.theme-halloween .nav-watch-cta {
    background: rgba(255, 122, 26, 0.10) !important;
    border-color: rgba(255, 122, 26, 0.45) !important;
}
body.theme-halloween .nav-watch-cta:hover {
    background: rgba(255, 122, 26, 0.2) !important;
    border-color: rgba(255, 165, 82, 0.7) !important;
}

/* Vedlejší akce mimo Tokyo (fialové „ghost“ boxy v mega menu) */
body.theme-halloween .mega-panel .mega-casino-cta:not([data-track-casino^="Tokyo"]) {
    background: rgba(255, 122, 26, 0.14) !important;
    border-color: rgba(255, 122, 26, 0.4) !important;
}
body.theme-halloween .mega-panel .mega-casino-cta:not([data-track-casino^="Tokyo"]):hover {
    background: rgba(255, 122, 26, 0.28) !important;
}

/* Akcentní slovo v H1 (dřív cyan) dostane jemné doutnání.
   Stránky značek (/tokyo, /dedek) mají vlastní barvu a zůstávají. */
body.theme-halloween h1:not(.tk-page *, .cp-dedek *) :is(.text-gradient, .cp-grad, .hl, em, span[class*="accent"]) {
    color: var(--hw-ember) !important;
    -webkit-text-fill-color: var(--hw-ember) !important;
    background: none !important;
    text-shadow: 0 0 18px rgba(255, 122, 26, 0.45);
}

/* Karty: místo neutrálního zvednutí oranžový žár zespodu */
body.theme-halloween .bonus-card-h:hover,
body.theme-halloween .gw-card:hover,
body.theme-halloween .idx-hub-section a:hover {
    box-shadow: 0 14px 34px -14px rgba(255, 122, 26, 0.45), 0 0 0 1px rgba(255, 122, 26, 0.28) !important;
}

/* Patička: hřbitov sedí těsně nad ní, oddělovací linka by ho přeťala */
body.theme-halloween .footer::before { display: none; }

/* Logo: malá svítící dýně v rohu loga */
body.theme-halloween .nav-logo::after {
    content: '';
    position: absolute;
    left: 22px;
    top: 50%;
    margin-top: 2px;
    width: 20px;
    height: 18px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 36'%3E%3Cpath d='M20 4c1-3 3-4 5-4' stroke='%2346802f' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Cellipse cx='11' cy='21' rx='11' ry='14' fill='%23d9540a'/%3E%3Cellipse cx='29' cy='21' rx='11' ry='14' fill='%23d9540a'/%3E%3Cellipse cx='20' cy='21' rx='11' ry='15' fill='%23ff7a1a'/%3E%3Cpath d='M12 17l4-5 3 5zM21 17l3-5 4 5zM10 25q10 8 20 0l-3 1-2-2-3 2-3-2-2 2-3-1z' fill='%23ffe08a'/%3E%3C/svg%3E") center / contain no-repeat;
    filter: drop-shadow(0 0 6px rgba(255, 122, 26, 0.7));
    transform: rotate(-14deg);
    pointer-events: none;
    animation: hw-flicker 3.2s steps(1) infinite;
}

/* Tokyo banner má vlastní cyan token (odkaz „Více o casinu“, „zapoj se“) */
body.theme-halloween .tkb { --tkb-cyan: #ffa552; --tkb-cyan-rgb: 255, 165, 82; }

/* Vlastní posuvník */
html:has(body.theme-halloween) { scrollbar-color: #8a3b0c #0b0710; }

/* ---------------------------------------------------------------------
   2. Dekorační vrstva
   --------------------------------------------------------------------- */
.hw-layer {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;            /* nad shaderem (-2), pod obsahem (.main-content je 1) */
    overflow: hidden;
}
.hw-top {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1001;         /* nad lištou menu (--z-navbar 1000), pod modaly */
    overflow: hidden;
}

/* Scéna v horní části stránky, NAD obsahem. Je absolutní (ne fixní),
   takže při scrollu odjede s úvodem a nepřekáží při čtení. */
.hw-scene {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 100vh;
    pointer-events: none;
    z-index: 3;            /* nad obsahem (.main-content 1), pod lištou menu */
    overflow: hidden;
}
/* Světlo (měsíc) se s obsahem prolíná režimem screen: jen zesvětluje,
   takže text ani tlačítka pod ním nikdy nezmizí */
.hw-scene-light {
    position: absolute;
    inset: 0;
    mix-blend-mode: screen;
}

/* Měsíc vpravo nahoře (ve scéně nad obsahem, prolnutý) */
.hw-moon {
    position: absolute;
    top: clamp(130px, 17vh, 200px);
    right: clamp(-70px, -3vw, -30px);   /* napůl za okrajem, ať neleží pod textem */
    width: clamp(120px, 13vw, 210px);
    aspect-ratio: 1;
    border-radius: 50%;
    background:
        radial-gradient(circle at 34% 30%, rgba(0, 0, 0, 0.10) 0 9%, transparent 10%),
        radial-gradient(circle at 62% 58%, rgba(0, 0, 0, 0.08) 0 13%, transparent 14%),
        radial-gradient(circle at 46% 74%, rgba(0, 0, 0, 0.07) 0 6%, transparent 7%),
        radial-gradient(circle at 40% 38%, #fffaf0 0%, var(--hw-moon) 55%, #d9cfb8 100%);
    box-shadow:
        0 0 40px 6px rgba(255, 236, 200, 0.18),
        0 0 140px 40px rgba(255, 140, 60, 0.10);
    opacity: 0.6;
}

/* Oranžový přísvit od obzoru, jako by za kopcem hořely dýně */
.hw-layer::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 45vh;
    background:
        radial-gradient(ellipse 60% 70% at 50% 110%, rgba(255, 106, 20, 0.16), transparent 70%),
        radial-gradient(ellipse 35% 50% at 12% 105%, rgba(160, 255, 60, 0.05), transparent 70%);
}

/* Mlha u spodního okraje, dvě vrstvy driftují proti sobě */
.hw-fog {
    position: absolute;
    left: -50%;
    width: 200%;
    bottom: -6vh;
    height: 38vh;
    background:
        radial-gradient(ellipse 18% 55% at 10% 70%, rgba(200, 180, 240, 0.16), transparent 70%),
        radial-gradient(ellipse 22% 60% at 32% 80%, rgba(180, 165, 225, 0.13), transparent 70%),
        radial-gradient(ellipse 16% 50% at 55% 75%, rgba(205, 185, 245, 0.14), transparent 70%),
        radial-gradient(ellipse 24% 62% at 78% 82%, rgba(180, 160, 230, 0.13), transparent 70%),
        radial-gradient(ellipse 20% 55% at 95% 72%, rgba(200, 180, 240, 0.14), transparent 70%);
    filter: blur(6px);
    animation: hw-drift 70s linear infinite;
}
.hw-fog--b {
    bottom: -12vh;
    opacity: 0.8;
    animation-duration: 95s;
    animation-direction: reverse;
}

/* Pavučiny v horních rozích */
.hw-web {
    position: absolute;
    top: 0;
    width: clamp(90px, 9vw, 150px);
    aspect-ratio: 1;
    color: rgba(235, 230, 248, 0.22);
}
.hw-web--l { width: clamp(70px, 6vw, 104px); }   /* vlevo je logo, menší */
.hw-web svg { width: 100%; height: 100%; display: block; }
.hw-web path { fill: none; stroke: currentColor; stroke-width: 1.1; }
.hw-web--l { left: 0; }
.hw-web--r { right: 0; transform: scaleX(-1); }

/* Pavouk na vlákně, pomalu se spouští a vytahuje */
.hw-spider {
    position: absolute;
    top: 0;
    right: clamp(18px, 2.2vw, 40px);   /* visí z pavučiny v pravém rohu */
    width: 34px;
    color: #17121f;
    animation: hw-dangle 9s ease-in-out infinite;
    transform-origin: 50% 0;
}
.hw-spider-thread {
    display: block;
    width: 1px;
    height: var(--hw-thread, 210px);
    margin: 0 auto;
    background: linear-gradient(rgba(230, 225, 245, 0.05), rgba(230, 225, 245, 0.35));
}
.hw-spider-body {
    display: block;
    width: 34px;
    height: 31px;
    margin-top: -2px;
    filter: drop-shadow(0 0 1px rgba(240, 230, 255, 0.7)) drop-shadow(0 0 8px rgba(255, 122, 26, 0.35));
    animation: hw-wiggle 2.6s ease-in-out infinite;
}
.hw-spider .hw-eye { fill: var(--hw-slime); filter: drop-shadow(0 0 2px var(--hw-slime)); }

/* Létající netopýři vypnuti (28. 10. 2026, majitel: „dej pryč“).
   Platí pro přelety přes obrazovku i hejno z měsíce; pravidla níž zůstávají,
   kdyby se měli vrátit, stačí smazat tenhle řádek. */
.hw-bats, .hw-swarm { display: none !important; }

/* Netopýři: let přes obrazovku + mávání */
.hw-bat {
    position: absolute;
    left: 0;
    top: 0;
    width: 52px;
    color: #140b1d;
    opacity: 0;
    filter: drop-shadow(0 0 1px rgba(255, 170, 100, 0.9)) drop-shadow(0 0 6px rgba(255, 110, 30, 0.25));
    animation: hw-fly-a 22s linear infinite;
    will-change: transform, opacity;
}
.hw-bat svg {
    display: block;
    width: 100%;
    fill: currentColor;
    animation: hw-flap 0.32s ease-in-out infinite alternate;
    transform-origin: 50% 40%;
}
.hw-bat--1 { animation-delay: 0s; }
.hw-bat--2 { width: 38px; animation: hw-fly-b 27s linear infinite; animation-delay: -9s; }
.hw-bat--3 { width: 28px; animation: hw-fly-a 31s linear infinite; animation-delay: -17s; top: 22vh; }
.hw-bat--4 { width: 44px; animation: hw-fly-c 25s linear infinite; animation-delay: -4s; }
.hw-bat--5 { width: 24px; animation: hw-fly-b 36s linear infinite; animation-delay: -24s; top: 30vh; }
.hw-bat--2 svg { animation-duration: 0.26s; }
.hw-bat--4 svg { animation-duration: 0.36s; }

/* ---------------------------------------------------------------------
   3. Animace
   --------------------------------------------------------------------- */
@keyframes hw-drift { to { transform: translateX(25%); } }

@keyframes hw-flap {
    from { transform: scaleY(1); }
    to   { transform: scaleY(0.35) translateY(3px); }
}

/* Každý let trvá jen část cyklu, zbytek času je netopýr mimo obraz */
@keyframes hw-fly-a {
    0%   { transform: translate(-60px, 26vh) rotate(4deg); opacity: 0; }
    3%   { opacity: 0.9; }
    20%  { transform: translate(35vw, 14vh) rotate(-6deg); }
    38%  { transform: translate(70vw, 22vh) rotate(5deg); opacity: 0.9; }
    46%  { transform: translate(104vw, 8vh) rotate(-8deg); opacity: 0; }
    100% { transform: translate(104vw, 8vh); opacity: 0; }
}
@keyframes hw-fly-b {
    0%   { transform: translate(104vw, 40vh) scaleX(-1); opacity: 0; }
    4%   { opacity: 0.85; }
    22%  { transform: translate(64vw, 30vh) scaleX(-1) rotate(6deg); }
    40%  { transform: translate(26vw, 44vh) scaleX(-1) rotate(-5deg); opacity: 0.85; }
    50%  { transform: translate(-60px, 24vh) scaleX(-1); opacity: 0; }
    100% { transform: translate(-60px, 24vh) scaleX(-1); opacity: 0; }
}
@keyframes hw-fly-c {
    0%   { transform: translate(78vw, 105vh) scale(0.6); opacity: 0; }
    5%   { opacity: 0.85; }
    30%  { transform: translate(84vw, 40vh) scale(1) rotate(-10deg); }
    45%  { transform: translate(66vw, 6vh) scale(0.8) rotate(8deg); opacity: 0.8; }
    55%  { transform: translate(50vw, -60px) scale(0.6); opacity: 0; }
    100% { transform: translate(50vw, -60px); opacity: 0; }
}

@keyframes hw-dangle {
    0%, 100% { transform: translateY(-40px) rotate(0deg); }
    45%      { transform: translateY(60px) rotate(3deg); }
    60%      { transform: translateY(44px) rotate(-2deg); }
}
@keyframes hw-wiggle {
    0%, 100% { transform: rotate(0deg); }
    50%      { transform: rotate(6deg); }
}
@keyframes hw-flicker {
    0%, 100% { opacity: 1; }
    47%      { opacity: 0.55; }
    49%      { opacity: 1; }
    83%      { opacity: 0.75; }
}

/* ---------------------------------------------------------------------
   3b. Ilustrace a kostýmy
   --------------------------------------------------------------------- */

/* Čarodějnický klobouk na ikoně loga (dýně z ::after zůstává) */
body.theme-halloween .nav-logo::before {
    content: '';
    position: absolute;
    left: 2px;
    top: 50%;
    margin-top: -34px;
    width: 30px;
    height: 24px;
    z-index: 2;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 52'%3E%3Cpath d='M6 44Q32 34 58 44Q32 52 6 44Z' fill='%231b1026'/%3E%3Cpath d='M18 42Q22 22 30 12Q36 2 48 0Q40 8 40 16Q42 30 46 42Q32 38 18 42Z' fill='%23241433'/%3E%3Cpath d='M19 38Q32 34 45 38L46 42Q32 38 18 42Z' fill='%23ff7a1a'/%3E%3C/svg%3E") center / contain no-repeat;
    filter: drop-shadow(0 0 1px rgba(255, 190, 120, 0.8));
    transform: rotate(-16deg);
    pointer-events: none;
}

/* Kostýmy na avatarech (pozici dopočítává halloween.js) */
.hw-costume {
    position: absolute;
    z-index: 2;                 /* nad obsahem (1), pod lištou menu (1000) */
    pointer-events: none;
    line-height: 0;
    transform-origin: 50% 100%;
}
.hw-costume svg { width: 100%; height: auto; display: block; overflow: visible; }
.hw-costume--hat { transform: rotate(-14deg); filter: drop-shadow(0 0 1px rgba(255, 190, 120, 0.7)) drop-shadow(0 2px 3px rgba(0, 0, 0, 0.6)); }
.hw-costume--horns { filter: drop-shadow(0 0 3px rgba(255, 40, 40, 0.55)); animation: hw-horns 3s ease-in-out infinite; }
@keyframes hw-horns { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1px) scale(1.04); } }

/* Girlanda s praporky a dýněmi pod lištou menu */
.hw-garland {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(var(--hw-nav-h, 116px) - 6px);
    height: 50px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 50'%3E%3Cpath d='M0 6Q120 40 240 6' stroke='%23584a6a' stroke-width='1.4' fill='none'/%3E%3Cpath d='M37 14H59L48 37Z' fill='%23ff7a1a'/%3E%3Cpath d='M85 18H107L96 41Z' fill='%236d2fd6'/%3E%3Cpath d='M133 18H155L144 41Z' fill='%23ff7a1a'/%3E%3Cpath d='M181 14H203L192 37Z' fill='%231e1429'/%3E%3Cpath d='M120 22v4' stroke='%23584a6a'/%3E%3Cpath d='M120 26c1-3 2-4 4-4' stroke='%2346802f' stroke-width='2' fill='none'/%3E%3Cellipse cx='115' cy='33' rx='6' ry='7' fill='%23c2490a'/%3E%3Cellipse cx='125' cy='33' rx='6' ry='7' fill='%23c2490a'/%3E%3Cellipse cx='120' cy='33' rx='6' ry='7.5' fill='%23ff7a1a'/%3E%3Cpath d='M116 31l2-3 2 3zM120 31l2-3 2 3zM116 35q4 3 8 0' fill='%23ffd37a' stroke='%23ffd37a' stroke-width='.6'/%3E%3C/svg%3E") repeat-x 0 0 / 240px 50px;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.5));
    transform-origin: 50% 0;
    animation: hw-sway 6s ease-in-out infinite;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.hw-garland { transition: opacity 0.35s ease, translate 0.35s ease; }
.hw-scrolled .hw-garland { opacity: 0; translate: 0 -24px; }

/* Na širokých obrazovkách je vlevo panel bonusů, girlanda začne až za ním */
@media (min-width: 1400px) {
    body:has(> .bonus-rail) .hw-garland { left: calc(var(--rail-w, 276px) + 24px); }
}
@keyframes hw-sway { 0%, 100% { transform: rotate(0.25deg) translateY(0); } 50% { transform: rotate(-0.25deg) translateY(2px); } }

/* Hřbitov pevně u spodního okraje obrazovky, v POZADÍ (pod obsahem,
   majitel 28. 10.: „dej ho jen do pozadí“). Výška se odvozuje od šířky
   (poměr kresby), aby se na širokých monitorech neusekla střecha domu. */
.hw-grave {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;                 /* nad shaderem (-2), pod obsahem (.main-content 1) */
    aspect-ratio: 1600 / 220;
    min-height: 92px;           /* na mobilu se kresba ořízne do stran */
    pointer-events: none;
    overflow: hidden;
}
/* Vypnuto 28. 10. 2026 (majitel: „spodní pás dej pryč“). Vrácení = smazat řádek. */
.hw-grave { display: none !important; }
.hw-grave-svg { width: 100%; height: 100%; display: block; }
.hw-hill-far { fill: #140c21; opacity: 0.7; }
.hw-hill, .hw-stones, .hw-house > rect, .hw-house > path { fill: #0a0611; }
.hw-tree { stroke: #0a0611; }
.hw-grave-svg { filter: drop-shadow(0 -1px 0 rgba(255, 140, 60, 0.28)) drop-shadow(0 -10px 22px rgba(255, 110, 30, 0.08)); }
.hw-rip { stroke: rgba(255, 210, 160, 0.25); stroke-width: 1.4; fill: none; }
.hw-win { fill: #ffb04a; filter: drop-shadow(0 0 5px rgba(255, 150, 50, 0.9)); animation: hw-window 5s steps(1) infinite; }
.hw-win--b { animation-duration: 7.5s; animation-delay: -2s; }
@keyframes hw-window { 0%, 100% { opacity: 1; } 31% { opacity: 0.35; } 33% { opacity: 1; } 71% { opacity: 0.15; } 76% { opacity: 1; } }
.hw-gp .hw-face { filter: drop-shadow(0 0 3px #ffb04a); animation: hw-candle 2.2s ease-in-out infinite; }
@keyframes hw-candle { 0%, 100% { opacity: 1; } 40% { opacity: 0.7; } 60% { opacity: 0.95; } 80% { opacity: 0.6; } }

/* Čarodějnice přelétá přes měsíc */
.hw-witch {
    position: absolute;
    left: 0;
    top: 0;
    width: clamp(90px, 9vw, 140px);
    opacity: 0;
    animation: hw-witch 34s linear infinite;
    animation-delay: 3s;
}
.hw-witch svg { width: 100%; display: block; fill: #0c0714; stroke: #0c0714; filter: drop-shadow(0 0 1px rgba(255, 210, 160, 0.55)); }
.hw-witch .hw-cape { animation: hw-cape 0.5s ease-in-out infinite alternate; transform-origin: 62px 30px; }
@keyframes hw-cape { to { transform: skewY(8deg) scaleX(1.08); } }
@keyframes hw-witch {
    0%   { transform: translate(104vw, 34vh) rotate(-4deg); opacity: 0; }
    2%   { opacity: 1; }
    10%  { transform: translate(86vw, 22vh) rotate(-8deg); }
    18%  { transform: translate(66vw, 15vh) rotate(-3deg); }
    28%  { transform: translate(36vw, 18vh) rotate(4deg); }
    38%  { transform: translate(4vw, 9vh) rotate(-6deg); opacity: 1; }
    42%  { transform: translate(-20vw, 6vh); opacity: 0; }
    100% { transform: translate(-20vw, 6vh); opacity: 0; }
}

/* Hejno netopýrů vyletí z měsíce (jednou, třídu přidá halloween.js) */
.hw-swarm { position: absolute; right: clamp(-10px, 1vw, 40px); top: clamp(190px, 24vh, 270px); width: 0; height: 0; }
.hw-sbat {
    position: absolute;
    width: calc(16px + var(--i) * 2px);
    color: #120a1a;
    opacity: 0;
    filter: drop-shadow(0 0 1px rgba(255, 180, 110, 0.9));
}
.hw-sbat svg { width: 100%; display: block; fill: currentColor; animation: hw-flap 0.22s ease-in-out infinite alternate; }
.hw-swarm-go .hw-sbat { animation: hw-burst 3.4s cubic-bezier(.2, .6, .3, 1) forwards; animation-delay: calc(var(--i) * 70ms); }
.hw-sbat:nth-child(1) { --dx: -38vw; --dy: -10vh; }
.hw-sbat:nth-child(2) { --dx: -52vw; --dy: 6vh; }
.hw-sbat:nth-child(3) { --dx: -24vw; --dy: -22vh; }
.hw-sbat:nth-child(4) { --dx: -64vw; --dy: -16vh; }
.hw-sbat:nth-child(5) { --dx: -30vw; --dy: 14vh; }
.hw-sbat:nth-child(6) { --dx: -46vw; --dy: -26vh; }
.hw-sbat:nth-child(7) { --dx: -72vw; --dy: 2vh; }
.hw-sbat:nth-child(8) { --dx: -18vw; --dy: -4vh; }
.hw-sbat:nth-child(9) { --dx: -58vw; --dy: 18vh; }
@keyframes hw-burst {
    0%   { transform: translate(0, 0) scale(0.3); opacity: 0; }
    10%  { opacity: 1; }
    55%  { opacity: 1; }
    100% { transform: translate(var(--dx), var(--dy)) scale(1.1) rotate(-8deg); opacity: 0; }
}

/* Duchové */
.hw-ghost { width: 60px; }
.hw-ghost svg { width: 100%; display: block; overflow: visible; }
.hw-ghost-body, .hw-ghost-arm { fill: #f3effc; }
.hw-ghost-ink { fill: #1d1229; }
.hw-ghost-blush { fill: #ff8fb1; opacity: 0.55; }
.hw-ghost svg { filter: drop-shadow(0 0 10px rgba(220, 210, 255, 0.45)); }
.hw-ghost-arm--l { transform-origin: 14px 30px; animation: hw-wave 1.4s ease-in-out infinite; }
.hw-ghost-arm--r { transform-origin: 56px 30px; animation: hw-wave 1.4s ease-in-out infinite reverse; }
@keyframes hw-wave { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-22deg); } }

/* Duch na hřbitově: vznáší se nad hroby */
.hw-ghost--grave {
    position: absolute;
    left: 27%;
    bottom: 38%;
    width: clamp(40px, 3.6vw, 58px);
    opacity: 0.9;
    animation: hw-float 6s ease-in-out infinite;
}
@keyframes hw-float {
    0%, 100% { transform: translate(0, 0) rotate(-4deg); }
    50%      { transform: translate(18px, -26px) rotate(5deg); }
}

/* Duch vykukující zpoza spodní lišty (z-index těsně pod ní) */
.hw-peek {
    position: fixed;
    right: clamp(80px, 12vw, 220px);
    bottom: 0;
    z-index: 94;
    pointer-events: none;
    width: 64px;
    height: 120px;
    overflow: hidden;
}
.has-rtb .hw-peek { bottom: 74px; }
.hw-peek .hw-ghost {
    position: absolute;
    left: 2px;
    bottom: 0;
    width: 60px;
    transform: translateY(100%);
    animation: hw-peek 14s ease-in-out infinite;
    animation-delay: 4s;
}
@keyframes hw-peek {
    0%, 62%, 100% { transform: translateY(105%) rotate(0deg); }
    70%           { transform: translateY(18%) rotate(-6deg); }
    78%           { transform: translateY(22%) rotate(6deg); }
    86%           { transform: translateY(16%) rotate(-3deg); }
    94%           { transform: translateY(105%) rotate(0deg); }
}


/* ---------------------------------------------------------------------
   4. Mobil a omezený pohyb
   --------------------------------------------------------------------- */
@media (max-width: 760px) {
    .hw-moon { top: 92px; right: 18px; width: 70px; opacity: 0.4; }
    .hw-web { width: 86px; }
    .hw-spider { right: 14px; --hw-thread: 90px; }
    .hw-spider-body { width: 24px; height: 22px; }
    .hw-bat--3, .hw-bat--5 { display: none; }
    .hw-fog { height: 26vh; }
    .hw-witch { width: 74px; }
    .hw-grave { min-height: 92px; }
    .hw-ghost--grave { left: 40%; bottom: 34%; width: 34px; }
    .hw-peek { right: 22px; width: 50px; }
    .hw-peek .hw-ghost { width: 46px; }
    .hw-garland { height: 38px; background-size: 190px 40px; }
    .hw-swarm { top: 150px; }
}

@media (prefers-reduced-motion: reduce) {
    .hw-bat, .hw-fog, .hw-spider, .hw-spider-body,
    body.theme-halloween .nav-logo::after { animation: none !important; }
    .hw-bats, .hw-swarm, .hw-witch, .hw-peek { display: none; }
    .hw-garland, .hw-ghost--grave, .hw-ghost-arm, .hw-win, .hw-gp .hw-face, .hw-costume { animation: none !important; }
}