body {
            margin: 0;
            font-family: Arial, sans-serif;
            
        }
        .sidebar {
            position: fixed;
            top: 0;
            left: -250px;
            width: 250px;
            height: 100%;
            background-color: #fc0fc0;
            color: white;
            padding-top: 60px;
            transition: left 0.3s ease;
            z-index: 1000;
        }
        .sidebar a {
            display: block;
            padding: 15px 20px;
            color: white;
            text-decoration: none;
        }
        .sidebar a:hover {
            background-color: white;
        }
        .sidebar.open {
            left: 0;
        }
        .backdrop {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.5);
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.3s ease;
            z-index: 900;
        }
        .backdrop.show {
            opacity: 1;
            visibility: visible;
        }
        .menu-toggle {
            position: fixed;
            top: 15px;
            left: 15px;
            z-index: 1100;
            cursor: pointer;
        }
        .menu-toggle div {
            width: 30px;
            height: 3px;
            background-color: #333;
            margin: 5px 0;
        }
        .content {
            padding: 20px;
        }