html {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 62.5%;
    line-height: 1.15;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4
}

body {
    background-color: rgb(18, 18, 18);
    font-size: 1.4rem;
    font-family: system-ui;
    line-height: 1.75rem;
    margin: 0
}

main {
    display: block
}

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

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent;
    cursor: pointer
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

img.emoji {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}


button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
input {
    overflow: visible
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],
[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

*,
:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    font-family: inherit;
    font-size: inherit
}

b,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
strong {
    margin: 0
}

a,
button {
    color: inherit;
    outline: none;
    text-decoration: none
}

button,
select {
    cursor: pointer
}

img,
picture {
    max-width: 100%;
    vertical-align: middle
}

button,
form,
input,
select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    margin: 0;
    outline: none;
    padding: 0
}

input[type=number] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

ol,
ul {
    list-style: none;
    padding: 0
}

ol,
p,
ul {
    margin: 0
}

svg {
    vertical-align: middle
}

figure {
    margin: 0
}

.hidden,
[hidden] {
    display: none !important
}

[contenteditable] {
    border: none;
    cursor: text;
    outline: none
}

::-webkit-scrollbar {
    width: 10px
}

::-webkit-scrollbar-thumb {
    background-color: rgb(48, 48, 48)
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgb(80, 80, 80)
}

/* STYLE */

a,
body,
button {
    color: rgb(185, 185, 185)
}

a:active,
a:focus-visible,
a:hover,
button:active,
button:focus-visible,
button:hover {
    color: rgb(196, 196, 196);
}

b,
h1,
h2,
h3,
h4,
h5,
h6,
strong {
    margin: 0
}

h1,
h2,
h3 {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 2rem
}

b,
h4,
h5,
h6,
strong {
    color: rgb(196, 196, 196);
    font-weight: 500
}

small {
    font-size: 1.2rem;
    line-height: 1.5rem
}

hr {
    border: solid rgb(32, 32, 32);
    border-width: .25rem 0 0;
    margin: 1.4rem 0
}

hr:first-child,
hr:last-child {
    display: none
}

body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 100vh
}

body>* {
    padding-left: 2rem;
    padding-right: 2rem;
    width: 100%
}

body>header,
body>main {
    margin: 0 auto;
    max-width: 136.6rem
}

body>main>section+section {
    margin-top: 1rem
}

body>footer,
body>header {
    padding-bottom: 1rem;
    padding-top: 1rem;
    position: relative
}

body>header nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: .6rem
}

body>header nav ul {
    font-size: 0
}

body>header nav ul:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    width: 0
}

body>header nav ul li {
    display: inline-block;
    vertical-align: top
}

body>header nav ul li a,
body>header nav ul li button {
    display: block;
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: .042rem;
    line-height: 2.8rem;
    padding: 0 .6rem
}

body>header nav ul li a:not(.profile),
body>header nav ul li button:not(.profile) {
    text-transform: uppercase
}

body>header nav ul li a svg,
body>header nav ul li button svg {
    margin-top: -.4rem
}

body>header nav ul li a span,
body>header nav ul li button span {
    display: none
}

body>header>div>form {
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .5rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    font-size: 0
}

body>header>div>form:hover {
    background-color: #1a1a1a;
    border-color: #222
}

body>header>div>form:focus-within {
    background-color: #1b1b1b;
    border-color: #232323
}

body>header>div>form button,
body>header>div>form input {
    display: inline-block;
    font-size: 1.4rem;
    height: 3.6rem;
    line-height: 1.75rem;
    vertical-align: top
}

body>header>div>form input {
    padding: .8rem 1.2rem;
    width: calc(100% - 3.6rem)
}

body>header>div>form input::-webkit-input-placeholder,
body>header>div>form input::-moz-placeholder,
body>header>div>form input:-ms-input-placeholder,
body>header>div>form input::-ms-input-placeholder,
body>header>div>form input::placeholder {
    color: #5e5e5e
}

body>header>div>form button {
    color: #5e5e5e;
    width: 3.6rem
}

body>header>div>form button:active,
body>header>div>form button:focus-visible,
body>header>div>form button:hover {
    color: #9e9e9e
}

body>header>div>button {
    background-color: #202020;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    display: none;
    padding: .6rem 1.2rem
}

