ytcc.css

/* ==UserStyle==
@name           youtube - compact chat
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document domain("youtube.com") {
    #message.yt-live-chat-text-message-renderer {
        padding: 0px;
    }

    #container.yt-live-chat-message-input-renderer {
        display: grid;
        grid-template-columns: 9fr 1fr;
    }

    #input-container > yt-live-chat-author-chip,
    #avatar.yt-live-chat-message-input-renderer {
        display: none;
    }

    #input-container.yt-live-chat-message-input-renderer {
        display: flex;
    }

    #top.yt-live-chat-message-input-renderer {
        grid-column-start: 1;
        grid-column-end: 2;
        grid-row-start: 1;
        grid-row-end: 1;
    }

    #buttons.yt-live-chat-message-input-renderer {
        grid-column-start: 2;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 1;
    }

    #pickers.yt-live-chat-message-input-renderer {
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 2;
        grid-row-end: 2;
    }

    #pickers.yt-live-chat-message-input-renderer {
        padding-right: 16px;
    }

    #top.yt-live-chat-message-input-renderer,
    #pickers.yt-live-chat-message-input-renderer,
    #error-message.yt-live-chat-message-input-renderer {
        margin: 0px;
    }

    #input.yt-live-chat-message-input-renderer {
        flex: 1;
    }

    yt-live-chat-header-renderer {
        font-size: 16px;
        height: unset;
        padding: 0px;
    }

    yt-live-chat-message-input-renderer {
        padding: 8px;
    }

    #overflow.yt-live-chat-header-renderer {
        width: 22px;
        height: 26px;
        padding: 0px;
    }

    #items yt-live-chat-author-chip #author-name {
        order: 2;
    }

    #items yt-live-chat-author-chip #chat-badges {
        order: 1;
        margin-right: 2px;
    }

    #items.yt-live-chat-ticker-renderer > .yt-live-chat-ticker-renderer {
        margin-right: 1px;
    }

    #container.yt-live-chat-ticker-paid-sticker-item-renderer,
    #container.yt-live-chat-ticker-sponsor-item-renderer,
    #container.yt-live-chat-ticker-paid-message-item-renderer {
        padding: 2px;
    }

    #items.yt-live-chat-ticker-renderer {
        height: unset;
        padding: 0 24px 0px 24px;
    }

    yt-live-chat-text-message-renderer {
        padding: 1px 2px;
    }

    yt-live-chat-paid-message-renderer {
        padding: 0px 0px;
    }

    yt-live-chat-author-chip.yt-live-chat-text-message-renderer {
        margin-right: 4px;
    }

    #content.yt-live-chat-paid-message-renderer,
    #header.yt-live-chat-paid-message-renderer {
        padding: 2px 4px;
        min-height: 10px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    #author-photo.yt-live-chat-text-message-renderer {
        margin-right: 4px;
    }

    #author-photo.yt-live-chat-text-message-renderer,
    .yt-live-chat-text-message-renderer > img.yt-img-shadow {
        width: 24px;
        height: auto;
    }

    #author-photo.yt-live-chat-text-message-renderer {
        border-radius: 0px;
    }

    yt-img-shadow.yt-live-chat-ticker-paid-message-item-renderer,
    yt-img-shadow.yt-live-chat-ticker-sponsor-item-renderer,
    yt-live-chat-ticker-renderer #items > *,
    #container.yt-live-chat-ticker-sponsor-item-renderer {
        border-radius: 2px;
    }

    #container.yt-live-chat-ticker-paid-message-item-renderer {
        border-radius: 2px;
    }
}