@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
b, u, i, center, a, details,
dl, dt, dd, ol, ul, li,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    font-family: sans;
    line-height: 1;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
:root {
    height: 100%;
}
body {
    background-color: var(--main-bg-color);
    color: var(--main-fg-color);
    min-height: 100%;
    display: grid;
    padding: 0 .8rem;
    grid-template-rows: auto minmax(min-content, 1fr) auto;
    grid-template-areas: "header" "main" "footer";
    grid-gap: .5rem;
}
p {
    word-break: break-word;
}
p + p {
    padding-top: .6rem;
}
a[href] {
    color: var(--main-link-color);
    text-decoration: none;
}
a[href]:hover {
    text-decoration: underline;
}
a[href]:visited {
    color: var(--main-linkvisited-color);
}
a:not([href]) {
    color: var(--main-fg-color);
}
.h-mirror {
    transform: rotateX(180deg);
}
.v-mirror {
    transform: rotateY(180deg);
}
.h-mirror.v-mirror {
    transform: rotateY(180deg) rotateX(180deg);
}
svg.icon.icon-eraser {
    width: 1.4em;
    margin-left: -.2em;
}
button svg.icon.icon-reply,
button svg.icon.icon-sign-in
{
    height: .9em;
    width: .9em;
}
h1.logo a,
h1.logo a:visited
{
    color: var(--main-fg-color);
}
h1.logo a:hover {
    text-decoration: none;
}
body > header {
    display: grid;
    grid-template-columns: auto auto 5fr;
    grid-area: header;
    margin: .5rem 0 0 0;
}
body > header h1 {
    font-size: 1.6em;
}
body > header h1 small {
    opacity: 0.7;
    font-weight: lighter;
}
body > header nav {
    padding-top: .6em;
}
header .sections {
    margin-left: 1rem;
}
.error header .top {
    display: none;
}
header .top {
    text-align: right;
}
.icon {
    vertical-align: middle;
}
body > header h1.logo .icon {
    height: 1.12em;
    width: .9em;
    vertical-align: bottom;
}
body > header h1.logo .icon.icon-l {
    width: .5em;
}
.inline {
    display: inline;
}
.inline li {
    display: inline-block;
    /*margin-left: .4em;*/
}
.sections .inline li::after,
.meta-items .inline li::after,
.inline li:last-child::after,
.inline li.no-sep::after {
    content: unset;
}
.inline li::after {
    content: "\22c5";
    padding-left: .4em;
}
.top {
    text-align: right;
}
.top ul {
    padding-top: .2rem;
    font-size: .8rem;
}
.sections li a svg {
    vertical-align: text-top;
}
.sections li a svg.icon-activitypub {
    width:  1.2rem;
    margin-left: .2rem;
}
body > main {
    grid-area: main;
}
body > footer {
    grid-area: footer;
    padding-bottom: 1em;
}
footer nav.bottom {
    overflow: hidden;
    float: right;
    font-size: .7rem;
}
footer nav.bottom::before {
    content: "Ω";
}
footer nav.bottom:hover::before {
    content: "";
}
footer nav.bottom ul {
    display: none;
}
footer nav.bottom:hover ul {
    display: unset;
}
.item h1,
.item h2,
.item h3,
.item h4,
.item h5,
.item h6 {
    font-weight: normal;
    /*margin: 0.2em 0;*/
}
.item h1 {
    font-size: 1.22em;
}
.item h2 {
    font-size: 1.16em;
}
.item h3 {
    font-size: 1.11em;
}
.item h4 {
    font-size: 1em;
}
.item h5 {
    font-size: .96em;
}
.item h6 {
    font-size: .94em;
}
.item h1 a {
    /*padding-left: 0.3em;*/
}
ol.hide-text article.data {
    display: none;
}
.hide-text li.item {
    min-height: 3.3rem;
}
.hide-text article header {
    margin-bottom: 0px;
}
article hr {
    width: 100%;
}
article > section {
    width: 100%;
}
article > header h2 {
    display: inline;
}
aside.domain {
    font-size: .85em;
    margin-left: .4em;
}
.domain:before {
    content: "(";
}
.domain:after {
    content: ")";
}
.data pre {
    line-height: 1.3rem;
    overflow: auto;
    max-width: 100%;
}
.data code {}
.data p:first-of-type {
    margin-top: 0;
    /*text-indent: 0;*/
}
.data p:first-of-type::first-letter {
    font-weight: normal;
    font-size: 110%;
}
ol {
    list-style: none;
    padding-left: 0;
}
.item {
    display: grid;
    grid-template-columns: 1.6rem 11fr;
    grid-template-rows: minmax(max-content, 1.4rem) auto;
    /*align-items: center;*/
    grid-template-areas:
            "sidebar main"
            "sidebar footer";
}
.item aside.score {
    grid-area: sidebar;
}
.item .data {
    line-height: 1.62em;
    /*grid-area: main;*/
    padding-left: 1ex;
    /*min-height: 1.4em;*/
    display: grid;
}
.item footer::before {
    content: '\2012';
}
.item footer {
    grid-area: footer;
    margin: .5em 0 1em 0;
}
ol li:last-child .item footer {
    margin-bottom: 0;
}
summary + ol.comments {
    margin-top: -1px;
}
ol.comments {
    margin-top: .3em;
    padding: 0 0 0 1.4em;
    /*border-radius: 0 0 0 .4rem;*/
}
.comments > li {
    padding: .7rem 0 0 0;
}
ol.comments.lvl-0 {
    /*border-radius: .4rem 0 0 .4rem;*/
}
ol.comments li {
    list-style: none;
}
.acct .score:before {
    content: "[";
}
.acct .score:after {
    content: "]";
}
.item .score {
    display: grid;
    grid-template-rows: 1em 1.5em 1em;
}
.item .score a {
    justify-self: center;
    align-self: center;
}
.score a.nay {
    margin-bottom: .5em;
}
.item .score data {
    justify-self: center;
    align-self: center;
    font-size: .7em;
}
.item .score data svg {
    margin-right: .1em;
    margin-bottom: .1em;
}
.item .score data.inf {
    font-weight: bold;
    font-size: 1.3em;
    margin: 0;
    padding: 0;
}
.item .score data.K,
.item .score data.M,
.item .score data.B
{
    font-weight: lighter;
    font-size: .6em;
}
.score .icon-recycle {
    opacity: .6;
}
.score a:not([href]) {
    opacity: .3;
}
.item .score a[href].ed {
    color: var(--main-linkvisited-color);
}
.score a[href]:visited {
    color: var(--main-link-color);
}
.deleted {
    opacity: .7;
}
.meta {
    font-size: .85em;
    opacity: .6;
    padding-left: 1ex;
}
.meta time .icon-clock-o {
    margin-right: .2em;
}
.by:before {
    content: "~";
}
.mention:before {
    content: "~";
    opacity: 0.8;
}
.tag:before {
    content: "#";
    opacity: 0.8;
    font-weight: 900;
}
.meta time {
    text-decoration: underline dotted;
}
.submission {
    padding: .2em 0 0 1.9em;
}
.comment {
    font-size: .96em;
}
.item del {
    line-height: 2rem;
    padding-left: 2ex;
    letter-spacing: 0.3ex;
    font-weight: 100;
}
.domains {
    font-size: 0.9em;
    font-weight: 200;
}
#content .meta {
    padding: 0 0 0 5ex;
}
.comments .item {
    margin-left: -.8em;
}
.comments details[open] {}
.comments details:not([open]) {}
.comments details {
    margin: .3em 0 .6em 0;
}
summary:focus {
    outline: none;
}
.comments details[open] > summary {
    padding: .3rem 0 0 .3rem;
    margin-bottom: 1px;
}
.comments details:not([open]) > summary {}
.comments details > summary::before {}
.comments details > summary {
    font-size: 0.7rem;
    /*display: inline;*/
    /*margin-top: .6rem;*/
    padding: .3rem 0 .3rem .3rem;
    /*border-radius: 0 0 0 .4rem;*/
}
.comments details > summary span {
    opacity: .6;
}
.comments details > summary::-webkit-details-marker {
    opacity: .3;
}
.comments, .comments summary {
    border-left-width: 1px;
    border-left-style: solid;
}
.lvl-9 {
    border-color: #ebebebaa;
}
.lvl-8 {
    border-color: #d7d7d7aa;
}
.lvl-7 {
    border-color: #c4c4c4aa;
}
.lvl-6 {
    border-color: #b0b0b0aa;
}
.lvl-5 {
    border-color: #9c9c9caa;
}
.lvl-4 {
    border-color: #898989aa;
}
.lvl-3 {
    border-color: #757575aa;
}
.lvl-2 {
    border-color: #626262aa;
}
.lvl-1 {
    border-color: #4e4e4eaa;
}
.lvl-0 {
    border-color: #3a3a3aaa;
}
/*.data {*/
    /*max-width: 960px;*/
