:root {
    --msb-accent:        #5D87FF;
    --msb-accent-glow:   rgba(93, 135, 255, 0.25);
    --msb-accent-soft:   rgba(93, 135, 255, 0.10);
    --msb-accent-mid:    rgba(93, 135, 255, 0.20);
    --msb-glass-bg:      rgba(93, 135, 255, 0.06);
    --msb-glass-border:  rgba(93, 135, 255, 0.12);
    --msb-text:          #2a3547;
    --msb-text-muted:    #7C8FAC;
    --msb-white:         #2a3547;
    --msb-ease:          cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes msb-orb-drift {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(12px, -18px) scale(1.07); }
    66%  { transform: translate(-8px, 10px) scale(0.95); }
    100% { transform: translate(0, 0) scale(1); }
}

@keyframes msb-shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}

@keyframes msb-slide-in {
    from { opacity: 0; transform: translateX(-14px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes msb-pulse-ring {
    0%   { box-shadow: 0 0 0 0 var(--msb-accent-glow); }
    70%  { box-shadow: 0 0 0 7px rgba(93,135,255,0); }
    100% { box-shadow: 0 0 0 0 rgba(93,135,255,0); }
}

@keyframes msb-glow-breath {
    0%, 100% { box-shadow: 0 2px 12px rgba(93,135,255,0.18); }
    50%       { box-shadow: 0 4px 22px rgba(93,135,255,0.38); }
}

@keyframes msb-line-grow {
    from { transform: scaleY(0); opacity: 0; }
    to   { transform: scaleY(1); opacity: 1; }
}

@keyframes msb-label-fade {
    from { opacity: 0; letter-spacing: .2em; }
    to   { opacity: 1; letter-spacing: .09em; }
}

@keyframes msb-icon-bounce {
    0%, 100% { transform: translateY(0); }
    40%      { transform: translateY(-3px); }
    70%      { transform: translateY(1px); }
}

@keyframes msb-ripple {
    from { transform: scale(0); opacity: 0.5; }
    to   { transform: scale(3.5); opacity: 0; }
}

.left-sidebar {
    background: linear-gradient(
        160deg,
        rgba(255, 255, 255, 0.97) 0%,
        rgba(245, 248, 255, 0.98) 50%,
        rgba(250, 252, 255, 0.97) 100%
    ) !important;
    backdrop-filter: blur(24px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.4) !important;
    border-right: 1px solid rgba(93, 135, 255, 0.10) !important;
    box-shadow: 4px 0 32px rgba(93, 135, 255, 0.08) !important;
    position: relative;
    overflow: hidden;
}

.left-sidebar::before {
    content: '';
    position: absolute;
    top: -80px;
    left: -60px;
    width: 280px;
    height: 280px;
    background: radial-gradient(circle, rgba(93,135,255,0.07) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    animation: msb-orb-drift 9s ease-in-out infinite;
    z-index: 0;
}

.left-sidebar::after {
    content: '';
    position: absolute;
    bottom: -60px;
    right: -40px;
    width: 220px;
    height: 220px;
    background: radial-gradient(circle, rgba(93,135,255,0.05) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    animation: msb-orb-drift 12s ease-in-out infinite reverse;
    z-index: 0;
}

.left-sidebar .scroll-sidebar {
    background: transparent !important;
    position: relative;
    z-index: 1;
}

.left-sidebar .brand-logo {
    background: rgba(93, 135, 255, 0.02) !important;
    border-bottom: 1px solid rgba(93, 135, 255, 0.08) !important;
    backdrop-filter: blur(8px) !important;
    position: relative;
    z-index: 2;
}

.left-sidebar .brand-logo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,0.04) 50%,
        transparent 100%
    );
    background-size: 400px 100%;
    animation: msb-shimmer 3s ease infinite;
    pointer-events: none;
}

.left-sidebar .nav-small-cap {
    color: var(--msb-text-muted) !important;
    letter-spacing: .09em;
    animation: msb-label-fade 0.5s var(--msb-ease) both;
    position: relative;
    z-index: 1;
}
.left-sidebar .nav-small-cap .nav-small-cap-icon {
    color: var(--msb-text-muted) !important;
}

.left-sidebar .sidebar-nav .sidebar-link {
    color: var(--msb-text) !important;
    border-radius: 10px !important;
    margin: 1px 6px !important;
    padding: 9px 14px !important;
    transition:
        background 0.22s var(--msb-ease),
        color 0.18s ease,
        box-shadow 0.22s ease,
        transform 0.18s var(--msb-ease) !important;
    position: relative;
    overflow: hidden;
    animation: msb-slide-in 0.38s var(--msb-ease) both;
    z-index: 1;
}

.left-sidebar #sidebarnav > li:nth-child(1)  .sidebar-link { animation-delay: .04s; }
.left-sidebar #sidebarnav > li:nth-child(2)  .sidebar-link { animation-delay: .07s; }
.left-sidebar #sidebarnav > li:nth-child(3)  .sidebar-link { animation-delay: .10s; }
.left-sidebar #sidebarnav > li:nth-child(4)  .sidebar-link { animation-delay: .13s; }
.left-sidebar #sidebarnav > li:nth-child(5)  .sidebar-link { animation-delay: .16s; }
.left-sidebar #sidebarnav > li:nth-child(6)  .sidebar-link { animation-delay: .19s; }
.left-sidebar #sidebarnav > li:nth-child(7)  .sidebar-link { animation-delay: .22s; }
.left-sidebar #sidebarnav > li:nth-child(8)  .sidebar-link { animation-delay: .25s; }
.left-sidebar #sidebarnav > li:nth-child(9)  .sidebar-link { animation-delay: .28s; }
.left-sidebar #sidebarnav > li:nth-child(10) .sidebar-link { animation-delay: .31s; }
.left-sidebar #sidebarnav > li:nth-child(11) .sidebar-link { animation-delay: .34s; }
.left-sidebar #sidebarnav > li:nth-child(12) .sidebar-link { animation-delay: .37s; }
.left-sidebar #sidebarnav > li:nth-child(13) .sidebar-link { animation-delay: .40s; }
.left-sidebar #sidebarnav > li:nth-child(14) .sidebar-link { animation-delay: .43s; }
.left-sidebar #sidebarnav > li:nth-child(15) .sidebar-link { animation-delay: .46s; }

.left-sidebar .sidebar-nav .sidebar-link .msb-ripple {
    position: absolute;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    background: rgba(93,135,255,0.30);
    pointer-events: none;
    transform: scale(0);
    animation: msb-ripple 0.55s ease-out forwards;
}

.left-sidebar .sidebar-nav .sidebar-link i,
.left-sidebar .sidebar-nav .sidebar-link .ti,
.left-sidebar .sidebar-nav .sidebar-link .fas,
.left-sidebar .sidebar-nav .sidebar-link .fa-solid {
    color: var(--msb-text-muted) !important;
    transition: color 0.18s ease, transform 0.22s var(--msb-ease) !important;
}

.left-sidebar .sidebar-nav .sidebar-link:hover {
    background: var(--msb-glass-bg) !important;
    color: var(--msb-accent) !important;
    transform: translateX(3px) !important;
    box-shadow: 0 2px 14px rgba(93,135,255,0.08) !important;
}

.left-sidebar .sidebar-nav .sidebar-link:hover i,
.left-sidebar .sidebar-nav .sidebar-link:hover .ti,
.left-sidebar .sidebar-nav .sidebar-link:hover .fas,
.left-sidebar .sidebar-nav .sidebar-link:hover .fa-solid {
    color: var(--msb-accent) !important;
    animation: msb-icon-bounce 0.4s var(--msb-ease) !important;
}

.left-sidebar .sidebar-nav .sidebar-link.active {
    background: linear-gradient(
        135deg,
        rgba(93,135,255,0.12) 0%,
        rgba(93,135,255,0.05) 100%
    ) !important;
    color: var(--msb-accent) !important;
    font-weight: 600;
    border: 1px solid var(--msb-accent-mid) !important;
    box-shadow: 0 2px 16px rgba(93,135,255,0.12) !important;
    animation: msb-glow-breath 3s ease-in-out infinite !important;
    transform: translateX(0) !important;
}

.left-sidebar .sidebar-nav .sidebar-link.active i,
.left-sidebar .sidebar-nav .sidebar-link.active .ti,
.left-sidebar .sidebar-nav .sidebar-link.active .fas,
.left-sidebar .sidebar-nav .sidebar-link.active .fa-solid {
    color: var(--msb-accent) !important;
    animation: msb-pulse-ring 2s ease-out infinite !important;
}

.left-sidebar .sidebar-nav .sidebar-link.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 20%;
    height: 60%;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: linear-gradient(180deg, #5D87FF, #a5bcff);
    box-shadow: 0 0 8px var(--msb-accent-glow);
}

.left-sidebar .sidebar-nav ul .sidebar-item
> .sidebar-link.has-arrow[aria-expanded=true]:not(.active) {
    background: var(--msb-glass-bg) !important;
    color: var(--msb-accent) !important;
    border: 1px solid var(--msb-glass-border) !important;
}
.left-sidebar .sidebar-nav ul .sidebar-item
> .sidebar-link.has-arrow[aria-expanded=true]:not(.active) .ti,
.left-sidebar .sidebar-nav ul .sidebar-item
> .sidebar-link.has-arrow[aria-expanded=true]:not(.active) i {
    color: var(--msb-accent) !important;
}

.sidebar-nav .has-arrow:after {
    border-color: var(--msb-text-muted) !important;
    transition:
        transform 0.28s var(--msb-ease),
        border-color 0.2s ease !important;
}
.sidebar-nav .has-arrow[aria-expanded=true]:after {
    border-color: var(--msb-accent) !important;
}

.sidebar-nav .collapsing {
    transition: height 0.28s var(--msb-ease) !important;
}

.sidebar-nav ul .sidebar-item > .first-level {
    margin-left: 20px;
    padding-left: 10px;
    border-left: 2px solid var(--msb-accent-soft);
    transform-origin: top;
    animation: msb-line-grow 0.3s var(--msb-ease) both;
}
.sidebar-nav ul .sidebar-item > .first-level.show {
    border-left-color: var(--msb-accent-mid);
    box-shadow: -1px 0 6px rgba(93,135,255,0.12);
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-link .ti,
.sidebar-nav ul .sidebar-item .first-level .sidebar-link .fas,
.sidebar-nav ul .sidebar-item .first-level .sidebar-link .fa-solid {
    font-size: 15px !important;
}
.sidebar-nav ul .sidebar-item .first-level .sidebar-item > .sidebar-link {
    gap: 12px;
    padding-left: 10px;
}
.sidebar-nav ul .sidebar-item .first-level .sidebar-item:last-child {
    margin-bottom: 10px;
}

.left-sidebar .scroll-sidebar::-webkit-scrollbar {
    width: 3px;
}
.left-sidebar .scroll-sidebar::-webkit-scrollbar-track {
    background: transparent;
}
.left-sidebar .scroll-sidebar::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--msb-accent), rgba(93,135,255,0.15));
    border-radius: 4px;
}