@media (max-width: 768px) {
    body>header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        background-color: #181818;
        -webkit-box-shadow: 0 0 1.25rem rgba(0, 0, 0, .25);
        box-shadow: 0 0 1.25rem rgba(0, 0, 0, .25);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        margin-bottom: 2rem;
        padding: 0;
        position: sticky;
        top: 0;
        z-index: 100
    }

    body>header nav {
        -webkit-box-ordinal-group: 101;
        -ms-flex-order: 100;
        border-top: .2rem solid #202020;
        display: initial;
        margin-bottom: 0;
        order: 100
    }

    body>header nav ul {
        width: auto !important
    }

    body>header nav ul li {
        display: block
    }

    body>header nav ul li a,
    body>header nav ul li button {
        padding: .4rem 1rem;
        text-align: left;
        width: 100%
    }

    /*body>header nav ul li a svg,
    body>header nav ul li button svg {
        display: none !important
    }*/

    body>header nav ul li a span,
    body>header nav ul li button span {
        display: initial !important
    }

    body>header>div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    body>header>div form {
        -webkit-box-flex: 1;
        background-color: transparent;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        -ms-flex: 1 0;
        flex: 1 0;
        width: 0
    }

    body>header>div form button,
    body>header>div form input {
        height: 4rem
    }

    body>header>div form input {
        width: calc(100% - 4rem)
    }

    body>header>div form button {
        width: 4rem
    }

    body>header>div>button {
        display: initial
    }

    body>header nav:not(.expand) {
        display: none
    }
}

#nonce {
    margin: auto;
    text-align: center
}

#nonce button {
    font-size: 4rem;
    font-weight: 500;
    line-height: 5rem;
    text-transform: uppercase
}

.announcements {
    padding-bottom: 1rem;
    overflow: auto
}

.announcements>div {
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .4rem;
    padding: .8rem
}

.announcements>div>h2 {
    text-transform: uppercase
}

.announcements>div p~p {
    margin-top: 1.2rem
}

.announcements.ad>div {
    color: #ffb743;
    border: 0.1rem solid #ffb743;
}

#alert>div>h2>svg {
    animation: bell 2s infinite;
}
.announcements.btn>div>span {
    background-color: #121212;
    border: .1rem solid #202020;
    padding: .3em;
}
.announcements#ads{
    text-align: center;
    padding-bottom: 0;
}

.random>svg,
#random>svg {
    animation: random 2s infinite;
}

@keyframes bell {
    0% {
        transform: translate(0%, 0%);
    }

    5%,
    15% {
        transform: translate(0%, 0%) rotate(25deg);
    }

    10%,
    20% {
        transform: translate(0%, 0%) rotate(-25deg);
    }

    25% {
        transform: translate(0%, 0%) rotate(0deg);
    }

    100% {
        transform: translate(0%, 0%) rotate(0deg);
    }
}

@keyframes random {
    from {
        transform: rotate(360deg)
    }

    to {
        transform: rotate(0deg)
    }
}

.feed#archives,
.feed>header {
    text-align: center
}

.feed>header {
    margin-bottom: 1.2rem
}

.feed>header h2 {
    font-size: 2rem;
    line-height: 2.5rem
}

.feed>header h2:not(:last-child) {
    margin-bottom: 1.2rem
}

.feed>header .sort {
    font-size: 0;
    margin-top: -.4rem
}

.feed>header .sort>* {
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    display: inline-block;
    font-size: 1.4rem;
    height: 2.8rem;
    line-height: 1.75rem;
    margin-top: .4rem;
    padding: .4rem .8rem;
    vertical-align: top
}

.feed>header .sort>:not(:last-child) {
    margin-right: .4rem
}

.feed>header .sort>.active {
    font-weight: 500;
    text-decoration: underline
}

.feed>footer {
    margin-top: 1rem;
    text-align: center
}

.feed#archives .entries {
    font-size: 0;
    margin: -1.2rem -.6rem
}

.feed#archives .entry {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 2.75rem;
    padding: 1rem .5rem;
    vertical-align: top;
    width: 16.66667%
}

@media (max-width: 1220px) {
    .feed#archives .entry {
        width: 25%
    }
}

@media (max-width: 820px) {
    .feed#archives .entry {
        width: 33.33333%
    }
}

@media (max-width: 620px) {
    .feed#archives .entry {
        width: 50%
    }
}

@media (max-width: 320px) {
    .feed#archives .entry {
        width: 100%
    }
}

.feed#archives .entry figure {
    background-color: #181818;
    border-radius: .4rem;
    height: 0;
    overflow: hidden;
    padding-top: 150%;
    position: relative;
    margin-bottom: .5em;
}

