.mangarama-corner-spider{
    position:fixed!important;
    top:var(--mcs-top)!important;
    left:var(--mcs-left)!important;
    z-index:var(--mcs-z)!important;
    display:block;
    width:var(--mcs-w);
    max-width:90vw;
    height:auto;
    line-height:0;
    opacity:var(--mcs-opacity);
    pointer-events:none;
    -webkit-tap-highlight-color:transparent;
}

.mangarama-corner-spider__image{
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
    pointer-events:none;
    user-select:none;
    -webkit-user-drag:none;
}

/*
 * Натискається не весь прямокутник PNG, а тільки окрема зона над павучком.
 * Тому прозорий простір та павутина за межами цієї зони не блокують сайт.
 */
.mangarama-corner-spider__hitbox{
    position:absolute;
    left:var(--mcs-hit-x);
    top:var(--mcs-hit-y);
    width:var(--mcs-hit-w);
    height:var(--mcs-hit-h);
    z-index:2;
    display:block;
    border-radius:30%;
    background:transparent!important;
    text-decoration:none!important;
    pointer-events:auto;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
}

.mangarama-corner-spider__hitbox:focus-visible{
    outline:2px solid currentColor;
    outline-offset:2px;
}

@media (min-width:783px){
    .mangarama-corner-spider--hide-desktop{
        display:none!important;
    }
}

@media (max-width:782px){
    .mangarama-corner-spider{
        position:fixed!important;
        top:var(--mcs-mtop)!important;
        left:var(--mcs-mleft)!important;
        width:var(--mcs-mw);
        max-width:96vw;
    }

    .mangarama-corner-spider--hide-mobile{
        display:none!important;
    }
}
