.root {
    position: relative;
    border: 2px solid black;
    padding: 1em 0.5em;
}

.quit {
    --color: darkred;
    position: absolute;
    right: 1em;
    top: 1em;
    border-radius: 999999px;
    background: transparent;
    border: 1px solid var(--color);
    color: var(--color);
    font-weight: 700;
}

.quit:is(:focus, :hover) {
    --color: red;
    filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5));
}

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

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

@media (prefers-color-scheme: dark) {
    .root {
        border-color: gray;
    }

    .quit {
        --color: indianred;
    }

    .quit:is(:focus, :hover) {
        --color: red;
        filter: drop-shadow(0px 0px 2px rgba(255, 255, 255, 0.5));
    }
}