.feed#archives .entry figure img {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    transition: .3s ease-in-out
}

.feed#archives .entry figure img:hover {
    transform: scale(1.1)
}

.feed#archives .entry button {
    background-color: #202020;
    border: .1rem solid #282828;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.75rem;
    margin-top: 1rem;
    padding: .4rem 1.2rem
}

.feed#archives .entry[data-hidden] figure img:not(:hover) {
    -webkit-filter: blur(25px);
    filter: blur(25px)
}

.feed#archives .entry figure .metadata {
    color: hsla(0, 0%, 100%, .8);
    font-size: 1.2rem;
    left: 0;
    line-height: 1.5rem;
    pointer-events: none;
    position: absolute;
    text-align: initial;
    text-transform: uppercase;
    top: 0;
    width: 100%
}

.feed#archives .entry figure .metadata>* {
    background-color: rgba(0, 0, 0, .8);
    font-weight: 500;
    padding: .4rem .6rem
}

.feed#archives .entry a:active figure .metadata>*,
.feed#archives .entry a:focus-visible figure .metadata>*,
.feed#archives .entry a:hover figure .metadata>* {
    background-color: rgba(0, 0, 0, .85);
    color: hsla(0, 0%, 100%, .9)
}


.feed#archives .entry>a>.metadata {
    color: #858585;
    margin-top: .6rem
}

.feed#archives .entry>a>.metadata>* {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.feed#archives .entry a:active>.metadata,
.feed#archives .entry a:focus-visible>.metadata,
.feed#archives .entry a:hover>.metadata {
    color: #919191
}

.feed#archives .entry .title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 2; /* Número de líneas visibles */
    -webkit-line-clamp: 2; /* Compatibilidad para navegadores basados en WebKit */
    white-space: normal;
    color: #9e9e9e;
    font-size: inherit
}

.feed#archives .entry .title:not(:last-child) {
    margin-bottom: .2rem
}

.feed#archives .entry a:active .title,
.feed#archives .entry a:focus-visible .title,
.feed#archives .entry a:hover .title {
    color: #c4c4c4
}

header .pagination:not(:first-child) {
    margin-top: .8rem
}

header .pagination:not(:last-child) {
    margin-bottom: .8rem
}

.pagination {
    margin-bottom: 1em;
}

.pagination ul {
    font-size: 0
}

.pagination ul li {
    display: inline-block;
    margin: 0 0.4rem;
    vertical-align: middle;
    font-size: initial;
    line-height: inherit
}

.pagination ul li a,
.pagination ul li span {
    display: block;
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    font-weight: 500;
    padding: .8rem 1.8rem
}

.pagination ul li a.active {
    background-color: #ffb743;
    border: .1rem solid #ffb743;
    color: #000;
    border-radius: .4rem;
}

.pagination ul li a:hover,
.pagination ul li a.active:active,
.pagination ul li a.active:focus-visible,
.pagination ul li a.active:hover {
    background-color: #ffb743;
    border: .1rem solid #ffb743;
    color: #000;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 1em #ffb743;
    box-shadow: 0 0 1em #ffb743;
}

.feed#taxonomy .entries {
    font-size: 0;
    margin: -.4rem
}

.feed#taxonomy .entry {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.75rem;
    padding: .4rem;
    vertical-align: top;
    width: 25%
}

@media (max-width: 1024px) {
    .feed#taxonomy .entry {
        width: 33.33333%
    }
}

@media (max-width: 640px) {
    .feed#taxonomy .entry {
        width: 50%
    }
}

@media (max-width: 448px) {
    .feed#taxonomy .entry {
        width: 100%
    }
}

.feed#taxonomy .entry a {
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.feed#taxonomy .entry a>* {
    display: inline-block;
    padding: .6rem 1.2rem;
    vertical-align: top
}

.feed#taxonomy .entry a span:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 0
}

.feed#taxonomy .entry a span:last-child {
    background-color: #202020;
    border-left: .1rem solid #282828
}

.feed#taxonomy.collections .entry {
    width: 100% !important
}

.cover {
    width: 100%;
    height: 0;
    background-size: cover;
    background-position: center;
    text-align: center;
    box-sizing: border-box;
}

#archive>.wrapper {
    border-bottom: .2rem solid #202020;
    clear: both;
    margin-bottom: 1.2rem;
    overflow: hidden;
    padding: 3.2rem;
    position: relative
}

