/* =================================================================

   Sidebar logo NBM — интерактивная декорация (PASS / главная)

   ================================================================= */

#nb-dashboard-wrapper {
    --logo-ring-a: rgba(255, 215, 0, 0.65);
    --logo-ring-b: rgba(176, 38, 255, 0.32);
    --logo-ring-c: rgba(255, 200, 60, 0.55);
    --logo-ring-inner: rgba(255, 240, 200, 0.45);
    --logo-aura: rgba(255, 215, 0, 0.12);
    --logo-glow-a: rgba(255, 215, 0, 0.16);
    --logo-glow-b: rgba(176, 38, 255, 0.1);
    --logo-spark-accent: rgba(220, 170, 255, 0.95);
    --logo-spark-accent-glow: rgba(176, 38, 255, 0.55);
    --logo-dot-color: var(--cin-accent, #ffd700);
    --logo-dot-glow: var(--cin-accent-glow, rgba(255, 215, 0, 0.5));
}

#nb-dashboard-wrapper[data-parallax-theme="music"] {
    --logo-ring-a: rgba(255, 215, 0, 0.72);
    --logo-ring-b: rgba(255, 160, 40, 0.28);
    --logo-ring-c: rgba(255, 230, 120, 0.58);
    --logo-ring-inner: rgba(255, 244, 194, 0.5);
    --logo-aura: rgba(255, 215, 0, 0.14);
    --logo-glow-a: rgba(255, 215, 0, 0.2);
    --logo-glow-b: rgba(255, 140, 0, 0.1);
    --logo-spark-accent: rgba(255, 200, 80, 0.95);
    --logo-spark-accent-glow: rgba(255, 180, 60, 0.55);
}

#nb-dashboard-wrapper[data-parallax-theme="subscription"] {
    --logo-ring-a: rgba(255, 244, 194, 0.78);
    --logo-ring-b: rgba(255, 215, 0, 0.42);
    --logo-ring-c: rgba(255, 180, 0, 0.62);
    --logo-ring-inner: rgba(255, 250, 220, 0.55);
    --logo-aura: rgba(255, 215, 0, 0.16);
    --logo-glow-a: rgba(255, 215, 0, 0.22);
    --logo-glow-b: rgba(255, 200, 60, 0.12);
    --logo-spark-accent: rgba(255, 230, 140, 0.98);
    --logo-spark-accent-glow: rgba(255, 215, 0, 0.65);
}

#nb-dashboard-wrapper[data-parallax-theme="contests"] {
    --logo-ring-a: rgba(255, 215, 0, 0.68);
    --logo-ring-b: rgba(255, 64, 129, 0.38);
    --logo-ring-c: rgba(255, 200, 80, 0.55);
    --logo-ring-inner: rgba(255, 190, 220, 0.42);
    --logo-aura: rgba(255, 180, 60, 0.13);
    --logo-glow-a: rgba(255, 215, 0, 0.17);
    --logo-glow-b: rgba(255, 64, 129, 0.12);
    --logo-spark-accent: rgba(255, 120, 170, 0.95);
    --logo-spark-accent-glow: rgba(255, 64, 129, 0.5);
}

#nb-dashboard-wrapper[data-parallax-theme="ai"] {
    --logo-ring-a: rgba(176, 38, 255, 0.72);
    --logo-ring-b: rgba(220, 170, 255, 0.38);
    --logo-ring-c: rgba(130, 50, 220, 0.58);
    --logo-ring-inner: rgba(220, 170, 255, 0.48);
    --logo-aura: rgba(176, 38, 255, 0.14);
    --logo-glow-a: rgba(176, 38, 255, 0.2);
    --logo-glow-b: rgba(255, 64, 180, 0.1);
    --logo-spark-accent: rgba(240, 180, 255, 0.98);
    --logo-spark-accent-glow: rgba(176, 38, 255, 0.62);
    --logo-dot-color: #e0b0ff;
    --logo-dot-glow: rgba(176, 38, 255, 0.55);
}

