.userBanner {
    --banner-pad-y: 0.22rem;
    --banner-pad-x: 0.8rem;
    --banner-radius: 999px;
    --banner-font-w: 700;
    --banner-fs: 12px;
    --banner-ls: 0.04em;
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
    padding: var(--banner-pad-y) var(--banner-pad-x);
    border-radius: var(--banner-radius);
    font-weight: var(--banner-font-w);
    font-size: var(--banner-fs);
    line-height: 1.2;
    letter-spacing: var(--banner-ls);
    text-transform: uppercase;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    border: 1px solid transparent;
    background: linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.05)) border-box,linear-gradient(180deg, var(--banner-bg-start, #0b0c0f), var(--banner-bg-end, #121317)) padding-box;
    color: var(--banner-text, #f8fafc);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06),0 10px 28px rgba(0,0,0,0.28),0 0 20px var(--banner-glow, transparent);
    position: relative;
    isolation: isolate;
    overflow: hidden;
    transition: transform .2s ease,box-shadow .25s ease,background .25s ease,color .2s ease;
    cursor: pointer;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2)
}

.userBanner::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--banner-dot-color, currentColor);
    opacity: 0.8;
    filter: drop-shadow(0 0 4px var(--banner-dot-color, currentColor));
    flex: 0 0 auto;
    z-index: 2;
    position: relative
}

.userBanner::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    transform: skewX(-15deg);
    transition: left 0s;
    z-index: 1
}

.userBanner:hover::after {
    left: 100%;
    transition: left .7s ease-in-out
}

.userBanner:hover {
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08),0 16px 40px rgba(0,0,0,0.35),0 0 30px var(--banner-glow, rgba(255,255,255,0.15))
}

.userBanner:active {
    transform: translateY(0);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.06),0 8px 24px rgba(0,0,0,0.25)
}
.redosnov {
    --banner-text: white;
    --banner-bg-start: #660000;
    --banner-bg-end: #CC1100;
    --banner-glow: rgba(204, 17, 0, 0.4);
    background: linear-gradient(270deg, #600, #8b0000, #800000, #c10, #dc143c);
    background-size: 600% 600%;
    animation: AnimBanner 6s
ease infinite;

}