
#accessibility-btn{
    position:fixed;
    left:20px;
    bottom:20px;
    border:none;
    cursor:pointer;
    z-index:9999;
    color: #000;
    font-size: 30px;
}

#accessibility-panel{
    position:fixed;
    left:20px;
    bottom:80px;
    width:250px;
    background:#fff;
    border:1px solid #ddd;
    padding:15px;
    display:none;
    z-index:9999;
}

#accessibility-panel button{
    width:100%;
    margin:6px 0;
    padding:10px;
    cursor:pointer;
    font-size: 12px;
    color: #000;
    line-height: 14px;
}

.dark-mode{
    background:#222;
    color:white;
}

.high-contrast{
    background:black;
    color:yellow;
}

.high-contrast a{
    color:#00ffff;
}

.invert-mode{
    filter:invert(1) hue-rotate(180deg);
}

.invert-mode img,
.invert-mode video,
.invert-mode iframe{
    filter:invert(1) hue-rotate(180deg);
}

.grayscale{
    filter: grayscale(100%);
}

#readingMask{
    position: fixed;
    left: 0;
    right: 0;
    height: 48px;
    background: rgba(255, 252, 180, 0.25);
    border-top: 2px solid rgba(220, 180, 0, 0.75);
    border-bottom: 2px solid rgba(220, 180, 0, 0.75);
    pointer-events: none;
    z-index: 8999;
    display: none;
    top: 0;
}

.lexend{
    font-family:'Lexend',sans-serif;
}


.bigCursor,
.bigCursor *{
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M6 4 L6 38 L16 28 L21 42 L26 40 L21 26 L34 26 Z' fill='%23000' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") 0 0, auto !important;
}



.focus-outline *:focus{
    outline:4px solid red !important;
}