#nb-dashboard-wrapper[data-parallax-theme="games"] {
    --logo-ring-a: rgba(176, 38, 255, 0.62);
    --logo-ring-b: rgba(255, 215, 0, 0.36);
    --logo-ring-c: rgba(200, 120, 255, 0.52);
    --logo-ring-inner: rgba(255, 230, 160, 0.4);
    --logo-aura: rgba(160, 80, 255, 0.12);
    --logo-glow-a: rgba(176, 38, 255, 0.16);
    --logo-glow-b: rgba(255, 215, 0, 0.12);
    --logo-spark-accent: rgba(255, 215, 0, 0.95);
    --logo-spark-accent-glow: rgba(255, 215, 0, 0.5);
}

#nb-dashboard-wrapper[data-parallax-theme="social"] {
    --logo-ring-a: rgba(0, 188, 212, 0.62);
    --logo-ring-b: rgba(255, 64, 129, 0.34);
    --logo-ring-c: rgba(120, 230, 255, 0.5);
    --logo-ring-inner: rgba(170, 245, 255, 0.42);
    --logo-aura: rgba(0, 188, 212, 0.12);
    --logo-glow-a: rgba(0, 188, 212, 0.16);
    --logo-glow-b: rgba(255, 64, 129, 0.1);
    --logo-spark-accent: rgba(255, 140, 180, 0.95);
    --logo-spark-accent-glow: rgba(255, 64, 129, 0.48);
    --logo-dot-color: #7ae7ff;
    --logo-dot-glow: rgba(0, 188, 212, 0.45);
}

#nb-dashboard-wrapper[data-parallax-theme="services"] {
    --logo-ring-a: rgba(255, 230, 140, 0.7);
    --logo-ring-b: rgba(255, 215, 0, 0.38);
    --logo-ring-c: rgba(255, 180, 0, 0.58);
    --logo-ring-inner: rgba(255, 244, 194, 0.48);
    --logo-aura: rgba(255, 215, 0, 0.13);
    --logo-glow-a: rgba(255, 215, 0, 0.18);
    --logo-glow-b: rgba(255, 160, 40, 0.1);
    --logo-spark-accent: rgba(255, 220, 120, 0.95);
    --logo-spark-accent-glow: rgba(255, 200, 60, 0.52);
}

#nb-dashboard-wrapper[data-parallax-theme="finance"] {
    --logo-ring-a: rgba(76, 175, 80, 0.62);
    --logo-ring-b: rgba(255, 215, 0, 0.34);
    --logo-ring-c: rgba(140, 220, 150, 0.52);
    --logo-ring-inner: rgba(190, 255, 210, 0.42);
    --logo-aura: rgba(76, 175, 80, 0.11);
    --logo-glow-a: rgba(76, 175, 80, 0.15);
    --logo-glow-b: rgba(255, 215, 0, 0.1);
    --logo-spark-accent: rgba(255, 215, 0, 0.92);
    --logo-spark-accent-glow: rgba(76, 175, 80, 0.45);
    --logo-dot-color: #b8ffb8;
    --logo-dot-glow: rgba(76, 175, 80, 0.4);
}

#nb-dashboard-wrapper[data-parallax-theme="docs"] {
    --logo-ring-a: rgba(255, 215, 0, 0.62);
    --logo-ring-b: rgba(0, 188, 212, 0.3);
    --logo-ring-c: rgba(255, 200, 80, 0.52);
    --logo-ring-inner: rgba(170, 245, 255, 0.38);
    --logo-aura: rgba(255, 215, 0, 0.11);
    --logo-glow-a: rgba(255, 215, 0, 0.15);
    --logo-glow-b: rgba(0, 188, 212, 0.09);
    --logo-spark-accent: rgba(120, 220, 235, 0.92);
    --logo-spark-accent-glow: rgba(0, 188, 212, 0.42);
}

#nb-dashboard-wrapper[data-parallax-theme="profile"] {
    --logo-ring-a: rgba(255, 230, 160, 0.64);
    --logo-ring-b: rgba(255, 215, 0, 0.3);
    --logo-ring-c: rgba(255, 200, 100, 0.54);
    --logo-ring-inner: rgba(255, 240, 200, 0.44);
    --logo-aura: rgba(255, 215, 0, 0.1);
    --logo-glow-a: rgba(255, 215, 0, 0.14);
    --logo-glow-b: rgba(255, 180, 80, 0.08);
}

