.side-navigation{align-items:flex-start;background:var(--red);color:var(--white);display:flex;flex-direction:row;flex-wrap:nowrap;gap:1rem;left:0;padding:var(--side-nav-padding-top) var(--side-nav-padding-right) var(--side-nav-padding-bottom) var(--side-nav-padding-left);position:fixed;top:var(--side-nav-offset);transition:translate .2s;translate:-100%;z-index:2147483599;&.around{translate:calc(-100% + 3.5rem)}&:hover{translate:0;& .arrow-wrapper>img{rotate:180deg}}@media (hover:none),(max-width:9in),(pointer:coarse){translate:-100%!important}&>.content{max-height:var(--side-nav-height);overflow-y:auto;padding-right:.5rem;scrollbar-color:#fff transparent;scrollbar-width:thin;&::-webkit-scrollbar{width:1px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background-color:#fff}&::-webkit-scrollbar-button{display:none;height:0}&>a{color:inherit;display:block;margin-bottom:var(--side-nav-margin-between-links);text-decoration-color:transparent;transition:text-decoration-color .2s;&:last-child{margin-bottom:0}&:hover{text-decoration-color:currentColor}}}&>.arrow-wrapper img{filter:invert(1);transition:rotate .4s}}