   </main>
    <footer></footer>

<script>
class xGridVisualAid {
    constructor() {
        this.init();
    }

    init() {
        this.xGrids = document.querySelectorAll('x-grid');
        this.setupDebugLines();

        const observer = new MutationObserver(this.handleClassMutation.bind(this));
        this.xGrids.forEach(xGrid => {
            observer.observe(xGrid, { attributes: true });
        });

        window.addEventListener('resize', this.setupDebugLines.bind(this));
    }

    setupDebugL