#nb-dashboard-wrapper[data-parallax-theme="default"] {
    --logo-ring-a: rgba(255, 215, 0, 0.58);
    --logo-ring-b: rgba(176, 38, 255, 0.26);
    --logo-ring-c: rgba(255, 200, 60, 0.5);
}

#nb-dashboard-wrapper .nb-logo__ring,
#nb-dashboard-wrapper .nb-logo__aura,
#nb-dashboard-wrapper .nb-logo__glow {
    transition: opacity 0.45s ease, background 0.45s ease, filter 0.45s ease;
}

#nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__shell {
    animation: nb-logo-theme-shell 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

#nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__aura {
    animation: nb-logo-theme-aura 0.45s ease;
}

#nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__glow {
    animation: nb-logo-theme-glow 0.45s ease;
}

#nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__ring {
    animation: nb-logo-ring-spin 4.5s linear infinite, nb-logo-theme-ring 0.45s ease;
}

#nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__shine {
    animation: nb-logo-shine 0.45s ease-in-out;
    opacity: 1;
}

@keyframes nb-logo-theme-shell {
    0% { filter: brightness(1); }
    35% { filter: brightness(1.12); }
    100% { filter: brightness(1); }
}

@keyframes nb-logo-theme-aura {
    0% { opacity: 0.35; transform: scale(0.94); }
    45% { opacity: 0.88; transform: scale(1.08); }
    100% { opacity: 0.35; transform: scale(0.96); }
}

@keyframes nb-logo-theme-glow {
    0% { opacity: 0.45; }
    45% { opacity: 0.95; }
    100% { opacity: 0.55; }
}

@keyframes nb-logo-theme-ring {
    0% { opacity: 0.5; }
    45% { opacity: 0.95; }
    100% { opacity: 0.5; }
}

#nb-dashboard-wrapper .nb-logo--deco {

    position: relative;

    z-index: 2;

    display: inline-flex;

    align-items: center;

    margin: 0;

    padding: 0;

    border: none;

    background: transparent;

    cursor: pointer;

    font: inherit;

    color: inherit;

    text-decoration: none;

    -webkit-tap-highlight-color: transparent;

    outline: none;

}



#nb-dashboard-wrapper .nb-logo--deco:focus-visible .nb-logo__shell {

    box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.45), 0 0 24px rgba(255, 215, 0, 0.2);

    border-radius: 14px;

}



#nb-dashboard-wrapper .nb-logo__shell {

    position: relative;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 7px 12px 7px 9px;

    border-radius: 14px;

    isolation: isolate;

    transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) translateY(var(--logo-lift, 0px));

    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94), filter 0.35s ease;

    animation: nb-logo-idle-float 5.5s ease-in-out infinite;

    will-change: transform;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__shell,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__shell {

    --logo-lift: -2px;

    animation-play-state: paused;

}



#nb-dashboard-wrapper .nb-logo--deco.is-pulse .nb-logo__shell {

    animation: nb-logo-click-pop 0.55s cubic-bezier(0.34, 1.4, 0.64, 1);

}



#nb-dashboard-wrapper .nb-logo__ring,

#nb-dashboard-wrapper .nb-logo__shine,

#nb-dashboard-wrapper .nb-logo__glow,

#nb-dashboard-wrapper .nb-logo__aura,

#nb-dashboard-wrapper .nb-logo__sparkles {

    position: absolute;

    pointer-events: none;

}



#nb-dashboard-wrapper .nb-logo__aura {

    inset: -10px -14px;

    border-radius: 20px;

    z-index: 0;

    background: radial-gradient(ellipse 90% 80% at 50% 50%, var(--logo-aura) 0%, transparent 68%);

    opacity: 0.35;

    filter: blur(8px);

    animation: nb-logo-aura-breathe 4s ease-in-out infinite;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__aura,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__aura {

    opacity: 0.75;

    animation-duration: 2.2s;

}



