/* Native browsing cursor; the skeletal hand is reserved for actions. */
html.shares-halloween { cursor: auto; }
html.shares-halloween :is(a[href], button, [role="button"], summary, label[for],
    input[type="button"], input[type="submit"], input[type="reset"],
    input[type="checkbox"], input[type="radio"], input[type="range"],
    .swiper-pagination-bullet, .dropdown-btn),
html.shares-halloween :is(a[href], button, [role="button"], summary, label[for],
    .swiper-pagination-bullet, .dropdown-btn) * {
    cursor: url("../img/halloween/bony-hand.svg?v=1") 10 1, pointer !important;
}
html.shares-halloween input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html.shares-halloween textarea,
html.shares-halloween select,
html.shares-halloween option,
html.shares-halloween [contenteditable="true"],
html.shares-halloween [contenteditable="true"] * {
    cursor: text !important;
}
.shares-halloween-layer {
    position: fixed;
    inset: 0;
    z-index: 1100;
    overflow: hidden;
    pointer-events: none;
}
.shares-halloween-layer * { pointer-events: none !important; }
.shares-halloween-web {
    position: absolute;
    width: min(210px, 28vw);
    color: #4e4942;
    opacity: .76;
    filter: drop-shadow(0 1px 1px #fff9);
}
.shares-halloween-web svg { display: block; width: 100%; height: auto; }
.shares-halloween-web--tl {
    top: 0;
    left: 0;

}
.shares-halloween-web--br {
    bottom: 0;
    right: 0;
    transform: rotate(180deg);
    width: min(200px, 30vw);
    opacity: .61;
}
html[data-theme="dark"] .shares-halloween-web {
    color: #c9c2b5;
    opacity: .76;
    filter: drop-shadow(0 1px 2px #0008);
}
html[data-theme="dark"] .shares-halloween-web--br { opacity: .62; }
.shares-halloween-pumpkin {
    position: absolute;
    left: var(--shares-pumpkin-left, 12px);
    bottom: 8px;
    width: min(88.2px, 18.9vw);
    filter: drop-shadow(0 4px 4px #25120330);
}

.shares-halloween-pumpkin svg { display: block; width: 100%; height: auto; overflow: visible; }
.shares-pumpkin-shadow {
    fill: #231307;
    opacity: .23;
    filter: blur(2px);
    transform-box: fill-box;
    transform-origin: center;
    animation: shares-pumpkin-shadow 4.8s ease-in-out infinite;
}
.shares-pumpkin-bob {
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: shares-pumpkin-float 4.8s ease-in-out infinite;
}
.shares-pumpkin-glow {
    fill: #ff9c24;
    filter: blur(15px);
    opacity: .18;
    animation: shares-pumpkin-flicker 3.7s ease-in-out infinite;
}
.shares-pumpkin-art { animation: shares-candle-light 3.7s ease-in-out infinite; }
html[data-theme="dark"] .shares-pumpkin-glow { fill: #ff8617; }
@keyframes shares-pumpkin-float {
    0%, 100% { transform: translateY(0) rotate(-1deg); }
    50% { transform: translateY(-6px) rotate(1deg); }
}
@keyframes shares-pumpkin-shadow {
    0%, 100% { transform: scaleX(1); opacity: .23; }
    50% { transform: scaleX(.85); opacity: .13; }
}
@keyframes shares-pumpkin-flicker {
    0%, 100% { opacity: .18; }
    18% { opacity: .26; }
    22% { opacity: .12; }
    28% { opacity: .24; }
    64% { opacity: .17; }
    70% { opacity: .24; }
}
@keyframes shares-candle-light {
    0%, 100%, 28%, 70% { filter: brightness(1); }
    18% { filter: brightness(1.05); }
    22% { filter: brightness(.96); }
    64% { filter: brightness(1.02); }
}
/* A brief descent once every 18 seconds; most of the cycle is still. */
.shares-spider-drop { animation: shares-spider-visit 18s ease-in-out infinite; }
.shares-spider-thread {
    transform-origin: 16px 62px;
    animation: shares-spider-silk 18s ease-in-out infinite;
}
@keyframes shares-spider-visit {
    0%, 70%, 100% { transform: translateY(0); }
    81%, 87% { transform: translateY(50px); }
}
@keyframes shares-spider-silk {
    0%, 70%, 100% { transform: scaleY(1); }
    81%, 87% { transform: scaleY(2.1111); }
}
@media (max-width: 768px) {
    .shares-halloween-web--tl { width: 148px; }
    .shares-halloween-web--br { width: 132px; }
    .shares-halloween-pumpkin { width: 61.6px; bottom: 8px; }

}
@media (prefers-reduced-motion: reduce) {
    .shares-halloween-layer * { animation: none !important; }
}
@media print {
    .shares-halloween-layer { display: none !important; }
    html.shares-halloween, html.shares-halloween * { cursor: auto !important; }
}

/* Only the pumpkin is interactive; all flying candy and silk remain click-through. */
.shares-halloween-layer .shares-halloween-pumpkin {
    pointer-events: auto !important;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 24%;
    background: transparent;
    appearance: none;
    line-height: 0;
}
.shares-halloween-pumpkin:focus-visible { outline: 2px solid #eaa748; outline-offset: 3px; }
.shares-candy {
    position: absolute;
    width: 19px;
    height: 12px;
    border: 1px solid #fff9;
    border-radius: 4px;
    background: repeating-linear-gradient(115deg, transparent 0 5px, #fff9 5px 8px), var(--candy-color);
    box-shadow: 0 2px 3px #0003;
    will-change: transform, opacity;
}
.shares-candy::before, .shares-candy::after {
    content: '';
    position: absolute;
    top: 1px;
    width: 7px;
    height: 9px;
    background: var(--candy-color);
    clip-path: polygon(0 0, 100% 35%, 100% 65%, 0 100%);
    left: -7px;
}
.shares-candy::after { left: auto; right: -7px; transform: rotate(180deg); }
.shares-candy--round { width: 15px; height: 15px; border-radius: 50%; }

.shares-pumpkin-squash { transform-origin: 70px 145px; }
.shares-pumpkin-mouth { transform-origin: 70px 111px; }
.shares-pumpkin-face { animation: shares-candle-light 3.7s ease-in-out infinite; }
.is-spewing .shares-pumpkin-squash { animation: shares-pumpkin-spew .9s ease-in-out both; }
.is-spewing .shares-pumpkin-mouth { animation: shares-mouth-open .9s ease-in-out both; }
.is-spewing .shares-pumpkin-mouth-light { animation: shares-mouth-light .9s ease-in-out both; }
@keyframes shares-pumpkin-spew {
    0%, 100% { transform: scale(1); }
    12% { transform: scale(1.08, .92); }
    32% { transform: scale(.96, 1.04); }
    70% { transform: scale(1.03, .98); }
}
@keyframes shares-mouth-open {
    0%, 100% { transform: scale(1); }
    22%, 68% { transform: translateY(-5px) scale(1.08, 1.65); }
}
@keyframes shares-mouth-light {
    0%, 100% { opacity: 0; }
    22%, 68% { opacity: .25; }
}
@media (prefers-reduced-motion: reduce) {
    .is-spewing .shares-pumpkin-mouth { transform: translateY(-3px) scale(1.05, 1.3); }
    .is-spewing .shares-pumpkin-mouth-light { opacity: .2; }
}

/* Keep the WhatsApp link above every seasonal hit area, including during a burst. */
html.shares-halloween #okapi-wasb-button { z-index: 1101 !important; }
.shares-halloween-layer .shares-halloween-pumpkin {
    top: auto;
    right: auto;
    min-width: 0;
    min-height: 0;
    height: auto;
    max-width: none;
    box-sizing: border-box;
    transform: none;
}

html.shares-halloween :is(button:disabled, input:disabled, [aria-disabled="true"]),
html.shares-halloween :is(button:disabled, [aria-disabled="true"]) * { cursor: not-allowed !important; }