@charset "UTF-8";
/* ==========================================================================
   霓虹漫城 · 夜街区 — 自定义页与会员/作者中心适配层
   覆盖：排行榜（custom/top）、最新更新（custom/update）、
        图文页（about/contact/notice/xieyi/privacy/map）、
        小说兼容页（book/*）、会员中心与作者中心的表格 / 表单 / 弹窗外观
   --------------------------------------------------------------------------
   这些页面内部结构由漫城 CMS 公共样式与人共用，本文件只做“暗色接管”：
   统一文字色、面板底色、表格描边、输入框与按钮，避免出现白底穿帮。
   ========================================================================== */

/* ==========================================================================
   1. 通用页头（自定义内容页复用）
   ========================================================================== */
.nb-doc {
  position: relative;
  z-index: 1;
  padding-top: var(--nb-s7);
  padding-bottom: var(--nb-s8);
}

.nb-doc__paper {
  padding: var(--nb-s8);
  border: 1px solid var(--nb-line);
  border-radius: var(--nb-r-lg);
  background: var(--nb-glass);
}

.nb-doc__paper h1 {
  margin-bottom: var(--nb-s5);
  font-size: var(--nb-f-2xl);
}

.nb-doc__paper h2 {
  margin: var(--nb-s6) 0 var(--nb-s3);
  padding-left: var(--nb-s3);
  border-left: 2px solid var(--nb-cyan);
  font-size: var(--nb-f-lg);
}

.nb-doc__paper h3 {
  margin: var(--nb-s5) 0 var(--nb-s2);
  font-size: var(--nb-f-md);
  color: var(--nb-cyan);
}

.nb-doc__paper p {
  margin-bottom: var(--nb-s3);
  color: var(--nb-text-2);
  font-size: var(--nb-f-base);
  line-height: 2;
}

.nb-doc__paper ul,
.nb-doc__paper ol {
  margin: 0 0 var(--nb-s4) var(--nb-s5);
  color: var(--nb-text-2);
  font-size: var(--nb-f-base);
  line-height: 2;
}

.nb-doc__paper li {
  list-style: disc;
  margin-bottom: 4px;
}

.nb-doc__paper ol li {
  list-style: decimal;
}

.nb-doc__paper a {
  color: var(--nb-cyan);
}

.nb-doc__paper strong,
.nb-doc__paper b {
  color: var(--nb-text);
}

.nb-doc__paper table {
  width: 100%;
  margin-bottom: var(--nb-s4);
  font-size: var(--nb-f-sm);
}

.nb-doc__paper th,
.nb-doc__paper td {
  padding: 10px var(--nb-s3);
  border: 1px solid var(--nb-line);
  color: var(--nb-text-2);
  text-align: left;
}

.nb-doc__paper th {
  background: rgba(23, 33, 64, .6);
  color: var(--nb-text);
}

/* 旧版内容页常见的白底容器统一拉黑 */
.nb-doc .content,
.nb-doc .article,
.nb-doc .help-content,
.nb-doc .help-main,
.nb-doc .help-wrapper,
.nb-doc .help-wrap,
.nb-doc .help-container {
  background: transparent !important;
  color: var(--nb-text-2) !important;
  max-width: none;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
}

.nb-doc .help-nav,
.nb-doc .help-aside {
  background: rgba(18, 26, 46, .72) !important;
  border-color: var(--nb-line) !important;
}

.nb-doc .help-nav__item {
  border-color: var(--nb-line) !important;
  color: var(--nb-text-2);
}

.nb-doc .help-nav__item.active,
.nb-doc .help-nav__item:hover {
  color: var(--nb-cyan) !important;
  background: rgba(53, 224, 208, .08) !important;
}

/* ==========================================================================
   2. 排行榜（custom/top 与 custom/hot|week|day|... 系列）
   ========================================================================== */
.nb-rankhead {
  position: relative;
  margin-bottom: var(--nb-s6);
  padding: var(--nb-s8) var(--nb-s8) var(--nb-s7);
  border: 1px solid var(--nb-line);
  border-radius: var(--nb-r-lg);
  background:
    radial-gradient(820px 300px at 10% 0%, rgba(255, 176, 87, .14), transparent 62%),
    radial-gradient(700px 300px at 92% 100%, rgba(123, 92, 255, .18), transparent 62%),
    var(--nb-glass);
  overflow: hidden;
}

.nb-rankhead::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(120, 148, 214, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120, 148, 214, .055) 1px, transparent 1px);
  background-size: 44px 44px, 44px 44px;
  mask-image: linear-gradient(90deg, #000 0%, transparent 80%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 80%);
}

