@font-face {
  font-family: 'Archivo';
  src: url("../font/Archivo.woff2");
}

*,
*::before,
*::after {
  box-sizing: border-box
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
pre,
ul,
li {
  margin: 0;
  padding: 0
}

ul,
ol,
li {
  list-style: none
}

a:not([class]) {
  text-decoration-skip-ink: auto
}

em,
i {
  font-style: normal;
}

img {
  display: block;
  height: auto;
  max-width: 100%
}

li img,
p img {
  display: inline-block;
  vertical-align: sub
}

input,
button,
textarea,
select {
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit
}

.overflow-hidden {
  overflow: hidden;
}

:root {
  --color-core: #e879f9; /* Fuchsia 400 */
  --color-core-bg: #121212; /* Darker background */
  --color-core-header: #1a1a1a; /* Darker header/panel background */
  --color-header-text: #dcdcdc; /* Light text */
  --color-core-text: #dcdcdc; /* Main text color */
  --color-stroke: #333; /* Darker Borders */
  --color-core-a: #cccccc; /* Default link color */
  --color-bg: #1a1a1a; /* Darker Panel background */
  --color-border-tb: #333; /* Darker Top/bottom border */
  --color-lz: #aaa; /* Serializing status */
  --color-wj: #e879f9; /* Green 400 for completed status */
  --color-btn-solid-bg: #3b82f6; /* Blue 500 for buttons */
  --color-new-chapter: #3b82f6; /* Blue 500 */
  --color-author: #aaa; /* Author text */
  --color-ac: #e879f9; /* Green 400 */
  --color-app-icon: #a4c639;
  --color-app-a: #929292;


  --width-core-division: .5em;
  --width-core-division-double: 1em;
  --width-core-division-trip: 1.5em;
  --width-core-padding: 0 .5em;

  --line-division-border: 1px solid var(--color-stroke);
}

@font-face {
  font-family: "icon";
  /* Project id 3545497 */
  src:
    url('data:font/ttf;charset=utf-8;base64,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') format('truetype');
}

.icon {
  font-family: "icon" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-end:before {
  content: "\e742";
}

.icon-category:before {
  content: "\e67c";
}

.icon-home::before {
  content: "\e6b8";
}

.icon-rank::before {
  content: "\e722";
}

.icon-my::before {
  content: "\e78b";
}

.icon-menu::before {
  content: "\e602";
}

.icon-search::before {
  content: "\e620";
}

.icon-close::before {
  content: "\e60e";
}

.icon-arrow-d::before {
  content: "\e606";
}

.icon-arrow-r::before {
  content: "\e60c";
}

.icon-android::before {
  content: "\e61d";
}

.icon-ios::before {
  content: "\e6d9";
}



@font-face {
  font-family: "readicon";
  /* Project id 3560620 */
  src: url('data:font/ttf;charset=utf-8;base64,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') format('truetype');
}

.readicon {
  font-family: "readicon" !important;
  font-size: 1.125rem;
  font-style: normal;
}

.icon-arrow-r::before {
  content: "\e60c";
}

.icon-return::before,
icon-arrow-l::before {
  content: "\e60d";
}

.icon-readset::before {
  content: "\e62a";
}

.icon-catalog::before {
  content: "\e628";
}

.icon-check:before {
  content: "\e62c";
}

.icon-day::before {
  content: "\e629";
}

.icon-night::before {
  content: "\e684";
}

.icon-progress::before {
  content: "\e61e";
}

.icon-up::before {
  content: "\e610";
}

.icon-down::before {
  content: "\e60e";
}

body {
  font-family: 'Archivo', "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
  line-height: 1.5;
  font-size: clamp(1rem, 0.96rem + 0.18vw, 1.125rem);
  overflow-x: hidden;
  background-color: var(--color-core-bg);
  outline: 0;
}

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

em {
  color: var(--color-ac);
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 3em;
  padding: 0 clamp(1.375rem, 1.2rem + 0.89vw, 2rem);
  border-bottom: 1px solid var(--color-stroke);
  line-height: 1;
  background-color: var(--color-core-header);
  color: var(--color-header-text);
}

.header_box_contaienr {
  position: sticky;
  top: 0;
  z-index: 9;
}

.logo {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.logo svg {
  width: 1.8em;
  height: 1.8em;
}

.logo-n {
  flex: 1;
}

.logo-n a {
  margin-left: var(--width-core-division);
  color: var(--color-header-text);
}

.search {
  flex: 2;
}

/* Beautified Search Box */
.s-inp {
    border: 1.5px solid var(--color-stroke);
    border-radius: 1.5em;
    position: relative;
    display: flex;
    max-width: 22em;
    background: #23232b;
    box-shadow: 0 2px 12px 0 rgba(0,0,0,0.10);
    overflow: hidden;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.s-inp:focus-within {
    border-color: var(--color-core);
    box-shadow: 0 4px 16px 0 rgba(232,121,249,0.10);
}
.s-inptext {
    width: 15em;
    border: none;
    background: transparent;
    color: var(--color-header-text);
    height: 2em;
    padding: 0 1em;
    outline: none;
    font-size: 1.05em;
    border-radius: 1.5em 0 0 1.5em;
    transition: background 0.2s;
}
.s-inptext:focus {
    background: #29293a;
}
.s-button {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border: none;
    background: linear-gradient(45deg, #7c3aed, #e879f9);
    font-size: 1em;
    height: 2em;
    min-width: 2em;
    padding: 0 1em;
    border-radius: 0 1.5em 1.5em 0;
    margin: 0;
    cursor: pointer;
    box-shadow: 0 2px 8px 0 rgba(232,121,249,0.08);
    transition: background 0.18s, box-shadow 0.18s;
}
.s-button:hover, .s-button:focus {
    background: linear-gradient(45deg, #a21caf, #e879f9);
    box-shadow: 0 4px 16px 0 rgba(232,121,249,0.15);
}
.s-button svg {
    width: 1.1em;
    height: 1.1em;
    display: block;
}

@media (max-width: 600px) {
    .s-inp {
        max-width: 100%;
    }
    .s-inptext {
        width: 100%;
        min-width: 0;
        font-size: 1em;
    }
}

.user {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.user a {
  color: var(--color-header-text);
}



.search .icon-close {
  display: none;
}

header .s-show {
  display: flex;
  width: 100%;
  max-width: 750px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  line-height: 1;
  background-color: var(--color-core-header);
  min-height: 3em;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}

.s-show .icon-close {
  display: block;
  margin: 0 var(--width-core-division-double);
  color: var(--color-header-text);
}

.n-nav .n-close {
  display: none
}

.n-show .n-nav .n-close {
  display: block;
}


.n-show .icon-close {
  position: absolute;
  top: 0.2em;
  right: 0.2em;
  font-size: 2em;
}

.n-show:before {
  opacity: 1;
}

.n-show {
  display: block;
}

.n-show .n-nav {
  opacity: 1;
  left: 0;
  transform: translateX(0);
  transition: transform 200ms linear;
}

main {
  margin: 0 auto;
  width: 96%;
  z-index: -1;
}

.panel {
  border-radius: 8px;
  width: 100%;
  color: var(--color-core-text);
  background-color: var(--color-bg);
  padding: var(--width-core-division-double);
  margin-top: var(--width-core-division-double);
  border: 1px solid var(--color-stroke);
  box-shadow: none;
}

.panel-g {
  margin-top: var(--width-core-division-double);
  flex-flow: row wrap;
}

.panel h2,
.panel h1 {
  font-size: 1.125em;
  min-height: 2em;
  border-bottom: 1px solid var(--color-border-tb);
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1em;
}

.panel__more-link {
    float: right;
    font-size: 0.8em;
    line-height: 2em;
    color: var(--color-core-a);
    font-weight: normal;
}

.book-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1.5em;
}

.book-card {
    display: flex;
    flex-direction: column;
    background-color: #242424;
    border-radius: 12px;
    padding: 1rem;
    border: 1px solid #333;
    transition: border-color 0.2s ease-in-out;
}

.book-card:hover {
    border-color: var(--color-core);
}

.book-card__cover-link {
    display: block;
    margin-bottom: 0.75em;
}

.book-card__cover {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    border-radius: 8px;
    background-color: #333;
}

.book-card__info {
    text-align: left;
}

.book-card__title {
    font-size: 1em;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0.25em;
    /* Two lines of text */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 2.6em; /* 1.3 * 2 */
}


.book-card__title a {
    color: var(--color-core-text);
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}

.book-card__author,
.book-card__author a {
    font-size: 0.875em;
    color: var(--color-author);
}

.book-list {
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}

.book-list-item {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 1.5em;
    align-items: flex-start;
    background-color: #242424;
    border-radius: 12px;
    padding: 1.2rem;
    border: 1px solid #333;
    transition: border-color 0.2s ease-in-out;
}

.book-list-item:hover {
    border-color: var(--color-core);
}

.book-list-item__cover {
    width: 150px;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    border-radius: 6px;
    background-color: #333;
}

.book-list-item__info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.book-list-item__title {
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: 0.3em;
}

.book-list-item__title a {
    color: var(--color-core-text);
}


.book-list-item__author {
    font-size: 0.9em;
    color: var(--color-author);
    margin-bottom: 0.5em;
}

.book-list-item__description {
    font-size: 0.9em;
    color: #a0a0a0;
    line-height: 1.5;
    margin-bottom: 0.75em;
    /* Three lines of text */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.book-list-item__meta {
    display: flex;
    gap: 0.75em;
    align-items: center;
    font-size: 0.8em;
}

.meta-tag {
    background-color: #383838;
    color: #ccc;
    padding: 0.2em 0.6em;
    border-radius: 4px;
    border: 1px solid #484848;
}

.meta-tag.completed {
    color: var(--color-core);
    border-color: var(--color-core);
}

.meta-tag.serializing {
    color: var(--color-lz);
    border-color: var(--color-lz);
}

.u-img {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
}

.u-img li,
.u-list li {
  margin-top: var(--width-core-division-double);
}

.u-img img,
.u-list img {
  box-shadow: none;
  display: block;
  margin: 0 auto 1em;
  width: 7.5em;
  height: 10em;
  border-radius: 4px;
}

.bname {
  font-size: 1em;
  overflow: hidden;
  /* height: 1.4em; */
}

.bname a {
  color: var(--color-core);
}

.u-img .bauthor {
  font-size: .8rem;
}

.u-list li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: var(--line-division-border);
}

.u-list li:last-child {
  border-bottom: 0;
}

.u-list .bookshelf-del,
.u-list .record-del {
  color: var(--color-core);
  padding-right: var(--width-core-division);
}

.l-text {
  margin-left: var(--width-core-division-double);
  display: flex;
  justify-content: flex-start;

  width: calc(100vw - 8em);
}

.l-p1 {
  font-size: .8em;
  color: var(--color-core-a);
}

.l-p1 span {
  padding-right: var(--width-core-division-double);
}

.l-p1 .bauthor:after,
.l-p1 .size:after {
  content: "";
  border-right: 1px solid var(--color-border-tb);
  padding-left: var(--width-core-division-double);
}

.bauthor a {
  color: var(--color-author);
}

.l-p2 {
  height: 8em;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-all;
  overflow: hidden;
  font-size: .8em;
  padding: var(--width-core-division-double) 0;
}

.l-last {
  font-size: .8em;
  color: var(--color-core-a);
}

.l-last .l-time {
  padding-left: var(--width-core-division);
}

.lz {
  color: var(--color-lz);
}

.end {
  color: var(--color-wj);
}

.l-btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.l-btn span {
  width: 8em;
  margin-bottom: var(--width-core-division-double);
}

.btn-solid {
  background-color: var(--color-btn-solid-bg);
  color: #fff;
  font-size: .7em;
  text-shadow: 0px 0px 0px #f2f2f2;
  background-clip: padding-box;
  text-align: center;
  border-radius: 3px;
  padding: var(--width-core-division-double);
}

.btn-solid a {
  color: var(--color-header-text);
}

.btn-normal {
  border: 1px solid var(--color-btn-solid-bg);
  color: var(--color-btn-solid-bg);
  font-size: .6em;
  text-shadow: 0px 0px 0px #f2f2f2;
  background-clip: padding-box;
  text-align: center;
  border-radius: 3px;
  padding: .9em .4em;
}

.btn-normal a {
  color: var(--color-btn-solid-bg);
}



.u-line li {
  display: flex;
  flex-flow: row wrap;
  align-content: flex-start;
  justify-content: space-between;
  padding-top: var(--width-core-division);
}

.l-nchapter a {
  color: var(--color-new-chapter);
}

.l-ntime {
  color: var(--color-core-a);
}

.l-author {
  height: 1.4em;
  overflow: hidden;
}

footer {
  padding: var(--width-core-division-double);
  margin-top: var(--width-core-division-double);
  position: relative;
  width: 100%;
  background: var(--color-bg);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.f-nav {
  display: flex;
  justify-content: center;
}

.f-nav a {
  margin-right: var(--width-core-division-double);
}

.breadcrumbs {
  font-size: 1em;
}

.breadcrumbs ul {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.breadcrumbs li {
  display: flex;
  align-items: center;
  white-space: nowrap;
}

.breadcrumbs li:last-child {
  overflow: hidden
}

.breadcrumbs li+li::before {
  content: "";
  display: block;
  width: 8px;
  min-width: 8px;
  height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  opacity: .8;
  margin: 0 4px 0 3px;
}

.novel {
  display: grid;
  margin-top: var(--width-core-division-double);
}

.n-img {
  position: relative;
}

.n-img img {
  width: 7.5em;
  height: 10em;
}

.n-text {
  margin-left: var(--width-core-division);
  color: var(--color-core-a);
}

.n-text h1 {
  font-size: 1.2em;
  color: var(--color-core);
  overflow: hidden;
}

.n-text p {
  margin-top: var(--width-core-division);
  overflow: hidden;
  height: 1.4em;
  font-size: .8em;
}

.nsort::after {
  content: "";
  border-right: 1px solid var(--color-border-tb);
  padding-left: var(--width-core-division);
  font-size: .8em;
}

.trend::before {
  content: "";
  border-left: 1px solid var(--color-border-tb);
  padding-right: var(--width-core-division);
  font-size: .8em;
}

.novel .trend,
.novel .lz,
.novel .end {
  padding-left: var(--width-core-division);
}

.n-btn {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.n-btn span {
  margin-top: var(--width-core-division-double);
}

.n-btn span a {
  display: block
}

.pintro {
  line-height: 1.4em;
  padding: var(--width-core-division);
  text-align: justify;
  position: relative;
  color: var(--color-app-a);
}

.c-more {
  position: absolute;
  bottom: 0.01rem;
  right: 0.04rem;
  color: var(--color-core);
}

#intro.showmore {
  height: auto;
  max-height: none;
}

.catalog {
  position: relative;
}

.catalog .sub-text {
  margin-left: var(--width-core-division);
  overflow: hidden;
  max-width: 12em;
  height: 1.2em;
  position: absolute;
  top: 1px;
  font-weight: 400;
}

.catalog .sub-text-r {
  font-size: .8em;
  color: var(--color-core-a);
  position: absolute;
  right: 18px;
  top: 3px;
  font-weight: 400;
}

.catalog .icon-arrow-r {
  position: absolute;
  top: 1px;
  right: 4px;
  color: var(--color-core-a);
  font-weight: 400;
}

.u-chapter {
  display: grid;
}

.u-chapter li {
  padding-top: var(--width-core-division-double);
  height: 2.2em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.clist {
  display: none;
}

.s-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--width-core-division);
}

.s-title {}

.s-right {
  display: flex;
  align-items: center;
  color: var(--color-core);
}

#s-icon {
  width: 12px;
  height: 12px;
  margin-right: 7px;
  position: relative;
  top: 1px;
}

.s-no-reverse {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTLi4uB8fHy0tLb+/v9vb2x8fH7m5uSEhIR8fH7m5ub+/vx8fH7i4uLi4uLi4uCAgILm5ubi4uB8fHx8fHx8fH7i4uPboej8AAAAVdFJOUwCnvwogA3LbLs6rCpLEkI6vZ/DqKMsPV9AAAABySURBVHja7c45EoAgFARRcFfclX//o0oZGNAUWGVAYkcTvGBUtppjfXYrUgWNtfYEorEdEAwRDRFN0QPRlEQ0Ko7G2xB5ypkkUs6kkfrRN2ReoHkySTSLeIpoERFdxxENkaYhggmjAQYIhoiGaNvdn1xdHlQRVjqEnzMAAAAASUVORK5CYII=) 100%/100% no-repeat;
}

.s-reverse {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABIUExURUdwTLi4uB8fHy0tLR8fH8nJyR8fH7m5uSEhIb+/vx8fH7i4uLm5ubi4uLi4uB8fH7i4uLm5uR8fHyAgILi4uCAgIB8fH7i4uCb0D+YAAAAWdFJOUwCpvwrNBXHbLiCSxJCO8OqiZiiv1dantLmvAAAAcUlEQVR42u3KNw6AQBDAwD1yzuz+/6egk2gw4pAoaHDlYuSz0qEbjy9Uk0vjzBYgGsuBaIhoiGgcEE1bAtFIANVmjRCdVSNhlEoA+X70DsUPUBxVIbQb1eoeeaPZPaIhWmmIFIaIhoiGaKIhkrnP5Ks27KUR2ehySvkAAAAASUVORK5CYII=) 100%/100% no-repeat;
}

.s-text {}

#goBack {
  position: fixed;
  z-index: 999;
  right: 24px;
  bottom: 24px;
  text-align: center;
  background: #fbfbfb;
  cursor: pointer;
  width: 44px;
  height: 44px;
  line-height: 44px;
  border-radius: 50%;
  display: none;
}

#goBack::before {
  font-family: "icon" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: initial;
  display: inline-block;
  content: "\e713";
  font-size: 24px;
  color: #515151;
}

.s-box {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.s-box span {
  font-weight: 700;
  margin-right: var(--width-core-division);
}

.s-box a {
  margin-top: var(--width-core-division);
  margin-right: var(--width-core-division);
}

.ac {
  background: var(--color-ac);
  color: var(--color-header-text);
  padding: 0 var(--width-core-division);
}


.page {
  text-align: center;
  margin: var(--width-core-division-double) auto;
}

.pagei {}

.pagei li {
  margin: 0 3px;
  padding: 0 var(--width-core-division);
  border: var(--color-border-tb) 1px solid;
  line-height: 27px;
  height: 27px;
  background: var(--color-bg);
  border-radius: 3px;
  display: inline-block;
}

.pagei .active {
  background: linear-gradient(45deg, #7c3aed, #4f46e5);
  color: var(--color-header-text);
}

.pagei .active a {
  color: inherit;
}


.form-group {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.form-group p {
  margin-top: var(--width-core-division-double);
}

.form-group input {
  min-width: 16em;
  border: 1px solid #ccc;
  padding: var(--width-core-division);
  border-radius: 3px;
}

.btn {
  border: 0;
  background-color: var(--color-btn-solid-bg);
  color: var(--color-bg);
  text-shadow: 0px 0px 0px #f2f2f2;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  height: 2em;
  line-height: 2em;
  min-width: 16em;
  text-align: center;
  border-radius: 3px;
}

.whitespace a {
  color: var(--color-stroke);
}

.loading-wrap {
  margin-top: var(--width-core-division-double);
  display: flex;
  justify-content: space-around;
  align-items: center;
}

a.reg {
  color: var(--color-btn-solid-bg);
}

.input-ab {
  position: relative;
}

.vercode {
  position: absolute;
  right: 0;
  height: 2.6em;
  width: 4em;
}

.tags em:first-child {
  margin-left: 0.3em;
}

.tags em {
  margin-right: 0.3em;
}

.tags a {
  color: var(--color-ac);
}





.loading-block {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: -webkit-box;
  -webkit-box-orient: horizontal;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  background: rgba(0, 0, 0, 0.4);
  background: transparent;
}

.loading-block .loading-msg {
  top: 10em;
  padding: 0.5em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-align: center;
  text-align: center;
  background: rgba(0, 0, 0, 0.65);
  border-radius: 3px;
  color: #fff;
  position: absolute;
}

.form-group .disabled {
  border: 0;
  color: #bbb;
  background: #e9ebec;
}


.disabled {
  pointer-events: none;
}

.s-line li {
  padding: var(--width-core-division) 0;
  border-bottom: 1px solid var(--color-border-tb);
}



.islogin::before {
  content: "";
  border: 1px solid #e9e9e9;
  border-radius: 50%;
  width: 1.5em;
  height: 1.5em;
  position: absolute;

}


.readend {
  margin-top: var(--width-core-division-double);
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}

.readend .btn {
  padding: 0 var(--width-core-division);
}



.app {
  margin-top: var(--width-core-division-double);
}

.app .icon {
  color: var(--color-app-icon);
  margin-right: var(--width-core-division-double);
}

.app a {
  color: var(--color-app-a);
}

@media (max-width: 360px) {

  .n-btn .btn-solid {
    min-width: 11em;
  }
}

.wide-text,
.search {
  display: none;
}

.logo-n {
  display: none;
}

.page-n {
  display: block;
}

.menu,
.i-search {
  display: block;
  color: var(--color-header-text);
}

.menu {
  margin-right: var(--width-core-division-double);
}

.i-search {
  margin-left: var(--width-core-division-double);
}

nav {
  display: none;
}

nav::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, .4);
  backdrop-filter: blur(5px);
  z-index: 1;
}

.n-nav {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  box-shadow: 2px 0 12px rgb(0 0 0 / 40%);
  background: var(--color-core-bg);
  position: absolute;
  height: 100vh;
  width: 15em;
  left: 0;
  transform: translateX(-100%);
  transition: transform 200ms linear;
  top: 0;
  opacity: 0;
  z-index: 9;
}

.n-nav span {
  padding: var(--width-core-division-double) 0;
  color: var(--color-ac);
}

.n-nav a {
  color: var(--color-ac);
  padding-left: var(--width-core-division);
}

/* .n-nav .n-close {
  color: var(--color-core-header);
} */

.u-img img {
  width: 6.2em;
  height: 8.2667em;
}

.u-list img {
  width: 4.8em;
  height: 6.4em;
}

.u-img .bname {
  max-width: 5em;
}

.l-text {
  flex-direction: column;
}

.l-p1,
.l-last {
  padding: 4px 0;
}

.l-p2 {
  height: 1.6em;
  padding: 0;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
}

.l-lnt {
  display: none;
}

.l-btn,
.n-btn {
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.l-btn span {
  width: 11em;
  padding: 0.3em;
  margin-right: var(--width-core-division-double);
}

.n-btn .btn-share {
  min-width: 3em;
}

.l-name {
  max-width: 10em;
}

.l-lchapter,
.l-ltime {
  overflow: hidden;
  display: inline-block;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.u-line li {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
}

.l-nchapter,
.l-ntime {
  display: none;
}

.novel {
  grid-template-columns: 7.5em 2fr;
}


.n-btn span {
  min-width: 10em;
  margin-right: var(--width-core-division);
}

.u-chapter {
  grid-template-columns: 1fr;
}

.u-chapter li {
  font-size: 1em;
  max-width: calc(100vw - 4em);
}

.page .p-m {
  display: none;
}

.islogin::before {
  top: 0.8em;
  right: 2.9em;
}

.dropload-up,
.dropload-down {
  position: relative;
  height: 0;
  overflow: hidden;
  font-size: 12px;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.dropload-down {
  height: 50px;
}

.dropload-refresh,
.dropload-update,
.dropload-load,
.dropload-noData {
  height: 50px;
  line-height: 50px;
  text-align: center;
}

.dropload-load .loading {
  display: inline-block;
  height: 15px;
  width: 15px;
  border-radius: 100%;
  margin: 6px;
  border: 2px solid #666;
  border-bottom-color: transparent;
  vertical-align: middle;
  -webkit-animation: rotate 0.75s linear infinite;
  animation: rotate 0.75s linear infinite;
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }

  50% {
    transform: rotate(180deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.dialog.show {
  display: -webkit-box;
}

.dialog {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  -webkit-box-orient: horizontal;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  background: rgba(0, 0, 0, 0.4);
  display: none;
}

.dialog-cnt {
  border-radius: 3px;
  width: 296px;
  -webkit-background-clip: padding-box;
  pointer-events: auto;
  background-color: #fff;
  position: relative;
  border-top: 4px solid #1bb761;
  -webkit-box-sizing: border-box;
  color: #000;
}

.dialog-bd {
  min-height: 46px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  padding: 18px 28px 18px 28px;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  -webkit-box-orient: vertical;
}

.dialog-ft {
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  display: -webkit-box;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  border-top: 1px solid #e9e9e9;
  height: 45px;
  line-height: 45px
}

.dialog-ft button {
  font-size: .5em;
  text-align: center;
  width: 100%;
  line-height: 45px;
  display: block;
  margin: 0;
  -webkit-box-flex: 1;
  border: 0;
  background: none;
}

.dialog-ft button:active {
  background-color: rgba(0, 0, 0, 0.1)
}

.dialog-ft button:first-child {
  border-bottom-left-radius: 3px
}

.dialog-ft button:last-child {
  border-bottom-right-radius: 3px
}

.dialog-ft button:first-child:nth-last-child(2) {
  position: relative
}

.dialog-ft button:first-child:nth-last-child(2):after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 1px;
  height: 100%;
  border-right: 1px #e9e9e9 solid
}

@media screen and (-webkit-min-device-pixel-ratio:2) {
  .dialog-ft {
    position: relative;
    border: 0;
    background-position: left top;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, transparent), color-stop(0.5, #e9e9e9));
    background-repeat: repeat-x;
    -webkit-background-size: 100% 1px
  }

  .dialog-ft button:first-child:nth-last-child(2):after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 1px;
    height: 100%;
    border-right: 0;
    background-position: right top;
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0.5, transparent), color-stop(0.5, #e9e9e9));
    background-repeat: repeat-y;
    -webkit-background-size: 1px 100%
  }
}

.NovelDetailsCard_share_cGz5b {
  display: flex;
  gap: .5em;
}

.NovelDetailsCard_share_cGz5b svg {
  display: block;
  width: 1.2em;
}

.read-night {
  background-color: #1a1a1a;
}

.read-night .page-d,
.read-night .page-d-top {
  background: #1a1a1a !important;
  color: rgba(255, 255, 255, .5) !important;
}

.read-night .chapter-act a {
  background: #2a2a2a !important;
  color: rgba(255, 255, 255, .4);
}

.read-night .page-d-name {
  color: rgba(255, 255, 255, .4);
}

.page-d {
  background-size: 100%;
  position: relative;
}

.skin-default .page-d {
  background: #f5efda;
  color: #fff;
}

.skin-blue .page-d,
.skin-blue .page-d-top {
  background: #c3d4e6;
}

.skin-green .page-d,
.skin-green .page-d-top {
  background: #d1edd1;
}

.skin-light .page-d,
.skin-light .page-d-top {
  background: #e6e6e6;
}

.page-content {
  min-height: calc(100vh - 44px);
  line-height: 1.8;
  margin: 0 1rem;
  font-size: 1.125rem;
  text-align: justify;
  overflow: hidden;
}

.page-content h1 {
  line-height: 1.5rem;
  font-size: 1.125rem;
  margin: .125rem 0;
  font-weight: 400;
}

.page-content section {
  padding-top: .625rem;
}

.page-content p {
  padding: .3125rem 0;
  text-indent: 2em;
}

.chapter-act {
  display: flex;
  padding: 1.25rem .625rem;
  flex-direction: column;
  gap: .625rem;
}

.chapter-act a {
  flex: 1;
  margin: 0 .625rem;
  text-align: center;
  font-size: .75rem;
  background: rgba(255, 255, 255, .7);
  border-radius: .3125rem;
  display: block;
  padding: .3125rem;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, .3);
  text-decoration: none;
}

/* dasdasdasd */

.page-opt {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .15s, visibility .15s;
  transition: opacity .15s, visibility .15s;
}

.page-opt {
  z-index: 2;
}

.page-opt {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 750px;
  height: 100%;
  z-index: 9;
}

.page-opt .icon-return {
  position: absolute;
  padding: 0 1.25rem;
  left: -0.625rem;
  top: .625rem;
}

.page-opt-header,
.read-opt-more,
.read-opt-footer {
  background-color: rgba(0, 0, 0, .8);
  color: #fff;
  border-bottom: 0;
  -webkit-transition: opacity .15s, -webkit-transform .15s, visibility .15s;
  transition: opacity .15s, transform .15s, visibility .15s;
}

.active>.page-opt-header,
.active>.read-opt-footer {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.read-opt-footer {
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
}

.page-opt-header {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  background-image: none;
}

.page-opt-header {
  height: 2.75rem;
  box-sizing: border-box;
  position: relative;
}

.page-opt-header h2 {
  line-height: 1.25rem;
  text-align: center;
  margin: 0 auto;
  display: block;
  width: 50%;
  font-size: .75rem;
  overflow: hidden;
  padding-top: .75rem;
}

#btn-more {
  right: .625rem;
  top: .5rem;
}

.read-opt-more.active {
  -webkit-transition: none;
  transition: none;
  visibility: visible;
  opacity: 1;
}

.read-opt-more {
  position: absolute;
  right: 0;
  top: 2.75rem;
  padding-top: .625rem;
  visibility: hidden;
  opacity: 0;
}

.read-opt-more a {
  display: block;
  height: 1.5rem;
  padding: .0625rem .625rem;
  font-size: .75rem;
  color: #fff;
}

.read-addbookshelf,
.read-next,
.read-pre {
  position: absolute;
  line-height: 2.0625rem;
  font-size: .75rem;
  text-shadow: 0 0 0 #f2f2f2;
  background: rgba(0, 0, 0, .8);
  color: rgba(255, 255, 255, .7);
  padding: 0 .625rem 0 .9375rem;
}

.read-addbookshelf {
  border-radius: 1.25rem 0 0 1.25rem;
  top: 5.3125rem;
  right: 0;
}

.read-next {
  border-radius: 1.25rem 0 0 1.25rem;
  top: 50%;
  right: 0;

}

.read-pre {
  border-radius: 0 1.25rem 1.25rem 0;
  top: 50%;
  left: 0;
}

.read-opt-footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2.75rem;
  text-align: center;
}

.btn-group {
  display: table;
  width: 100%;
  table-layout: fixed;
  margin-left: auto;
  margin-right: auto;
}


.read-opt-footer i {
  color: #fff;
  font-size: 1rem;
}

.btn-group-cell {
  display: table-cell;
  font-size: 100%;
  font-weight: 400;
}

.read-opt-footer-h {
  font-size: .75rem;
  font-weight: 400;
  line-height: 1;
  position: relative;
  color: #fff;
  text-shadow: 0px 0px 0px #f2f2f2;
}

.read-opt.active {
  -webkit-transition: none;
  transition: none;
  visibility: visible;
  opacity: 1;
}

#page-opt-prog {
  z-index: 20;
}

.read-opt {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2.75rem;
  background-clip: padding-box;
  -webkit-transform: translateY(.5px);
  transform: translateY(.5px);
  visibility: hidden;
  opacity: 0;
}

.read-opt {
  background-color: rgba(0, 0, 0, .9);
  color: #fff;
  border-bottom: 0;
  -webkit-transition: opacity .15s, -webkit-transform .15s, visibility .15s;
  transition: opacity .15s, transform .15s, visibility .15s;
}

.read-prog-info {
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.read-prog-prev {
  left: .625rem;
}

.read-prog-next {
  right: .625rem;
}

.read-prog-next,
.read-prog-prev {
  position: absolute;
  height: 1.5rem;
  padding: .625rem 0;
  font-size: .75rem;
  top: 0;
}

.read-prog-next i,
.read-prog-prev i {
  font-size: .75rem
}

.read-prog-info a {
  color: #fff;
}

.read-prog-val {
  margin: 0 .625rem;
  font-size: .75rem;
  padding: .625rem 0 .3125rem;
  text-align: center;
}

.ell {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.read-prog-val output {
  font-size: .6875rem;
  opacity: .8;
}

output {
  speak: digits;
}

#pager .icon-arrow-l,
#pager .icon-arrow-r {
  font-size: 20px;
}

.read-set-font {
  padding: .625rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}


.read-font-down,
.read-font-up {
  width: .625rem;
  text-align: center;
  position: absolute;
  height: 1.5rem;
  padding: .3125rem 0;
  top: .25rem;
  color: #fff;
}

.read-font-down .icon,
.read-font-up .icon {
  font-size: 1.375rem;
}

.read-font-down {
  left: .3125rem;
}

.read-font-up {
  right: .9375rem;
}

.read-font-bar {

  padding: .625rem 0;
  margin: 0 1.875rem;
}

.range {
  height: .875rem;
  display: inline;
  position: absolute;
}

.range-track {
  height: .125rem;
  margin-top: .375rem;
  border-radius: .625rem;
  background-color: rgba(255, 255, 255, .2);
  border-left: 0 solid #f01742;
  text-align: left;
}

.range-thumb {
  position: absolute;
  width: .75rem;
  height: .75rem;
  border: .375rem solid transparent;
  margin: -0.6875rem 0 0 -0.75rem;
  border-radius: .2rem;
  background-color: #f01742;
  background-clip: content-box;
  -webkit-transition: border-color .15s, background-color .15s;
  transition: border-color .15s, background-color .15s;
}

.read-font-bar>input {
  display: block;
  height: .14rem;
}

.read-font-bar>input {
  width: 100%;
  margin: 0;
}

#readFontRange {
  color: #fff;
  margin-top: .25rem;
  border-radius: .9375rem;
  -webkit-appearance: none;
  height: .125rem;
  background: linear-gradient(45deg, #7c3aed, #4f46e5);
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 1.375rem;
  width: 1.375rem;
  background: #fff;
  border-radius: 50%;
  border: solid 1px #ddd;
}

.read-set-skin {
  padding: 0 10px;
  padding-right: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.read-set-cell>input {
  opacity: 0;
  width: 100%;
  height: 100%;
  width: calc(100% - 1.25rem);
  position: absolute;
  margin: 0;
  z-index: 1;
}

:checked+.read-skin-blue,
:checked+.read-skin-default,
:checked+.read-skin-green,
:checked+.read-skin-light {
  color: #f01742;
}

.read-set-cell>label {
  display: block;
  margin-right: .625rem;
}

.read-skin-default {
  background: #f5efda;
  background-size: 100%;
}

.read-skin-blue,
.read-skin-default,
.read-skin-green,
.read-skin-light {
  height: 1.875rem;
  margin: .625rem .625rem .625rem 0;
  border-radius: 3px;
  box-shadow: inset 0 0.5px, inset 0.5px 0, inset -0.5px 0, inset 0 -0.5px;
  color: transparent;
  -webkit-transition: color .15s;
  transition: color .15s;
  position: relative;
}

.read-set-skin .icon-check {
  text-align: center;
  line-height: 1.875rem;
  display: block;
  visibility: hidden;
}

.checking .icon-check {
  visibility: visible;
}

.checking {
  color: #f01742;
}

.read-set-skin .icon-check:before {
  color: #f01742;
}

.read-skin-blue {
  background: #cad9e8;
}

.read-skin-green {
  background: #d1edd1;
}

.read-skin-light {
  background: #e6e6e6;
}

.hover a {
  color: #B8001D;
  font-weight: bold;

}

.chapter-act {
  display: flex;
  padding: 1.25rem .625rem;

}

.chapter-act a {
  flex: 1;
  margin: 0 .625rem;
  text-align: center;
  font-size: .75rem;
  background: rgba(255, 255, 255, .7);
  border-radius: .3125rem;
  display: block;
  padding: .3125rem;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, .3);
  text-decoration: none;
}

.icon-ellipsis {
  position: absolute;
  color: #fff;
  font-size: 1.75rem;
  line-height: 1.75rem;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  display: block;
}

.chapters.show {
  pointer-events: inherit;
  opacity: 1;
}

.chapters {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  display: -webkit-box;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-color: rgba(0, 0, 0, .6);
  opacity: 0;
  transition: opacity .3s ease-in, visibility .3s ease-in;
}

.chapterlist {
  position: absolute;
  bottom: 0;
  left: 0;
  top: 4.375rem;
  width: 100vw;
  height: calc(100vh - 4.375rem);
  border-top-left-radius: 1.3125rem;
  border-top-right-radius: 1.3125rem;
  overflow: hidden;
  background-color: #fff;
  z-index: 10001;
}

.chapter-topbar {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.125rem 1.0625rem .75rem;
}

.chapter-title {
  position: relative;
  display: inline-block;
  font-size: 1rem;
  line-height: 1.375rem;
  color: #1f1f1f;
  font-weight: 700;
}

.chapter-close {
  width: 1.375rem;
  height: 1.375rem;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAA2BAMAAAB+a3fuAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURUdwTB8fHx8fHyAgIB8fHyAgICAgIB8fHx8fHyIiIiYmJiAgIB8fHz8iMv0AAAAMdFJOUwD9WT71dVeC8ysUpeWbKmoAAAC1SURBVHja7dIhDsJQEEXRCQkQkBUYKqhDdg8INL4CHBKW0h2wEAwJAjGL4ueLufl9YEhwveqJnqTp1Mb+0kI2XTfsQ97R3KvY07yp90c83PnrZkaT2qtgvrOiJmDnz9YICFMIUwhTCFMIUwgTuIYJdJhAmHR3v9ggviQnGNS5cw5h+1ogB2gEcoD0qqsvLH+c42dmQGVAYamZQg5wApYMSH2wBOX/TCxg3rRt2ee8aVnssV97AzFSWbNEeSJbAAAAAElFTkSuQmCC) 100%/100% no-repeat;
}

.chapter-title:after {
  content: "";
  position: absolute;
  bottom: -0.8125rem;
  left: .4375rem;
  width: 1.125rem;
  height: .1875rem;
  border-radius: 2.0625rem;
  background-color: #37c26e;
  z-index: 8;
}

.chapter-topbar:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 300%;
  height: 300%;
  border-bottom: 1px solid #e6e6e6;
  transform: scale(.33333);
  transform-origin: left top;
  pointer-events: none;
  z-index: 9;
}

.s-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .625rem 0;
}

.s-title {
  font-size: 16px;
  line-height: 1.5;
  color: #858585;
}

.s-right {
  display: flex;
  align-items: center;
}

#s-icon {
  width: .75rem;
  height: .75rem;
  margin-right: .4375rem;
  position: relative;
  top: .0625rem;
}

.s-reverse {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABIUExURUdwTLi4uB8fHy0tLR8fH8nJyR8fH7m5uSEhIb+/vx8fH7i4uLm5ubi4uLi4uB8fH7i4uLm5uR8fHyAgILi4uCAgIB8fH7i4uCb0D+YAAAAWdFJOUwCpvwrNBXHbLiCSxJCO8OqiZiiv1dantLmvAAAAcUlEQVR42u3KNw6AQBDAwD1yzuz+/6egk2gw4pAoaHDlYuSz0qEbjy9Uk0vjzBYgGsuBaIhoiGgcEE1bAtFIANVmjRCdVSNhlEoA+X70DsUPUBxVIbQb1eoeeaPZPaIhWmmIFIaIhoiGaKIhkrnP5Ks27KUR2ehySvkAAAAASUVORK5CYII=) 100%/100% no-repeat;
}

