html, body {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans', sans-serif;
    color: #eee;
    background-color: #111;
}

a {
    color: #fff;
    text-decoration: underline;
}

article.masto-embed {
    max-width: 500px;
    border: 1px solid #aaa;
    background-color: #222;
    padding: 1em;
    margin: 0.5em;

    i.fa {
        font-style: normal;
    }

    .fa.fa-globe::before {
        content: "public";
    }

    .fa.fa-unlock::before {
        content: "unlisted";
    }

    .fa.fa-reply::before {
        content: "replies: ";
    }

    .fa.fa-retweet::before {
        content: "boosts: ";
    }

    .fa.fa.fa-floppy-o::before {
        content: "florps: ";
    }

    .detailed-status {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;

        div.p-author.h-card {
            flex: 1;

            a {
                text-decoration: none;
                display: flex;
                flex-direction: row;
                img.account__avatar {
                    width: 48px;
                    height: 48px;
                    padding-right: 1em;
                }
                .display-name {
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    .display-name__account {
                        font-size: 0.95em;
                    }
                }
            }
        }

        .button.logo-button.modal-button {
            svg { width: 1.1em; }
        }

        .emojione.custom-emoji {
            max-width: 1.1em;
            max-height: 1.1em;
        }

        .status__content {
            width: 100%;
        }
        .detailed-status__meta {
            font-size: 0.95em;
            width: 100%;
        }

        .modal-button.detailed-status__link {
            text-decoration: none;
        }

        .detailed-status__application {
            font-weight: normal;
            text-decoration: none;
        }

        .detailed-status__datetime {
            text-decoration: none;
            time {
                text-decoration: underline;
            }
        }
    }
}