#archive aside {
    float: left;
    margin-right: 1.2rem;
    max-width: 25.6rem;
    width: 35%
}

#archive aside figure {
    background-color: #181818;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    height: 0;
    overflow: hidden;
    padding-top: 150%;
    position: relative
}

#archive aside figure a {
    height: 100%;
    width: 100%
}

#archive aside figure a,
#archive aside figure div {
    left: 0;
    position: absolute;
    top: 0
}

#archive aside figure div span {
    background-color: rgba(0, 0, 0, .8);
    border-radius: .4rem;
    color: #fff;
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.5rem;
    margin: .6rem;
    padding: .6rem .8rem
}

#archive section.metadata {
    overflow: hidden;
    color: #fff;
}

#archive section.metadata h3 {
    color: rgb(241 241 241 / 50%)
}

#archive section.metadata table ,
#archive section.metadata table a{
    font-size: 1.5rem;
    line-height: 2.1rem;
    color: #ffffff;
}

#archive section.metadata table td {
    vertical-align: top
}

#archive section.metadata table td:first-child {
    font-weight: 600;
    width: 15rem
}

.animated-arrow {
    animation: arrowMove 1s infinite ease-in-out;
  }

  @keyframes arrowMove {
    0% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(4px);
    }
    100% {
      transform: translateY(0);
    }
  }

#archive section.metadata table td:last-child {
    word-break: break-word
}

#archive section.metadata .title {
    font-size: 2rem;
    line-height: 2.5rem;
    margin-bottom: .4rem
}

#archive .actions>* {
    display: inline-block;
    vertical-align: top
}

#archive .actions>:not(:last-child) {
    margin-right: .4rem
}

#archive .actions a,
#archive .actions button {
    background-color: #181818;
    border: .1rem solid #202020;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    font-size: 1.4rem;
    line-height: 1.75rem;
    margin-top: .4rem;
    padding: .6rem 1rem
}

#archive .actions a.active,
#archive .actions button.active {
    border: .1rem solid #303030;
    color: #c4c4c4
}

/*#archive section.metadata .tags {
    border-top: .2rem solid #202020;
    font-size: 0;
    margin-top: .4rem
}*/

#archive section.metadata .tags a {
    border-radius: .5em;
    display: inline-block;
    padding: .3em 1em;
    margin-bottom: .2em;
    vertical-align: top;
    color: white;
    backdrop-filter: blur(1em);
    background-color: rgb(255 255 255 / 11%);
}

#archive section.metadata .tags a:not(:last-child) {
    margin-right: .4rem
}

#archive section.metadata .tags a[href*=crossdress],
#archive section.metadata .tags a[href*=yaoi] {
    color: #e53935
}

#archive .previews {
    font-size: 0;
    margin: -.6rem
}

#archive .previews>* {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.75rem;
    padding: .6rem;
    vertical-align: top;
    width: 16.66667%
}

@media (max-width: 1024px) {
    #archive .previews>* {
        width: 20%
    }
}

@media (max-width: 896px) {
    #archive .previews>* {
        width: 25%
    }
}

@media (max-width: 768px) {
    #archive .previews>* {
        width: 33.33333%
    }
}

@media (max-width: 640px) {
    #archive .previews>* {
        width: 50%
    }
}

@media (max-width: 320px) {
    #archive .previews>* {
        width: 100%
    }
}

#archive .previews>* a {
    background-color: #181818;
    border-radius: .4rem;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    display: block;
    height: 0;
    overflow: hidden;
    padding-top: 150%;
    position: relative
}

#archive .previews>* a:active,
#archive .previews>* a:focus-visible,
#archive .previews>* a:hover {
    -webkit-filter: brightness(.85);
    filter: brightness(.85)
}

#archive .previews>* a img {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

#archive .previews>* a img.lazy {
    display: none
}

#archive .collections .title {
    white-space: normal !important
}

@media (max-width: 768px) {
    #archive aside {
        float: none;
        margin-right: 0;
        max-width: none;
        width: 100%
    }

    #archive section.metadata {
        margin-top: 1rem;
        width: 100%
    }
}

#t_post {
    text-transform: uppercase;
}

.permalinkdd,
.permalinkdd:hover {
    background-color: #ffb743!important;
    color: #000;
}

.vip {
    box-shadow: 0 0 10px #ffb743;
    outline: 2px solid #ffc034;
}

.elite {
    box-shadow: 0 0 10px #23f6ff;
    outline: 2px solid #23f6ff;
}