#nb-dashboard-wrapper .nb-logo__ring {

    inset: 0;

    border-radius: inherit;

    padding: 1px;

    background: conic-gradient(from 210deg, var(--logo-ring-a), transparent 24%, var(--logo-ring-b) 48%, transparent 70%, var(--logo-ring-c) 100%);

    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask-composite: exclude;

    opacity: 0.5;

    animation: nb-logo-ring-spin 12s linear infinite;

    z-index: 0;

}



#nb-dashboard-wrapper .nb-logo__ring--inner {

    inset: 2px;

    padding: 1px;

    opacity: 0.28;

    animation: nb-logo-ring-spin-rev 18s linear infinite;

    background: conic-gradient(from 90deg, transparent, var(--logo-ring-inner) 18%, transparent 36%, var(--logo-ring-b) 58%, transparent 78%);

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__ring,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__ring {

    opacity: 0.92;

    animation-duration: 6s;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__ring--inner,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__ring--inner {

    opacity: 0.55;

    animation-duration: 9s;

}



#nb-dashboard-wrapper .nb-logo__glow {

    inset: -8px -12px;

    border-radius: 18px;

    z-index: 0;

    background:
        radial-gradient(ellipse 80% 90% at 30% 40%, var(--logo-glow-a) 0%, transparent 62%),
        radial-gradient(ellipse 70% 80% at 78% 60%, var(--logo-glow-b) 0%, transparent 65%);

    filter: blur(6px);

    opacity: 0.55;

    animation: nb-logo-glow-pulse 4.5s ease-in-out infinite;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__glow {

    opacity: 0.95;

    filter: blur(10px);

}



#nb-dashboard-wrapper .nb-logo__shine {

    top: 0;

    left: -120%;

    width: 52%;

    height: 100%;

    z-index: 3;

    background: linear-gradient(105deg, transparent 0%, rgba(255, 240, 200, 0.28) 42%, rgba(255, 255, 255, 0.12) 50%, transparent 100%);

    transform: skewX(-16deg);

    animation: nb-logo-shine 6.5s ease-in-out infinite;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__shine {

    animation-duration: 2.2s;

}



#nb-dashboard-wrapper .nb-logo__sparkles {

    inset: -6px -8px;

    z-index: 4;

}



#nb-dashboard-wrapper .nb-logo__spark {

    position: absolute;

    width: 4px;

    height: 4px;

    border-radius: 50%;

    background: #fff4c2;

    box-shadow: 0 0 8px rgba(255, 215, 0, 0.75);

    animation: nb-logo-spark-twinkle 3.4s ease-in-out infinite;

}



#nb-dashboard-wrapper .nb-logo__spark:nth-child(1) { top: 6%; left: 4%; animation-delay: 0s; }

#nb-dashboard-wrapper .nb-logo__spark:nth-child(2) { top: 16%; right: 2%; animation-delay: 0.65s; width: 3px; height: 3px; }

#nb-dashboard-wrapper .nb-logo__spark:nth-child(3) { bottom: 10%; left: 16%; animation-delay: 1.3s; }

#nb-dashboard-wrapper .nb-logo__spark:nth-child(4) { bottom: 6%; right: 10%; animation-delay: 2s; width: 3px; height: 3px; background: var(--logo-spark-accent); box-shadow: 0 0 8px var(--logo-spark-accent-glow); }

#nb-dashboard-wrapper .nb-logo__spark:nth-child(5) { top: 44%; right: -2%; animation-delay: 0.25s; width: 2px; height: 2px; }



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__spark,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__spark {

    animation-duration: 1.8s;

}



#nb-dashboard-wrapper .nb-logo__mark {

    position: relative;

    z-index: 2;

    display: inline-flex;

    align-items: baseline;

    gap: 1px;

    font-family: var(--cin-font-head, var(--nb-font-head, inherit));

    font-weight: 700;

    font-size: 26px;

    line-height: 1;

    letter-spacing: 1px;

    transition: letter-spacing 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.35s ease, filter 0.35s ease;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__mark,

