#ingame_HUD_EntityDebugger {
    position: absolute;
    background: $ingameHudBg;
    @include S(padding, 5px);
    @include S(right, 30px);

    top: 50%;
    transform: translateY(-50%);

    @include SuperSmallText;
    color: #eee;
    display: flex;
    flex-direction: column;

    > label {
        text-transform: uppercase;
    }

    .hint {
        color: #aaa;
    }

    &,
    * {
        pointer-events: all;
    }

    .propertyTable {
        @include S(margin-top, 8px);
    }

    .propertyTable,
    .entityComponents,
    .entityComponents .object > div {
        display: grid;
        grid-template-columns: 1fr auto;
        @include S(column-gap, 10px);
    }

    .entityComponents {
        grid-column: 1 / 3;
        @include S(margin-top, 5px);

        font-family: "Roboto Mono", "Fira Code", monospace;
        font-size: 90%;
        @include S(letter-spacing, -0.5px);

        label,
        span {
            line-height: 1.5em;

            &:not(span) {
                opacity: 0.5;
            }
        }
        &,
        * {
            @include SuperSmallText;
            @include S(font-size, 7px, $important: true);
            @include S(line-height, 12px, $important: true);
        }

        .object {
            grid-column: 1 / 3;
            line-height: 1.5em;

            > summary {
                transition: opacity 0.1s ease-in-out;
                cursor: pointer;
                &:hover {
                    opacity: 0.8;
                }
            }
            > div {
                @include S(margin-left, 4px);
                cursor: pointer;
            }
        }
    }
}