.vip a.float::before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAAAHYAAAB2AH6XKZyAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABBhJREFUeJztms9rHGUYxz/PTLq7RFNsKnjppdD20F7SU4qRmm42sRsRsRAbRXoRcmrJwX9gDwVPQqkXEYv1INhKlYDZTa2LgVC0JgdRUWuKehAFGzchtqWG7DweQjY7s+/uzmSzs81mPqfleX883+fZ93nfeYeBiIiIiIiIiIgWoNl0XLPpeCs1WK1wqopoNvU2srKErCxpLnlRFWmFlpY41amBcZQLHvO4pPMXw9YSegL0+tB+nOJ3wOOepgfYVo8M3ZgPU0+oJaCZjIWz+j6VwQN0UnQuayYTqqZw94BjM+dAnq3R42l6Z86GpocQS6DG0vcSaim4VoBeHbH16oi91U40k7HQ4mXqBw/QieO814xSMMVXcqK5gdfoKiyyu7CgudTYlnrunTmLctx3f+X4VpeC5lJj7C4s0FVY1FzylXW7bHQYWAD2lo35iJWHY/LizX8bcjzVfwC1vwUeCzj0PlLskZPTdxryP9HXRSzxLjBaZv5b0vmnwF0C3v1glFhiTicHezbtPJOxwL5E8OBZG2NfaqQUdHKwh1hiDnfwAB3rPzYmFzFtOoewnK90amB8UwqOzZwLtPS9NFAKmk2dwXJuAocMzb+s/9hIgOrPVeZKoFzQXPKaftr/hG8B14f2o5z3278Gb+rngwd9+53o69Js8kNEPwA6q3QrxVq+vG7XnlpOEbe/8VMSAXf9evh+QNLswGFiia8RebV2TynFapmM1cdx0FdJNLr0K6n7gKTZ1BmEWeBw/emcUqwbp8DUiSOo9YN/TfoJD53X5aXpJZfV/wNPUIwPSDrR18Wu+Dv1//XyQRyR4fyPUL4Clp+cB1b965FTJOxbmk0dLc079Vw3TvEaWx88rJXCFf3smT0lf9nUUWKJuUDBwyr3uktHq+vo01xqHvRAQGEOSh70LmKlQffUH9IQBYQbKHuBJIHvM3JH0l+UNtUOd6PeBoImwEIYXMulBhy6KbpRTm96tOe0c2dPqXYUtg8iNRLg5yTY7ojjitGzApz2T4DnT3YnIL4TVoDtirHihYjmUoUQdvLWICzJybwrNsMRou27CpSfvCbTGdq+CTDEtsMSULnHGRLQzhth5SlXmYDq7wW2P0WrIrbKBKxdFAJcirYNq1i7fvUaKxIgL3+8AvJ7KJLCRPlNhnP/ec3mm1Q7loGY7znVrpJtuBGaN/cOkxHhe5DFpuoJHQ3wtisiImKnYPw+QCdP9GLZb4Qtpqk4xbfk+S9vec3mU8C296E60nRRYWLbV4CKBLTkM7lHiSgBrRbQaqIEGK2O8yBkHSGg901WcwKKziyw3Ew5IbNMB7OmBmMC5IXpBVRHgb+aKisc/kQ4Lan8P6bGuh9KarZ/H05HbOt1hYC1uiLD03+0WkZERERERETEo8n/calfp9kSpKUAAAAASUVORK5CYII=);
}

.elite a.float::before {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAVdJREFUeNrsm0sSgjAMhmmGjV5Db+TZuIVH0mvoMrIQR3nJIylD+2XFDLVNvv4JKYNBVYucTYrMDQAAAAAAAJCzlc3F+bnJ+k0TEmIvfDtsq4DqK/gGRLWFI6HpBCMrYKj9DDkoQBfe238RrLf3ajFmtwDq7b1YjNkrAHUaawpAPRZfImunVOjEJwPUNbb0I6RCb3wyh1YE6Xukwmgc4umEhYxXzqFza4ApBAsZr5hjks9iJSXnSq5efoqHMx4VfOKcs6GLx454NDMT5lykOFkpS43cxKj100qMnYrRwZmuV7aOouqREhu31aPHbt4JAgAAAABAX3VM2AIKAAAAAAAAAAwDSPlRGFAAAADwY58XIvdjyKslfn8XQQoAgBrQtdMjzU/I6zpHHwAAAAAAAAAAwH8AKZ4FwuRGqPUDTTHwDoCR/w+mo4aeGKkBAAAAAAAAgIztJcAA5M9ZZCRouakAAAAASUVORK5CYII=)
}

