:root {
    --aksen: #539fb3;
    --putih: #ffffff;
    --bg: #141414;
    --abu: #676767;
    --abu2: #323232;
    --error: #fa0b27;
}

@font-face {
    font-family: 'Adwaita Mono';
    src: url('https://ufal.envs.net/style/fonts/AdwaitaMono-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Adwaita Mono';
    src: url('https://ufal.envs.net/style/fonts/AdwaitaMono-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Adwaita Mono';
    src: url('https://ufal.envs.net/style/fonts/AdwaitaMono-Italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Adwaita Mono';
    src: url('https://ufal.envs.net/style/fonts/AdwaitaMono-BoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

body { 
    width: min(75ch, 100% - 2rem); 
    margin-inline: auto; 
    margin-top: 40px; 
    margin-bottom: 48px; 
    line-height: 1.5; 
    word-wrap: break-word; 
    color: var(--putih);
    background-color: var(--bg);
    font-family: 'Adwaita Mono', monospace;
}

input, textarea, select, button {
    background-color: var(--abu2);
    color: var(--putih);
    border: 1px solid var(--abu);
    font-family: inherit;
    padding: 0.3em;
}

a { 
    color: var(--aksen); 
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

pre { 
    overflow-x: scroll; 
    background-color: var(--abu2); 
    padding: 0.5em; 
}

blockquote { 
    font-style: italic; 
    border-left: 3px solid var(--aksen); 
    padding-left: 0.5em; 
    margin-left: 0; 
}

.snac-embedded-video, img { max-width: 100% }
.snac-origin { font-size: 85% }
.snac-score { float: right; font-size: 85% }
.snac-top-user { text-align: center; padding-bottom: 2em }
.snac-top-user-name { font-size: 200% }
.snac-top-user-id { font-size: 150% }
.snac-announcement { border: var(--abu) 1px solid; padding: 0.5em; background-color: var(--abu2); }
.snac-avatar { float: left; height: 2.5em; width: 2.5em; padding: 0.25em }
.snac-author { font-size: 90%; text-decoration: none }
.snac-author-tag { font-size: 80% }
.snac-pubdate { color: var(--abu); font-size: 90% }
.snac-top-controls { padding-bottom: 1.5em }

.snac-post { border-top: 1px solid var(--abu2); padding-top: 0.5em; padding-bottom: 0.5em; }
.snac-children { padding-left: 1em; border-left: 1px solid var(--abu2); }
.snac-thread-cont { border-top: 1px dashed var(--abu); }

.snac-textarea { font-family: inherit; width: 100% }
.snac-history { border: 1px solid var(--abu); border-radius: 3px; margin: 2.5em 0; padding: 0 2em }
.snac-btn-mute, .snac-btn-unmute, .snac-btn-follow, .snac-btn-unfollow, 
.snac-btn-hide, .snac-btn-delete, .snac-btn-limit, .snac-btn-unlimit { float: right; margin-left: 0.5em }
.snac-footer { margin-top: 2em; font-size: 75%; color: var(--abu); }
.snac-poll-result { margin-left: auto; margin-right: auto; }
.snac-list-of-lists { padding-left: 0; }
.snac-list-of-lists li { display: inline; border: 1px solid var(--abu); border-radius: 25px;
  margin-right: 0.5em; padding-left: 0.5em; padding-right: 0.5em; }
.snac-no-more-unseen-posts { border-top: 1px solid var(--abu2); border-bottom: 1px solid var(--abu2); padding: 0.5em 0; margin: 1em 0; }
.snac-reaction { padding:5px; padding-left: 10px; padding-right: 10px; display: inline-flex; margin-right: 5px; font-family: inherit; font-size: medium; height: 2.5rem; vertical-align:middle; align-items:center;}
.snac-reaction-image { max-width: 100%; max-height: 100%; }
.snac-reaction-div { border-left: var(--abu); border-left-style: solid; margin-bottom: .3em; padding-left: .3em; border-left-width: 2px; }
select { max-width: 40%; }