#nb-dashboard-wrapper .nb-logo--deco.is-live .nb-logo__mark {

    letter-spacing: 2.5px;

    transform: translateY(-1px) scale(1.02);

    filter: drop-shadow(0 0 16px rgba(255, 215, 0, 0.42));

}



#nb-dashboard-wrapper .nb-logo__word {

    color: #fff;

    text-shadow: 0 0 20px rgba(255, 255, 255, 0.18);

}



#nb-dashboard-wrapper .nb-logo__dot {

    color: var(--logo-dot-color);

    text-shadow: 0 0 16px var(--logo-dot-glow);

    transition: color 0.45s ease, text-shadow 0.45s ease;

    animation: nb-logo-dot-pulse 2.8s ease-in-out infinite;

}



#nb-dashboard-wrapper .nb-logo--deco:hover .nb-logo__dot {

    animation-duration: 1.4s;

}



@keyframes nb-logo-idle-float {

    0%, 100% { transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) translateY(var(--logo-lift, 0px)); }

    50% { transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) translateY(calc(var(--logo-lift, 0px) - 2px)); }

}



@keyframes nb-logo-click-pop {

    0% { transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) scale(1); }

    40% { transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) scale(1.06); }

    100% { transform: perspective(560px) rotateX(var(--logo-tilt-x, 0deg)) rotateY(var(--logo-tilt-y, 0deg)) scale(1); }

}



@keyframes nb-logo-ring-spin {

    to { transform: rotate(360deg); }

}



@keyframes nb-logo-ring-spin-rev {

    to { transform: rotate(-360deg); }

}



@keyframes nb-logo-aura-breathe {

    0%, 100% { opacity: 0.3; transform: scale(0.96); }

    50% { opacity: 0.6; transform: scale(1.05); }

}



@keyframes nb-logo-glow-pulse {

    0%, 100% { opacity: 0.45; transform: scale(1); }

    50% { opacity: 0.78; transform: scale(1.06); }

}



@keyframes nb-logo-shine {

    0%, 52% { left: -120%; opacity: 0; }

    58% { opacity: 1; }

    100% { left: 145%; opacity: 0; }

}



@keyframes nb-logo-spark-twinkle {

    0%, 100% { opacity: 0.25; transform: scale(0.7); }

    50% { opacity: 1; transform: scale(1.15); }

}



@keyframes nb-logo-dot-pulse {

    0%, 100% { opacity: 1; filter: brightness(1); }

    50% { opacity: 0.82; filter: brightness(1.35); }

}



body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo--deco {

    opacity: 1 !important;

    visibility: visible !important;

    width: auto !important;

    position: relative !important;

}



body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__shell {

    padding: 6px 8px;

    animation: none;

}



body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__dot,

body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__sparkles,

body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__shine,

body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__aura,

body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__ring--inner {

    display: none;

}



body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__word {

    font-size: 0;

    letter-spacing: 0;

}



body.nb-menu-collapsed #nb-dashboard-wrapper .nb-logo__word::before {

    content: 'N';

    font-size: 22px;

    color: #fff;

    text-shadow: 0 0 16px rgba(255, 215, 0, 0.25);

}



@media (max-width: 1024px) {

    #nb-dashboard-wrapper .nb-logo__mark {

        font-size: 24px;

    }

}



@media (prefers-reduced-motion: reduce) {

    #nb-dashboard-wrapper .nb-logo__ring,

    #nb-dashboard-wrapper .nb-logo__ring--inner,

    #nb-dashboard-wrapper .nb-logo__shine,

    #nb-dashboard-wrapper .nb-logo__glow,

    #nb-dashboard-wrapper .nb-logo__aura,

    #nb-dashboard-wrapper .nb-logo__spark,

    #nb-dashboard-wrapper .nb-logo__dot,

    #nb-dashboard-wrapper .nb-logo__shell,

    #nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__shell,

    #nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__aura,

    #nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__glow,

    #nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__ring,

    #nb-dashboard-wrapper .nb-logo--deco.is-theme-sync .nb-logo__shine {

        animation: none !important;

    }



    #nb-dashboard-wrapper .nb-logo__shell {

        transform: none !important;

        transition: none !important;

    }

}