.s-no-reverse {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAABFUExURUdwTLi4uB8fHy0tLb+/v9vb2x8fH7m5uSEhIR8fH7m5ub+/vx8fH7i4uLi4uLi4uCAgILm5ubi4uB8fHx8fHx8fH7i4uPboej8AAAAVdFJOUwCnvwogA3LbLs6rCpLEkI6vZ/DqKMsPV9AAAABySURBVHja7c45EoAgFARRcFfclX//o0oZGNAUWGVAYkcTvGBUtppjfXYrUgWNtfYEorEdEAwRDRFN0QPRlEQ0Ko7G2xB5ypkkUs6kkfrRN2ReoHkySTSLeIpoERFdxxENkaYhggmjAQYIhoiGaNvdn1xdHlQRVjqEnzMAAAAASUVORK5CYII=) 100%/100% no-repeat;
}

/* .s-text {
  font-size: 1rem;
  line-height: 1.5;
  color: #1f1f1f;
} */


.chapter {
  height: calc(100vh - 10.625rem);
  overflow-y: scroll;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.chapter li,
.chapter-l li {
  padding: .625rem 1rem;
  font-size: .875rem;
  line-height: 1.5;
  color: #1f1f1f;
  max-width: 18.0625rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.chapter li a {
  color: #1f1f1f;
}

.chapter .hov a {
  color: #37c26e;
}

.read-night .panel {
  background: #353535;
  color: #ccc;
}

.read-night .l-p1 .bauthor:after,
.read-night .l-p1 .size:after {
  content: "";
  border-right: 1px solid #ccc;
}

.read-night .u-list li {
  border-bottom: 1px solid #777;
}

.page-opt.active {
  -webkit-transition: none;
  transition: none;
  visibility: visible;
  opacity: 1;
}

#page_box {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}

.read_btn {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9;
  background-color: var(--color-btn-solid-bg);
  color: #fff;
  font-size: 1em;
  text-shadow: 0px 0px 0px #f2f2f2;
  background-clip: padding-box;
  text-align: center;
  border-radius: 3px;
  padding: .8em;
}

@media (min-width: 750px) {
  .u-img img {
    width: 12.2em;
    height: 16.267em;
  }

  .u-img .bname {
    max-width: 12em;
  }

  .l-text {
    flex: 1;
  }

  .read_btn {
    display: none;
  }
}

.positionFixed {
  bottom: 0px;
  left: 50%;
  position: fixed;
  transform: translate(-50%, 0%);
  z-index: 999;
  width: 100%;
  display: flex;
  justify-content: center;
}

.ad-div {
  margin-bottom: 50px;
  width: 100%;
  min-width: 250px;
  clear: both;

}

.t_de {
  max-width: 100%;
  line-height: 2;
  font-size: 12px;
  box-sizing: border-box;
  color: #707070;
  text-align: center;
}

.grecaptcha-badge {
  visibility: hidden;
}

.ranked-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ranked-list-item {
    display: grid;
    grid-template-columns: 30px 100px 1fr;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem;
    border-radius: 8px;
    background-color: #242424;
    border: 1px solid #333;
    color: var(--color-core-text);
    text-decoration: none;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.ranked-list-item:hover {
    background-color: #2a2a2a;
    border-color: var(--color-core);
}

.ranked-list-item__rank {
    font-size: 1.2em;
    font-weight: 700;
    color: #888;
    text-align: center;
}

.ranked-list-item:nth-child(1) .ranked-list-item__rank { color: #f97316; } /* orange-500 */
.ranked-list-item:nth-child(2) .ranked-list-item__rank { color: #f59e0b; } /* amber-500 */
.ranked-list-item:nth-child(3) .ranked-list-item__rank { color: #eab308; } /* yellow-500 */

.ranked-list-item__cover {
    width: 100px;
    height: 133px;
    border-radius: 4px;
    object-fit: cover;
}

.ranked-list-item__info {
    overflow: hidden;
}

.ranked-list-item__title {
    font-size: 1em;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-core-text);
}

.ranked-list-item__author {
    font-size: 0.875em;
    color: var(--color-author);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.compact-book-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 1.5rem;
}

.compact-book-card {
    text-decoration: none;
    color: var(--color-core-text);
    background-color: #242424;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #333;
    transition: border-color 0.2s ease-in-out;
}

.compact-book-card:hover {
    border-color: var(--color-core);
}

.compact-book-card__cover {
    width: 100%;
    aspect-ratio: 3/4;
    object-fit: cover;
}

.compact-book-card__title {
    font-size: 0.875em;
    font-weight: 500;
    padding: 0.75rem;
    line-height: 1.4;
    height: 3.5em; /* 1.4 * 2.5 lines */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.copyright {
  color: #fff;
}

/* Detail Page Styles */
.book-detail-card {
    /* This is now a layout container, not a visual card */
    background-color: transparent;
    border: none;
    padding: 0;
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* Provides space between the header and intro cards */
}

.book-detail-header {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 2rem;
    /* This is the new visual card for the top section */
    background-color: var(--color-bg);
    border: 1px solid var(--color-stroke);
    padding: 1.5rem;
    border-radius: 12px;
}

.book-detail__cover-wrapper {
    width: 200px;
}

.book-detail__cover {
    width: 100%;
    height: auto;
    aspect-ratio: 3/4;
    object-fit: cover;
    border-radius: 8px;
}

.book-detail__info-wrapper {
    display: flex;
    flex-direction: column;
}

.book-detail__title {
    font-size: 1.8em;
    font-weight: 700;
    color: var(--color-header-text);
    margin-bottom: 1rem;
}

.book-detail__meta-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.8rem 1.5rem;
    margin-bottom: 1rem;
}

.meta-item {
    font-size: 0.9em;
    color: #a0a0a0;
    /* Key change for perfect alignment */
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.8em;
    align-items: center;
}

.meta-item__label {
    margin-right: 0; /* Replaced with gap */
}

.meta-item__value.link {
    color: var(--color-core-a);
    text-decoration: underline;
    font-weight: 600;
    border: none;
}

.meta-item__value.completed {
    color: var(--color-wj);
}

.meta-item__value.serializing {
    color: var(--color-lz);
}

.book-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}

.tag-badge {
    display: inline-block;
    padding: 0.3em 0.8em;
    font-size: 0.8em;
    color: var(--color-core-a);
    background-color: #2a2a2a;
    border: 1px solid var(--color-stroke);
    border-radius: 15px;
    text-decoration: none;
}

.book-detail__actions .btn--primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7em;
    background: linear-gradient(45deg, #7c3aed, #4f46e5);
    color: #ffffff;
    padding: 0.8em 1.8em;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 1.1em;
    border: none;
    box-shadow: 0 4px 20px -5px rgba(95, 67, 229, 0.6);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.book-detail__actions .btn--primary:active {
    transform: scale(0.97);
    box-shadow: 0 2px 10px -4px rgba(95, 67, 229, 0.7);
}

.book-detail__intro {
    margin-top: 0; /* Reset margin, gap is used now */
    border-top: none; /* remove old border */
    /* This is now its own visual card */
    padding: 1.5rem;
    border: 1px solid var(--color-stroke);
    background-color: var(--color-bg);
    border-radius: 12px;
}

.book-detail__intro h2 {
    font-size: 1.2em;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--color-stroke);
    color: #dcdcdc;
}

.intro-content {
    font-size: 1em;
    line-height: 1.7;
    color: #c0c0c0;
    padding-top: 0.5rem; /* Space between title-line and text */
}
.intro-content p{
    margin-bottom: 1em;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1em;
}

.chapter-sort {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9em;
    color: #a0a0a0;
}

.sort-toggle {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #a0a0a0;
    text-decoration: none;
}

.chapter-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.chapter-list-item {
    display: block;
    padding: 0.8rem 1rem;
    background-color: #242424;
    border: 1px solid var(--color-stroke);
    border-radius: 8px;
    color: var(--color-core-a);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chapter-list-item.new-chapter {
    position: relative;
    border-color: var(--color-wj);
    color: var(--color-wj);
}

.new-chapter-badge {
    font-size: 0.75em;
    font-weight: 600;
    margin-right: 0.5em;
    background-color: var(--color-wj);
    color: #1a1a1a;
    padding: 0.1em 0.4em;
    border-radius: 4px;
}

.chapter-list__footer {
    text-align: center;
    margin-top: 1.5rem;
}

.view-all-chapters {
    color: var(--color-core-a);
    text-decoration: underline;
}

.copyright {
   color: #fff;
 }

/* Responsive adjustments for Detail Page */
@media (max-width: 768px) {
    .book-detail-header {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1rem;
    }
    .book-detail__cover-wrapper {
        width: 150px;
        margin: 0 auto;
    }
    .book-detail__title {
        font-size: 1.5em;
        text-align: center;
    }
    .book-detail__meta-grid {
        grid-template-columns: 1fr;
    }
    .book-detail__actions {
        display: flex;
        justify-content: center;
    }
}

.chapter-list.full {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.chapter-list__footer {
    text-align: center;
    margin-top: 1.5rem;
}

.view-all-chapters {
    color: var(--color-core-a);
    text-decoration: underline;
}

.page {
    margin: 2rem auto;
}

.pagei li {
    background-color: #242424;
    border: 1px solid var(--color-stroke);
    color: var(--color-core-a);
}

.pagei .active {
    background: linear-gradient(45deg, #7c3aed, #4f46e5);
    color: #fff;
    border-color: var(--color-core);
}

/* Responsive adjustments for Detail Page */
@media (max-width: 768px) {
    .book-detail-header {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1rem;
    }

    .chapter-list.full {
        grid-template-columns: 1fr;
    }
}

.copyright {
   color: #fff;
 }

/* Reading Page Styles */
.reading-container {
    background-color: var(--color-core-bg);
}
.reading-content-wrapper {
    max-width: 800px;
    margin: 0 auto;
    padding: 1rem;
    background-color: var(--color-bg);
    min-height: 100vh;
}
.reading-chapter-title {
    font-size: 1.8em;
    font-weight: 700;
    text-align: center;
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--color-stroke);
    margin-bottom: 1.5rem;
}
.reading-text {
    font-size: 1.1em;
    line-height: 1.8;
    color: #c0c0c0;
}
.reading-text p {
    margin-bottom: 1.5em;
}

.chapter-navigation {
    display: flex;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    max-width: 800px;
    margin: 0 auto;
}
.nav-button {
    flex: 1;
    display: inline-block;
    padding: 0.8em 1.5em;
    border-radius: 8px;
    background-color: #2a2a2a;
    border: 1px solid var(--color-stroke);
    color: var(--color-core-a);
    text-align: center;
    text-decoration: none;
    font-weight: 600;
}
.nav-button.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.same-kind-panel {
    max-width: 800px;
    margin: 1rem auto;
}

/* Toolbar */
.page-opt-header .header-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    color: #fff;
    text-decoration: none;
    font-size: 1em;
    padding: 0.8rem 1rem;
}

.read-opt-panel {
    padding: 1rem;
    background-color: rgba(0, 0, 0, 0.9);
    color: #fff;
}
#page-opt-prog.read-opt-panel {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.panel-slider-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.slider-nav-btn {
    color: #fff;
    font-size: 1.2em;
}
.slider-nav-text span {
    font-size: 0.9em;
}

.settings-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.8rem 0;
}
.settings-label {
    font-size: 0.9em;
    color: #a0a0a0;
}
.font-control {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.font-control-btn {
    padding: 0.4em 0.8em;
    border: 1px solid var(--color-stroke);
    border-radius: 6px;
    background-color: #2a2a2a;
    color: #fff;
    text-decoration: none;
}
.skin-control {
    display: flex;
    gap: 0.8rem;
}
.skin-option-wrapper {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    padding: 3px;
    border: 1px solid transparent;
}
.skin-option-wrapper .checking {
    border-color: var(--color-core);
}
.skin-option {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,0.2);
}
.skin-option[data-index="skin-default"] { background-color: #f5efda; }
.skin-option[data-index="skin-blue"]   { background-color: #cad9e8; }
.skin-option[data-index="skin-green"]  { background-color: #d1edd1; }
.skin-option[data-index="skin-light"]  { background-color: #e6e6e6; }
.skin-option[data-index="skin-dark"]   { background-color: #1a1a1a; }

.read-night .page-d {
    background: #1a1a1a !important;
    color: rgba(255, 255, 255, .5) !important;
}
.read-night .reading-content-wrapper {
    background-color: #1a1a1a !important;
}
.read-night .reading-text {
    color: #777;
}

.skin-blue .reading-content-wrapper { background-color: #c3d4e6 !important; }
.skin-green .reading-content-wrapper { background-color: #d1edd1 !important; }
.skin-light .reading-content-wrapper { color: #fff;}

.skin-blue .reading-text,
.skin-green .reading-text,
.skin-light .reading-text {
    color: #fff;
}

.page-opt.active > .read-opt-footer {
    transform: translateY(0);
}
.read-opt-footer {
    transform: translateY(100%);
    transition: transform .15s;
}

.page-opt.active > .page-opt-header {
    transform: translateY(0);
}
.page-opt-header {
    transform: translateY(-100%);
    transition: transform .15s;
}

.read-opt-panel{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.75rem;
    -webkit-transform: translateY(0.5px);
    transform: translateY(0.5px);
    visibility: hidden;
    opacity: 0;
    transition: opacity .15s,transform .15s,visibility .15s;
}

.read-opt-panel.active{
    visibility: visible;
    opacity: 1;
}

.copyright {
   color: #fff;
 }

.font-size-control {
    display: flex;
    justify-content: center;
    padding: 1rem 0;
    margin: -0.5rem 0 1rem;
    border-bottom: 1px solid var(--color-stroke);
}

.font-control {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #2a2a2a;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    border: 1px solid var(--color-stroke);
}

.font-control-btn {
    color: var(--color-core-text);
    text-decoration: none;
    font-weight: 500;
    padding: 0.3em 0.8em;
    border-radius: 4px;
    background: #333;
    border: 1px solid var(--color-stroke);
}

.font-control input[type="range"] {
    width: 120px;
    height: 4px;
    background: #333;
    border-radius: 2px;
    -webkit-appearance: none;
}

.font-control input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--color-core);
    border: 2px solid #fff;
    cursor: pointer;
}

.font-control input[type="range"]::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--color-core);
    border: 2px solid #fff;
    cursor: pointer;
}

/* Filter Controls */
.filter-controls {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    padding: 0.5rem 0;
}

.filter-group {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.filter-label {
    font-weight: 600;
    color: var(--color-core-text);
    white-space: nowrap;
}

.filter-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.filter-option {
    padding: 0.4em 0.8em;
    border-radius: 6px;
    background-color: #2a2a2a;
    border: 1px solid var(--color-stroke);
    color: var(--color-core-a);
    text-decoration: none;
}

.filter-option.active,
.filter-option:active {
    background: linear-gradient(45deg, #7c3aed, #4f46e5);
    color: #fff;
    border-color: var(--color-core);
}

/* Empty List Placeholder */
.empty-list-placeholder {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    background-color: #242424;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
}

.empty-list-placeholder p {
    font-size: 1.1em;
    color: var(--color-author);
}
.panel-header {
    margin-bottom: 0;
}

/* Author Page Header */
.author-header {
    text-align: center;
    padding: 1.5rem 1rem;
    background-color: #242424;
    border-radius: 8px;
    margin: 1rem 0;
}

.author-name {
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 1rem;
}

.author-stats {
    display: flex;
    justify-content: center;
    gap: 2rem;
}

.stat-item {
    display: flex;
    flex-direction: column;
}

.stat-value {
    font-size: 1.2em;
    font-weight: 600;
    color: var(--color-core-text);
}

.stat-label {
    font-size: 0.9em;
    color: var(--color-author);
}

.icon-close, .n-close {
    cursor: pointer;
}