.nb-rankhead__inner {
  position: relative;
  z-index: 1;
}

.nb-rankhead__brand {
  color: var(--nb-amber);
  font-size: var(--nb-f-sm);
  font-weight: 700;
  letter-spacing: 2.4px;
}

.nb-rankhead h1 {
  margin-top: var(--nb-s2);
  font-size: 40px;
  letter-spacing: 2px;
}

.nb-rankhead p {
  margin-top: var(--nb-s3);
  max-width: 680px;
  color: var(--nb-text-2);
  font-size: var(--nb-f-base);
}

/* 榜单页签 */
.nb-ranktabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--nb-s2);
  margin-bottom: var(--nb-s6);
}

.nb-ranktabs a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px var(--nb-s4);
  border: 1px solid var(--nb-line);
  border-radius: var(--nb-r-pill);
  color: var(--nb-text-2);
  font-size: var(--nb-f-sm);
  transition: color var(--nb-t) var(--nb-ease), border-color var(--nb-t) var(--nb-ease), background var(--nb-t) var(--nb-ease);
}

.nb-ranktabs a:hover {
  color: var(--nb-cyan);
  border-color: var(--nb-line-cyan);
}

.nb-ranktabs a.is-active {
  border-color: transparent;
  background: var(--nb-grad-cyan);
  color: var(--nb-text-invert);
  font-weight: 700;
}

/* 榜单区块 */
.nb-rankboard {
  margin-bottom: var(--nb-s6);
  padding: var(--nb-s6);
  border: 1px solid var(--nb-line);
  border-radius: var(--nb-r-lg);
  background: var(--nb-glass);
}

.nb-rankboard__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--nb-s4);
  margin-bottom: var(--nb-s5);
  padding-bottom: var(--nb-s4);
  border-bottom: 1px solid var(--nb-line);
}

.nb-rankboard__head h2 {
  display: flex;
  align-items: center;
  gap: var(--nb-s3);
  font-size: var(--nb-f-xl);
}

.nb-rankboard__head h2::before {
  content: '';
  width: 3px;
  height: 20px;
  border-radius: var(--nb-r-pill);
  background: var(--nb-grad-cyan);
}

.nb-rankboard__head a {
  color: var(--nb-text-3);
  font-size: var(--nb-f-sm);
}

.nb-rankboard__head a:hover {
  color: var(--nb-cyan);
}

.nb-rankboard__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--nb-s5) var(--nb-s4);
}

/* 榜单行（紧凑列表形态） */
.nb-ranklines li {
  display: grid;
  grid-template-columns: 34px 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--nb-s4);
  padding: var(--nb-s3) var(--nb-s2);
  border-bottom: 1px dashed rgba(120, 148, 214, .14);
  border-radius: var(--nb-r-sm);
  transition: background var(--nb-t) var(--nb-ease);
}

.nb-ranklines li:hover {
  background: rgba(120, 148, 214, .06);
}

.nb-ranklines li:last-child {
  border-bottom: 0;
}

.nb-ranklines__no {
  font: 800 var(--nb-f-xl)/1 var(--nb-font-num);
  color: var(--nb-text-3);
  text-align: center;
}

.nb-ranklines li:nth-child(1) .nb-ranklines__no {
  color: var(--nb-amber);
}

.nb-ranklines li:nth-child(2) .nb-ranklines__no {
  color: #cfd8ef;
}

.nb-ranklines li:nth-child(3) .nb-ranklines__no {
  color: #d7a273;
}

.nb-ranklines img {
  width: 44px;
  height: 58px;
  border-radius: var(--nb-r-xs);
  object-fit: cover;
  background: var(--nb-ink-3);
}

.nb-ranklines__body {
  min-width: 0;
}

