.menu-toggle{position:fixed;top:0;left:1rem;z-index:1001;font-size:1.5rem;background:0 0;border:none;color:#000;cursor:pointer;opacity:0;transform:translateX(-20px);transition:opacity .5s ease,transform .5s ease}@media(max-width:768px){.menu-toggle{left:auto;right:1rem}}body.dark .menu-toggle{color:#fff}.menu-toggle.show{opacity:1;transform:translateX(0)}.sidebar{position:fixed;top:0;left:-300px;width:250px;height:100%;background:#333;color:#fff;box-shadow:2px 0 10px rgba(0,0,0,.2);z-index:1000;padding:1rem;overflow-y:auto;transition:left .3s ease-in-out}.sidebar.show{left:0}.sidebar{float:left;margin-right:1rem;max-width:250px}@media(max-width:768px){.sidebar{left:auto;right:-300px;box-shadow:-2px 0 10px rgba(0,0,0,.2)}.sidebar.show{right:0;left:auto}}.sidebar .close-btn{display:block;color:#fff;opacity:0;transform:translateX(-20px);transition:opacity .5s ease,transform .5s ease}.sidebar .close-btn.show{opacity:1;transform:translateX(0)}.sidebar nav ul{list-style:none;padding:0}.sidebar nav ul li{margin:1rem 0;opacity:0;transform:translateX(-20px);transition:opacity .5s ease,transform .5s ease}.sidebar nav ul li.show{opacity:1;transform:translateX(0)}.sidebar nav ul li a{color:#fff;text-decoration:none}