.vip a.float::before,
.elite a.float::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}


.vip a.float {
    color: #ffb743;
}

.elite a.float {
    color: #23f6ff;
}

.vip a.float,
.elite a.float {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-weight: bolder;
    background-color: #0000008c !important;
    padding: 0 1em;
    border-radius: 0.5em;
    position: absolute;
    top: 0.5em;
    left: 0.5em;
}

#reader {
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    text-align: center
}

#reader img {
    transition: opacity 0.5s ease-in-out;
}

#reader footer,
#reader header {
    background-color: #181818;
    border: 0 solid #202020;
    border-width: .1rem 0;
    -webkit-box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .25rem rgba(0, 0, 0, .25);
    height: 3.6rem;
    padding: 0;
    position: relative;
    white-space: nowrap
}

#reader nav .actions>*,
#reader nav>:not(.actions) {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 1.75rem;
    padding: .8rem 1.2rem;
    vertical-align: top
}

#reader nav .back {
    left: 0;
    position: absolute;
    top: 0
}

#reader .current,
#reader .total {
    font-weight: 600
}

#reader .actions {
    position: absolute;
    right: 0;
    top: 0
}

#reader nav .zoom-level {
    padding-left: 0;
    padding-right: 0
}

#reader>.main {
    -ms-flex: 1 0;
    flex: 1 0;
    min-height: calc(100vh - 7.2rem)
}

#reader>.main,
#reader>.main a {
    -webkit-box-flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

#reader>.main a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex: 1 0;
    flex: 1 0
}

#reader>.main a div {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    position: relative
}

#reader.size {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    overflow: hidden;
}

#reader.size img {
    max-height: 100vh;
    width: auto;
}

@media (max-width: 768px) {

    #reader nav .zoom-in,
    #reader nav .zoom-level,
    #reader nav .zoom-out {
        display: none
    }
}

body>footer {
    margin-top: auto;
    text-align: center
}

body>footer nav ul {
    font-size: 0
}

body>footer nav ul li {
    display: inline-block;
    vertical-align: top
}

body>footer nav ul li a {
    display: block;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2.8rem;
    padding: 0 .4rem
}

body>footer span {
    text-transform: uppercase;
}

body>footer .gen {
    font-size: 1.2rem;
    line-height: 1.8rem;
    margin-top: 1.2rem
}

body>footer .gen .cache {
    margin-top: .4rem
}

/* Estilos generales para los comentarios */
.comment {
    background-color: #1f1f1f; /* Fondo oscuro para cada comentario */
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    color: #ccc; /* Color de texto gris claro */
    font-family: 'Arial', sans-serif;
    position: relative;
}

/* Avatar y nombre del autor */
.comment .comment-author {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.comment .comment-author img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-right: 12px;
}

.comment .comment-author svg {
    margin-right: 8px;
}

.comment .comment-author cite {
    font-weight: bold;
    color: #fff;
}

/* Información de la fecha */
.comment .comment-meta {
    font-size: 0.9em;
    color: #777;
    margin-bottom: 12px;
}

/* Texto del comentario */
.comment .comment-text {
    font-size: 1em;
    line-height: 1.5;
    color: #ddd; /* Color de texto de los comentarios */
}

/* Estilo para las respuestas */
.reply {
    display: inline-block;
    background-color: #181818;
    padding: .5em 1em;
    border-radius: .5em;
    margin-top: 1em;
}

/* Estilo del enlace de respuesta */
.comment .reply a {
    color: #b3b3b3; /* Verde suave */
    text-decoration: none;
    font-weight: bold;
}

.comment .reply a:hover {
    color: #fff; /* Azul suave al pasar el ratón */
}

/* Comentarios anidados */
.children {
    margin-left: 1em;
    padding-left: 1em;
    border-left: 2px solid #333;
}

/* Estilos para el formulario de comentarios */
.comment-form {
    margin-top: 20px;
    background-color: #222;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.comment-form input, .comment-form textarea {
    background-color: #333;
    color: #fff;
    border: 1px solid #444;
    padding: 10px;
    border-radius: 4px;
    width: 100%;
    margin-bottom: 12px;
}

.comment-form input:focus, .comment-form textarea:focus {
    outline: none;
    border-color: #ffb743; /* Verde suave en foco */
}