.nb-ranklines__body h3 {
  font-size: var(--nb-f-md);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nb-ranklines__body h3 a:hover {
  color: var(--nb-cyan);
}

.nb-ranklines__body p {
  margin-top: 2px;
  color: var(--nb-text-3);
  font-size: var(--nb-f-xs);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nb-ranklines__body p a {
  color: var(--nb-amber);
}

.nb-ranklines__val {
  color: var(--nb-text-3);
  font: var(--nb-f-sm)/1.4 var(--nb-font-num);
  white-space: nowrap;
  text-align: right;
}

/* ==========================================================================
   3. 最新更新页
   ========================================================================== */
.nb-updatepage__day {
  margin-bottom: var(--nb-s6);
  padding: var(--nb-s5) var(--nb-s6);
  border: 1px solid var(--nb-line);
  border-radius: var(--nb-r-lg);
  background: var(--nb-glass);
}

.nb-updatepage__day > header {
  display: flex;
  align-items: center;
  gap: var(--nb-s3);
  margin-bottom: var(--nb-s4);
  padding-bottom: var(--nb-s3);
  border-bottom: 1px solid var(--nb-line);
}

.nb-updatepage__day h2 {
  font-size: var(--nb-f-lg);
}

.nb-updatepage__day time {
  color: var(--nb-text-3);
  font: var(--nb-f-sm)/1 var(--nb-font-num);
}

.nb-updatepage__day .nb-dot {
  margin-left: auto;
}

/* ==========================================================================
   4. 小说兼容页（列表/详情/阅读）
   —— 本站为“仅漫画模式”，页面默认不开放；此处仅保证启用时不穿帮
   ========================================================================== */
.nb-bookwrap {
  position: relative;
  z-index: 1;
  padding: var(--nb-s7) 0 var(--nb-s8);
}

.nb-bookwrap .container--response {
  width: 100%;
  max-width: calc(var(--nb-content) + var(--nb-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--nb-gutter);
}

.nb-bookwrap .book-list,
.nb-bookwrap .book-info,
.nb-bookwrap .book-cate,
.nb-bookwrap .read-container,
.nb-bookwrap .book-rank {
  background: transparent !important;
}

/* ==========================================================================
   5. 会员中心 / 作者中心：容器与表格接管
   ========================================================================== */
.nb-account-wrap {
  position: relative;
  z-index: 1;
  padding: var(--nb-s6) 0 var(--nb-s8);
}

.nb-account-wrap .container--response,
.nb-account-wrap .user-container,
.nb-account-wrap .author-container {
  width: 100%;
  max-width: calc(var(--nb-content) + var(--nb-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--nb-gutter);
}

/* 白色内容面板 → 暗色玻璃面板 */
.nb-account-wrap .user-content,
.nb-account-wrap .author-content,
.nb-account-wrap .user-main,
.nb-account-wrap .author-main,
.nb-account-wrap .user-box,
.nb-account-wrap .author-box,
.nb-account-wrap .in-sec__box,
.nb-account-wrap .user-panel,
.nb-account-wrap .author-panel {
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-r-lg) !important;
  background: var(--nb-glass) !important;
  color: var(--nb-text-2) !important;
}

/* 左侧菜单 */
.nb-account-wrap .user-left,
.nb-account-wrap .author-left,
.nb-account-wrap .user-side,
.nb-account-wrap .author-side {
  border: 1px solid var(--nb-line) !important;
  border-radius: var(--nb-r-lg) !important;
  background: rgba(18, 26, 46, .72) !important;
}

.nb-account-wrap .user-left a,
.nb-account-wrap .author-left a,
.nb-account-wrap .user-side a,
.nb-account-wrap .author-side a {
  color: var(--nb-text-2) !important;
}

.nb-account-wrap .user-left a:hover,
.nb-account-wrap .author-left a:hover,
.nb-account-wrap .user-left .active,
.nb-account-wrap .author-left .active {
  color: var(--nb-cyan) !important;
  background: rgba(53, 224, 208, .08) !important;
}

/* 表格 */
.nb-account-wrap table,
.nb-account-wrap .layui-table {
  background: transparent !important;
  color: var(--nb-text-2) !important;
}

.nb-account-wrap table th,
.nb-account-wrap .layui-table th {
  background: rgba(23, 33, 64, .74) !important;
  color: var(--nb-text) !important;
  border-color: var(--nb-line) !important;
}

.nb-account-wrap table td,
.nb-account-wrap .layui-table td {
  background: transparent !important;
  color: var(--nb-text-2) !important;
  border-color: var(--nb-line) !important;
}

.nb-account-wrap table tr:hover td {
  background: rgba(120, 148, 214, .06) !important;
}

/* 表单 */
.nb-account-wrap label,
.nb-account-wrap .form-item,
.nb-account-wrap .layui-form-label {
  color: var(--nb-text-2) !important;
}

.nb-account-wrap input[type='text'],
.nb-account-wrap input[type='password'],
.nb-account-wrap input[type='number'],
.nb-account-wrap input[type='tel'],
.nb-account-wrap input[type='email'],
.nb-account-wrap input[type='search'],
.nb-account-wrap textarea,
.nb-account-wrap select {
  border: 1px solid var(--nb-line-strong) !important;
  border-radius: var(--nb-r-sm) !important;
  background: rgba(7, 10, 20, .55) !important;
  color: var(--nb-text) !important;
}

.nb-account-wrap input::placeholder,
.nb-account-wrap textarea::placeholder {
  color: var(--nb-text-3) !important;
}

.nb-account-wrap .submit-btn,
.nb-account-wrap .layui-btn,
.nb-account-wrap button[type='submit'],
.nb-account-wrap .btn-submit {
  border: 0 !important;
  border-radius: var(--nb-r-sm) !important;
  background: var(--nb-grad-cyan) !important;
  color: var(--nb-text-invert) !important;
  font-weight: 700;
}

.nb-account-wrap .layui-btn-primary {
  border: 1px solid var(--nb-line-strong) !important;
  background: transparent !important;
  color: var(--nb-text-2) !important;
}

/* 标题与说明文字 */
.nb-account-wrap h1,
.nb-account-wrap h2,
.nb-account-wrap h3,
.nb-account-wrap h4 {
  color: var(--nb-text) !important;
}

.nb-account-wrap .title,
.nb-account-wrap .in-sec__title {
  color: var(--nb-text) !important;
  border-color: var(--nb-line) !important;
}

.nb-account-wrap p,
.nb-account-wrap span,
.nb-account-wrap div {
  color: inherit;
}

.nb-account-wrap .hl {
  color: var(--nb-cyan) !important;
}

/* 空状态图（旧模板用位图，这里改成暗色卡片） */
.nb-account-wrap img[src*='_null'],
.nb-account-wrap img[src*='null_'] {
  opacity: .5;
  max-width: 180px;
}

/* 分页 */
.nb-account-wrap .layui-laypage a,
.nb-account-wrap .layui-laypage span {
  border-color: var(--nb-line) !important;
  background: rgba(18, 26, 46, .8) !important;
  color: var(--nb-text-2) !important;
}

.nb-account-wrap .layui-laypage .layui-laypage-curr .layui-laypage-em {
  background: var(--nb-cyan-deep) !important;
}

/* 登录 / 注册弹层 */
.nb-body .dialog-login,
.nb-body .dialog-login_content,
.nb-body .dialog-login_form,
.nb-body .dialog-ticket,
.nb-body .dialog-pay,
.nb-body .dialog-vip,
.nb-body .dialog-gift {
  background: var(--nb-panel) !important;
  color: var(--nb-text) !important;
  border-radius: var(--nb-r) !important;
}

.nb-body .dialog-login__header {
  background: transparent !important;
  border-bottom: 1px solid var(--nb-line) !important;
}

.nb-body .dialog-login .form-title h3 {
  color: var(--nb-text) !important;
}

.nb-body .dialog-login .input-block input {
  border: 1px solid var(--nb-line-strong) !important;
  border-radius: var(--nb-r-sm) !important;
  background: rgba(7, 10, 20, .55) !important;
  color: var(--nb-text) !important;
}

.nb-body .dialog-login .submit-btn {
  border: 0 !important;
  border-radius: var(--nb-r-sm) !important;
  background: var(--nb-grad-cyan) !important;
  color: var(--nb-text-invert) !important;
}

.nb-body .dialog-login .form-item.clearfix,
.nb-body .dialog-login .forgot-link a,
.nb-body .dialog-login .remember-link .checkbox {
  color: var(--nb-text-3) !important;
}

/* ==========================================================================
   6. 错误页与提示
   ========================================================================== */
.nb-error {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  min-height: 60vh;
  padding: var(--nb-s9) var(--nb-s5);
  text-align: center;
}

.nb-error__code {
  font: 800 92px/1 var(--nb-font-num);
  letter-spacing: 4px;
  background: var(--nb-grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.nb-error h1 {
  margin-top: var(--nb-s4);
  font-size: var(--nb-f-2xl);
}

.nb-error p {
  margin-top: var(--nb-s3);
  color: var(--nb-text-2);
}

.nb-error__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--nb-s3);
  margin-top: var(--nb-s6);
}

/* ==========================================================================
   7. 响应式
   ========================================================================== */
@media (max-width: 1440px) {
  .nb-rankboard__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1152px) {
  .nb-rankboard__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .nb-ranklines li {
    grid-template-columns: 28px 40px minmax(0, 1fr) auto;
    gap: var(--nb-s3);
  }
}

@media (max-width: 860px) {
  .nb-doc__paper,
  .nb-rankhead,
  .nb-rankboard,
  .nb-updatepage__day {
    padding: var(--nb-s5) var(--nb-s4);
  }

  .nb-rankhead h1 {
    font-size: var(--nb-f-2xl);
  }

  .nb-rankboard__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--nb-s4) var(--nb-s3);
  }
}

@media (max-width: 520px) {
  .nb-rankboard__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nb-error__code {
    font-size: 62px;
  }
}