/*}*/
.comments .data,
#content .data {
    border: none;
}
.text-plain {
    white-space: pre;
    font-family: monospace;
    /*overflow: auto;*/
    line-height: revert;
}
.text-plain > header {
    white-space: normal;
    font-family: revert;
}
#new fieldset,
#reply fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}
#reply, #register, #new, #login {
    max-width: 60ex;
}
#reply textarea,
#new textarea {
    width: 100%;
}
#reply label,
#new label,
#login label {}
#register form button,
#login form button
{
    margin-top: .2em;
}
.meta-items {
    display: inline-block;
    text-align: center;
}
.meta-items li {
    padding-left: .2rem;
}
h2.title .to-item::after {
    content: '\00a7';
}
h2.title .to-item {
    margin-left: .4em;
}
a.to-item svg {
    width: .78em;
    height: .78em;
    vertical-align: baseline;
}
.details-agree {
    font-size: .8em;
}
.details-agree input[type=checkbox] {
    position: relative;
    top: 3px;
}
form label {
    min-height: 1.8rem;
    line-height: 1.8rem;
}
form label.mime-type {
    font-size: .8em;
    float: right;
}
.about main,
.error main {
    margin: 0 auto;
    max-width: 960px;
}
.error main {
    font-size: 2em;
    max-height: 480px;
    align-items: center;
}
.error>header nav,
.about>header {
    display: none;
}
.error main section,
.about main section {
    opacity: .65;
    margin-top: 1em;
    line-height: 2em;
}
.about main section {
    padding: 0 1rem;
}
.error main section h1 {
    font-size: 1.2em;
    margin-bottom: 1rem;
    text-align: center;
}
.about main section h1 {
    font-size: 2em;
    text-align: center;
    margin-bottom: 1em;
}
.pagination li {
    margin-left: .4rem;
}
.pagination .icon {
    font-size: .8em;
}
.acct-info {
    float: right;
}
.pub-key details[open] {
}
.pub-key details[open] pre {
    max-width: 65ex;
    font-size: .8em;
    right: .5em;
    padding: .2em;
    text-align: justify;
    overflow: hidden;
    position: fixed;
    background: var(--main-bg-color);
    z-index: 100;
    box-shadow: 0 0 2px -2px var(--main-fg-color);
}
.acct-info section {
    margin-top: 1em;
}
svg.icon.icon-adjust {
    width: 1.1em;
    height: 1.1em;
}
.icon-adjust, .icon-clock-o {
    vertical-align: bottom;
}
.icon-github, .icon-code {
    vertical-align: middle;
}
.icon-angle-double-left,
.icon-angle-double-right {
    vertical-align: baseline;
}
@media (max-width: 767px) {
    body > header .top span.score {
        display: none;
    }
    body > header .top li:first-child,
    body > header .top li:nth-child(2)
    {
        display: none;
    }
}
@media (max-width: 576px) {
    .sections li a svg.icon.icon-activitypub {
        height: 1rem;
        width: 1.3rem;
    }
    .sections li a svg {
        height: 1rem;
        width: 1rem;
    }
    aside.domain {
        display: none;
    }
}
@media (max-width: 330px) {
    .sections li a svg.icon.icon-activitypub {
        height: 1rem;
        width: 1.3rem;
    }
    .sections li a svg {
        height: 1rem;
        width: 1rem;
    }
    .sections li {
        font-size: 0;
        overflow: hidden;
    }
    body > header .top {
        display: none;
    }
    :root {
        font-size: 3.8vw;
    }
}
@media (min-width: 330px) {
    .sections li a svg.icon.icon-activitypub {
        height: 1rem;
        width: 1.3rem;
    }
    .sections li a svg {
        height: 1rem;
        width: 1rem;
    }
    .sections li {
        font-size: 0;
        overflow: hidden;
    }
    body > header .top {
        display: none;
    }
    :root {
        font-size: 3.6vw;
    }
}
@media (min-width: 480px) {
    body > header .top {
        display: unset;
    }
    :root {
        font-size: 2.6vw;
    }
}
@media (min-width: 576px) {
    :root {
        font-size: 2.4vw;
    }
    aside.domain {
        display: inline;
    }
    .sections li {
        font-size: unset;
    }
}
@media (min-width: 640px) {
    :root {
        font-size: 2vw;
    }
}
@media (min-width: 768px) {
    :root {
        font-size: 2vw;
    }
    body > header .top {
        display: unset;
    }
    body > header .sections li a {
        font-size: unset;
        display: unset;
    }
    body > header .top span.score {
        display: unset;
    }
    body > header .top li:first-child,
    body > header .top li:nth-child(2)
    {
        display: unset;
    }
}
@media (min-width: 860px) {
    :root {
        font-size: 1.8vw;
    }
}
@media (min-width: 948px) {
    :root {
        font-size: 1.6vw;
    }
}
@media (min-width: 1050px) {
    :root {
        font-size: 1.4vw;
    }
}
@media (min-width: 1200px) {
    :root {
        font-size: 1.16vw;
    }
    aside.domain {
        display: inline;
    }
}
@media (min-width: 1500px) {
    :root {
        font-size: .9vw;
    }
}
@media (min-width: 1700px) {
    :root {
        font-size: 1.05vw;
    }
}
@media (min-width: 1800px) {
    :root {
        font-size: .86vw;
    }
}
@media (min-width: 2200px) {
    :root {
        font-size: .62vw;
    }
}
dialog {
    width: 60%;
}
button.close {
    width: 1.5em;
    height: 1.5em;
    padding: 0;
    font-size: .8em;
    margin-top: -1em;
    margin-right: -1em;
    float: right;
}
