body {
    padding: 0;
    margin: 0;

    font-family: "Noto Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", Verdana, "Verdana Ref", sans-serif;
    line-height: 1.6;

    background: #010125;
    color:white;
}

:where(:is(ul,ol)[role=list]) {
    list-style: none;
    padding-left: 0;
}

pre, code, kbd, samp {
    font-family: monospace, monospace;
}

a {
    color: currentColor;
    text-decoration: underline 1px #888;
}
    a:hover {
        text-decoration-line: underline !important;
        text-decoration-thickness: 2px;
        text-decoration-color: #888;
    }

h1 {
    font-size: 2em;
    margin-top: 0;
}

h2 {
    font-size: 1.3em;
    margin-top: 3em;
}

h3 {
    font-size: 1em;
    font-weight: bold;
}

pre {
    overflow-x: auto;
	scrollbar-width: thin;
    scrollbar-color: #888 transparent;
	-moz-tab-size: 4ch;
	-o-tab-size: 4ch;
	tab-size: 4ch;
}

blockquote {
	margin-inline-start: 1em;
	padding-inline-start: 1em;
	border-inline-start: .2em solid #bbb;
}

dl {
    --placeholder: none
}
    dl .entry + .entry {
        margin-top: 1em;
    }

    dt {
        font-weight: bold;
    }

p > img:only-child {
    border: 1px solid #888;
}

.fig {
    margin-inline: 0;
    padding-inline-start: 2ch;
    border-inline-start: 1px solid #aaa;
}
    .fig figcaption {
        color: #aaa;
        font-size: .9em;
        letter-spacing: .06em;
    }

    .fig > * {
        margin: 0;
    }

    @media (min-width: calc(5vw * 2 + 70ch + 1em + 20ch)) {
        .fig {
            display: flex;
            flex-flow: row;
            vertical-align: top;
            gap: 1em;
        }
        .fig figcaption {
            display: block;
            max-width: 20ch;
        }

        .fig > :not(figcaption) {
            width: 68ch;
        }
    }

.homepage-header {
    display: grid;
    grid-template-columns: minmax(15ch, 2fr) 3fr;
    align-items: center;
    gap: 1em;
}
    .homepage-header h1 {
        grid-column: 1;
        margin: 0;
        line-height: 1.2;
    }

    .homepage-header p {
        grid-column: 2;
        text-align: right;
        max-width: 40ch;
        margin-left: auto;
        font-style: italic;
    }

.site-footer {
    margin-block-start: 3em;
    padding-inline: var(--page-padding);
    color: #bbb;
}

.issue-list {
    --empty-ruleset: true;
}
    .issue-list h2 {
        font-size: 1.8em;
        font-weight: normal;
    }

	.issue-list * + * {
		margin-top: 2em;
	}

.thisweek-issue {
    --empty-ruleset: ;
}
    .issueheader {
        margin-block: 2em;
    }
        .issueheader > * {
            margin-block: 0;
        }

    .thisweek-issue .e-content :is(p, .social-embed) {
        max-width: 70ch;
    }

    .thisweek-issue .e-content > :first-child {
        margin-top: 1em;
    }

.social-embed {
    margin-inline: 0;
}
    .social-embed > figcaption {
        text-align: end;
        font-weight: bold;
        font-size: .8em;
        line-height: 1.4em;
        color: rgb(173, 173, 173);
        color: var(--social-accent);
    }

    .social-embed > figcaption:hover {
        color: white;
    }

    .social-embed > figcaption a {
        text-decoration: none;
    }

    .social-embed .silo {
        text-transform: uppercase;
        letter-spacing: 1px;
    }
    
    .social-embed > blockquote {
        margin: 0;
        padding-inline: 2ch 1ch;
        background: var(--social-bg, #353535);
        border: 2px solid var(--social-accent, #9a9a9a);
        border-radius: .3em;
    }
        .social-embed > blockquote > :last-child {
            margin-bottom: 0;
        }

    .social-embed .author {
        display: inline-block;
        transform: translateX(-1ch);
    }

    .social-embed cite {
        font-style: normal;
    }
        .social-embed cite a {
            text-decoration-line: none;
            text-decoration-color: currentColor;
        }

    .social-embed.-discord {
        --social-bg: hsl(220, 8%, 23%);
        --social-accent: hsl(235, 87%, 65%);
    }

    .social-embed.-twitter {
        --social-bg: hsl(210, 34%, 13%);
        --social-accent: hsl(204, 88%, 53%);
    }
        .social-embed.-twitter .handle {
            color: #afafaf;
        }

        .social-embed.-twitter > blockquote > p:first-of-type {
            margin-top: 0;
        }

.chat-log {
    --empty-ruleset: true;
}
    .chat-log > blockquote * {
        margin-block: 0;
    }

    .chat-log img {
        vertical-align: text-top;
    }

    .chat-log .replyto {
        font-size: .9em;
    }
        .chat-log .replyto > b {
            font-weight: normal;
        }

        .chat-log .replyto > span {
            color: #aaa;
            font-style: italic;
        }

    .chat-log .reaction {
        display: inline-block;
        font-size: .9em;
        line-height: 1.4em;
        background-color: #222;
        border: 1px solid #555;
        border-radius: 4px;
        padding-inline: .3em;
        margin-inline: .09em;
        transform: translateY(-.1em);
    }
        .chat-log .reaction .emoji {
            text-shadow: 1px 1px 0 black, -1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
        }
    
    .chat-log .stage-direction {
        display: inline-block;
        width: 100%;
        text-align: center;
        
        font-size: .8em;
        font-weight: bold;
        font-style: normal;
        color: #afafaf;

        border-top: 1px solid #afafaf;
        margin: .5em 0 .5em -1ch;
        line-height: 1.1;
    }

.youtube-embed {
    margin-inline: 0;
}
    .youtube-embed > iframe {
        max-width: 70ch;
        aspect-ratio: 16 / 9;
    }

.emoji {
    font-family: apple color emoji,segoe ui emoji,noto color emoji,android emoji,emojisymbols,emojione mozilla,twemoji mozilla,segoe ui symbol
}

.-container {
    max-width: clamp(70ch, 80vw, 100%);
    margin-inline: auto;
    padding: .5ch;
}