.root {
    position: relative;
    padding: 1em 0.5em;
    border: 1px solid var(--md-sys-color-outline);
    background-color: var(--md-sys-color-surface);
    border-radius: 4px;
}

.heading {
    display: inline-block;
    margin-block-start: 0;
}

.heading:not(:focus-visible)::after {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: var(--md-sys-color-on-background);
    content: "";
    mask: url("/factorio/pencil.svg") no-repeat 50% 50%;
    opacity: 0.8;
    padding-inline-start: 0.5em;
}

.quit {
    --color: var(--md-sys-color-error);

    position: absolute;
    border: 1px solid var(--color);
    background: transparent;
    border-radius: 999999px;
    color: var(--color);
    font-weight: 500;
    inset-block-start: 1em;
    inset-inline-end: 1em;
}

.quit:is(:focus, :hover) {
    --color: var(--md-ref-palette-error60);

    filter: drop-shadow(0 0 2px var(--md-ref-palette-neutral-variant70));
}

.label {
    display: block;
}

.marginTop {
    display: block;
    margin-block-start: 1em;
}

.flex {
    display: flex;
    flex-wrap: wrap;
    gap: 0.1em;
}

.flex > * {
    width: max-content;
}