:root {
    --nr-bg: #ffffff;
    --nr-surface: #ffffff;
    --nr-muted: #f1f1f1;
    --nr-ink: #0a0a0a;
    --nr-ink-soft: #4a4a4a;
    --nr-line: #0a0a0a;
    --nr-accent: #0033ff;
    --nr-accent-hover: #0027c7;
    --nr-accent-soft: #ccff00;
    --nr-accent-ink: #ffffff;
    --nr-footer: #0a0a0a;
    --nr-footer-ink: #f7f7f7;
    --nr-footer-heading: #f7f7f7;
    --nr-footer-copyright: #d6d6d6;
    --nr-shadow: 4px 4px 0 var(--nr-line);
    --nr-shadow-lg: 7px 7px 0 var(--nr-line);
}

:root.dark,
html.dark {
    --nr-bg: #0a0a0a;
    --nr-surface: #141414;
    --nr-muted: #202020;
    --nr-ink: #fafafa;
    --nr-ink-soft: #b5b5b5;
    --nr-line: #fafafa;
    --nr-accent: #ccff00;
    --nr-accent-hover: #b8e600;
    --nr-accent-soft: #293600;
    --nr-accent-ink: #0a0a0a;
    --nr-footer: #050505;
    --nr-footer-ink: #fafafa;
    --nr-footer-heading: #fafafa;
    --nr-footer-copyright: #d6d6d6;
}

html,
body {
    background: var(--nr-bg);
    color: var(--nr-ink);
}

body,
body.bg-white,
body.bg-gray-50,
:root.dark body,
:root.dark body.bg-white,
:root.dark body.bg-gray-50 {
    background-color: var(--nr-bg);
    color: var(--nr-ink);
}

h1,
h2,
h3,
button,
input,
select,
textarea,
nav {
    letter-spacing: 0;
}

a,
button,
input,
select,
textarea {
    border-radius: 0;
}

:focus-visible {
    outline: 3px solid var(--nr-accent);
    outline-offset: 3px;
}

body .rounded,
body .rounded-md,
body .rounded-lg,
body .rounded-xl,
body .rounded-2xl,
body .rounded-3xl,
body .rounded-full,
body .rounded-t-2xl,
body .rounded-t-3xl {
    border-radius: 0;
}

body .bg-white,
body .bg-gray-50 {
    background-color: var(--nr-bg);
}

body .bg-gray-100,
body .bg-gray-200 {
    background-color: var(--nr-muted);
}

:root.dark body .dark\:bg-\[\#171717\],
:root.dark body .dark\:bg-\[\#1f1f1f\],
:root.dark body .dark\:bg-\[\#1f1f1f\]\/85,
:root.dark body .dark\:bg-\[\#1f1f1f\]\/95,
:root.dark body .dark\:bg-gray-800 {
    background-color: var(--nr-surface);
}

:root.dark body .dark\:bg-\[\#262626\],
:root.dark body .dark\:bg-\[\#2a2a2a\],
:root.dark body .dark\:bg-zinc-800 {
    background-color: var(--nr-muted);
}

body .text-gray-900,
body .text-gray-800,
body .text-gray-700,
:root.dark body .dark\:text-white,
:root.dark body .dark\:text-gray-200,
:root.dark body .dark\:text-gray-300 {
    color: var(--nr-ink);
}

body .text-gray-400,
body .text-gray-500,
body .text-gray-600,
:root.dark body .dark\:text-gray-400,
:root.dark body .dark\:text-gray-500,
:root.dark body .dark\:text-gray-600 {
    color: var(--nr-ink-soft);
}

body .border-gray-100,
body .border-gray-200,
body .border-gray-300,
:root.dark body .dark\:border-white\/5,
:root.dark body .dark\:border-white\/10,
:root.dark body .dark\:border-white\/15,
:root.dark body .dark\:border-white\/20,
:root.dark body .dark\:border-gray-700,
:root.dark body .dark\:border-gray-800,
:root.dark body .dark\:border-\[\#2a2a2a\] {
    border-color: var(--nr-line);
}

body .text-\[\#6b3fd4\],
body .text-\[\#7c4dff\],
body .text-\[\#9d6fff\],
body .hover\:text-\[\#6b3fd4\]:hover,
body .hover\:text-\[\#7c4dff\]:hover,
body .hover\:text-\[\#9d6fff\]:hover,
body .group:hover .group-hover\:text-\[\#6b3fd4\],
body .group:hover .group-hover\:text-\[\#7c4dff\],
:root.dark body .dark\:text-\[\#b79cff\],
:root.dark body .dark\:text-\[\#d4c4ff\],
:root.dark body .dark\:hover\:text-\[\#b79cff\]:hover,
:root.dark body .dark\:hover\:text-\[\#d4c4ff\]:hover,
:root.dark body .group:hover .dark\:group-hover\:text-\[\#d4c4ff\] {
    color: var(--nr-accent);
}

body .bg-\[\#6b3fd4\],
body .bg-\[\#7c4dff\],
body .bg-\[\#9d6fff\],
body .hover\:bg-\[\#8a5cf6\]:hover,
:root.dark body .dark\:bg-\[\#b79cff\],
:root.dark body .dark\:bg-\[\#d4c4ff\],
:root.dark body .dark\:hover\:bg-\[\#9d6fff\]:hover,
:root.dark body .dark\:hover\:bg-\[\#7c4dff\]:hover {
    background-color: var(--nr-accent);
    color: var(--nr-accent-ink);
}

body .bg-\[\#7c4dff\]\/10,
body .bg-\[\#9d6fff\]\/10,
body .bg-\[\#b79cff\]\/10,
body .bg-\[\#d4c4ff\]\/10,
body .bg-\[\#d4c4ff\]\/15,
body .hover\:bg-\[\#7c4dff\]\/10:hover,
body .hover\:bg-\[\#d4c4ff\]\/10:hover,
body .hover\:bg-\[\#d4c4ff\]\/15:hover,
body .hover\:bg-\[\#d4c4ff\]\/20:hover,
:root.dark body .dark\:bg-\[\#d4c4ff\]\/15,
:root.dark body .dark\:hover\:bg-\[\#d4c4ff\]\/10:hover,
:root.dark body .dark\:hover\:bg-\[\#d4c4ff\]\/15:hover {
    background-color: var(--nr-accent-soft);
}

body .border-\[\#7c4dff\],
body .focus\:border-\[\#7c4dff\]:focus,
body .hover\:border-\[\#7c4dff\]:hover,
:root.dark body .dark\:border-\[\#b79cff\],
:root.dark body .dark\:border-\[\#d4c4ff\],
:root.dark body .dark\:focus\:border-\[\#d4c4ff\]:focus,
:root.dark body .dark\:hover\:border-\[\#d4c4ff\]:hover {
    border-color: var(--nr-accent);
}

a.bg-gradient-to-r,
button.bg-gradient-to-r,
main#container:has(#tab-bookshelf) a.bg-gradient-to-r {
    background-color: var(--nr-accent);
    background-image: none;
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
    transform: none;
}

a.bg-gradient-to-r:hover,
button.bg-gradient-to-r:hover,
main#container:has(#tab-bookshelf) a.bg-gradient-to-r:hover {
    background-color: var(--nr-accent-hover);
    box-shadow: var(--nr-shadow-lg);
    transform: translate(-3px, -3px);
}

header[data-nl2-header] {
    background: var(--nr-surface);
    border-bottom: 3px solid var(--nr-line);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.noir-header-shell > a img {
    border: 2px solid var(--nr-line);
}

header[data-nl2-header] nav a,
header[data-nl2-header] nav button {
    font-weight: 700;
    text-transform: uppercase;
}

header[data-nl2-header] button:hover,
header[data-nl2-header] nav a:hover {
    color: var(--nr-accent);
}

.noir-search input,
.noir-error-search input {
    background: var(--nr-muted);
    border: 2px solid var(--nr-line);
    color: var(--nr-ink);
}

.noir-search input:focus,
.noir-error-search input:focus {
    border-color: var(--nr-accent);
    box-shadow: 3px 3px 0 var(--nr-accent);
}

.noir-panel {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-mobile-search {
    background: var(--nr-surface);
    border-bottom: 3px solid var(--nr-line);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.noir-mobile-overlay,
.noir-filter-overlay,
.noir-reader-drawer-overlay {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.noir-mobile-overlay {
    z-index: 55;
}

.noir-mobile-panel {
    z-index: 60;
    width: calc(100% - 3rem);
    max-width: 300px;
    background: var(--nr-surface);
    border-left: 2px solid var(--nr-line);
    box-shadow: -7px 0 0 var(--nr-line);
}

.noir-mobile-panel.translate-x-full,
.noir-reader-drawer.translate-x-full {
    transform: translateX(100%);
}

.noir-mobile-panel.translate-x-0,
.noir-reader-drawer.translate-x-0 {
    transform: translateX(0);
}

.noir-reader-sheet,
.noir-filter-drawer {
    background: var(--nr-surface);
    border-top: 2px solid var(--nr-line);
    box-shadow: 0 -7px 0 var(--nr-line);
}

.noir-mobile-nav {
    z-index: 50;
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.noir-mobile-nav a,
.noir-mobile-nav button {
    min-width: 54px;
}

.noir-mobile-nav .bg-\[\#7c4dff\]\/10,
:root.dark .noir-mobile-nav .dark\:bg-\[\#d4c4ff\]\/15 {
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
}

.noir-page-title,
.noir-reader-title,
main#container:has(#login-form) h1,
main#container:has(#register-form) h1,
main#container:has(#tab-bookshelf) h1 {
    color: var(--nr-ink);
    font-weight: 900;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

.noir-page:not(.noir-reader-page) main h2.noir-section-title {
    color: var(--nr-ink);
    font-size: 26px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
    padding-bottom: 6px;
    border-bottom: 4px solid var(--nr-line);
}

.noir-page main h3.noir-section-title {
    color: var(--nr-ink-soft);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
    padding-bottom: 0;
    border-bottom: 0;
}

.noir-reader-sidebar h3 {
    color: var(--nr-ink-soft);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
    padding-bottom: 0;
    border-bottom: 0;
}

.noir-home-content,
.noir-catalog-content,
.noir-search-content,
.noir-detail,
.noir-reader-layout {
    color: var(--nr-ink);
}

.noir-home-section,
.noir-detail-chapters,
.noir-detail-synopsis,
.noir-detail-related {
    scroll-margin-top: 88px;
}

.noir-section-header {
    align-items: flex-end;
    border-bottom: 2px solid var(--nr-line);
}

.noir-section-header .noir-section-title {
    margin-bottom: -2px;
}

.noir-section-header > a {
    color: var(--nr-accent);
    font-weight: 800;
    text-transform: uppercase;
}

.noir-card-grid,
.noir-related-grid {
    row-gap: 28px;
}

a.nl2-book-card {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
    padding: 8px;
    transform: none;
    transition: box-shadow 120ms steps(2), transform 120ms steps(2);
}

a.nl2-book-card:hover {
    box-shadow: var(--nr-shadow-lg);
    transform: translate(-3px, -3px);
}

.noir-book-card-cover {
    background: var(--nr-muted);
    box-shadow: none;
}

.noir-book-card-image,
a.nl2-book-card img {
    filter: grayscale(.35) contrast(1.08);
    transition: filter 140ms linear;
}

a.nl2-book-card:hover .noir-book-card-image,
a.nl2-book-card:focus-visible .noir-book-card-image,
a.nl2-book-card:hover img,
a.nl2-book-card:focus-visible img {
    filter: grayscale(0) contrast(1);
}

.noir-book-card-badge {
    border: 1px solid #ffffff;
    border-radius: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.noir-book-card-featured-badge {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
}

.noir-book-card-rating,
.noir-book-card-views,
.noir-book-card-rank {
    background: #0a0a0a;
    color: #ffffff;
}

.noir-book-card-rank.bg-yellow-500,
a.nl2-book-card .bg-yellow-500 {
    background: var(--nr-accent-soft);
    color: #0a0a0a;
    border-color: var(--nr-line);
}

:root.dark body .noir-book-card-rank.bg-yellow-500,
:root.dark body a.nl2-book-card .bg-yellow-500 {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
}

.noir-book-card-genre,
.noir-detail-genre,
.noir-detail-tag,
.noir-reader-meta > span:first-child {
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
    border: 1px solid var(--nr-line);
    font-weight: 800;
}

.noir-filters {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
    padding: 18px;
}

.noir-filters .noir-section-title {
    font-size: 14px;
    border-bottom-width: 2px;
    padding-bottom: 5px;
}

.noir-filters a,
.noir-filter-drawer a {
    border: 1px solid transparent;
}

.noir-filters a:hover,
.noir-filter-drawer a:hover {
    border-color: var(--nr-line);
    color: var(--nr-accent);
}

.noir-filters .bg-\[\#7c4dff\],
.noir-filter-drawer .bg-\[\#7c4dff\],
:root.dark .noir-filters .dark\:bg-\[\#d4c4ff\],
:root.dark .noir-filter-drawer .dark\:bg-\[\#d4c4ff\] {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
    border-color: var(--nr-line);
}

.noir-filter-drawer .noir-section-title {
    font-size: 18px;
    border-bottom-width: 2px;
}

.noir-filter-drawer .noir-filter-apply {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    background-color: var(--nr-accent);
    background-image: none;
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-filter-drawer .noir-filter-apply:hover {
    background-color: var(--nr-accent-hover);
    color: var(--nr-accent-ink);
    box-shadow: var(--nr-shadow-lg);
    transform: translate(-3px, -3px);
}

:root.dark .noir-filter-drawer .noir-filter-apply,
:root.dark .noir-filter-drawer .noir-filter-apply:hover {
    background-color: var(--nr-accent);
    color: var(--nr-accent-ink);
    border-color: var(--nr-line);
}

.noir-detail-hero {
    border-bottom: 4px solid var(--nr-line);
}

.noir-detail-cover img {
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow-lg);
    filter: grayscale(1) contrast(1.06);
}

.noir-detail-meta > p i {
    color: var(--nr-accent);
}

.noir-detail-stats > div {
    min-width: 78px;
    padding-left: 10px;
    border-left: 2px solid var(--nr-line);
}

.noir-detail-meta a.bg-gradient-to-r,
.noir-error-content > a.bg-gradient-to-r {
    min-height: 48px;
}

.noir-detail-meta .btn-add-bookcase,
.noir-detail-chapters a.rounded-lg,
.noir-error-content > div.mt-6 a {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-detail-meta .btn-add-bookcase:hover,
.noir-detail-chapters a.rounded-lg:hover,
.noir-error-content > div.mt-6 a:hover {
    color: var(--nr-accent);
    box-shadow: var(--nr-shadow-lg);
    transform: translate(-3px, -3px);
}

.noir-chapter-row {
    border-bottom: 2px solid var(--nr-line);
}

.noir-chapter-row:hover {
    background: var(--nr-accent-soft);
}

.noir-chapter-row:hover span {
    color: var(--nr-ink);
}

.noir-synopsis-body {
    min-width: 0;
    max-width: 100%;
    padding-left: 18px;
    border-left: 4px solid var(--nr-accent);
    color: var(--nr-ink);
    overflow-wrap: anywhere;
    word-break: break-word;
}

.noir-related-item img {
    border: 2px solid var(--nr-line);
    box-shadow: 3px 3px 0 var(--nr-line);
    filter: grayscale(1) contrast(1.06);
}

.noir-related-item:hover img {
    filter: none;
    transform: translate(-2px, -2px);
}

.noir-error-code {
    display: inline-block;
    padding: 8px 18px;
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow-lg);
}

.noir-error-search button {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-error-panel,
.noir-doc {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-doc {
    padding: 24px;
}

.noir-error-panel .noir-section-title {
    font-size: 18px;
    border-bottom-width: 2px;
}

.noir-reader-shell {
    background: var(--nr-bg);
}

.noir-reader-progress {
    background: var(--nr-muted);
    border-bottom: 1px solid var(--nr-line);
}

#reading-progress-fill {
    background: var(--nr-accent);
    box-shadow: none;
}

.noir-reader-header {
    border-left-color: var(--nr-accent);
}

.noir-reader-toolbar,
.noir-reader-side-panel,
.noir-reader-nav-card,
.noir-reader-back-link {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

.noir-reader-tool-btn,
.noir-reader-toolbar .btn-bookmark,
.noir-reader-chapter-list-button,
.noir-reader-settings-button {
    background: var(--nr-surface);
    color: var(--nr-ink);
    border: 2px solid var(--nr-line);
    box-shadow: 2px 2px 0 var(--nr-line);
}

.noir-reader-tool-btn:hover,
.noir-reader-toolbar .btn-bookmark:hover,
.noir-reader-chapter-list-button:hover,
.noir-reader-settings-button:hover {
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
    transform: translate(-2px, -2px);
}

.noir-reader-tools {
    border-color: var(--nr-line);
}

.noir-reader-nav-footer #next_chap,
.noir-reader-settings-button {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
}

.noir-reader-nav-footer #next_chap span,
.noir-reader-nav-footer #next_chap i,
.noir-reader-settings-button i {
    color: var(--nr-accent-ink);
}

.noir-reader-copy {
    color: var(--nr-ink);
}

.noir-reader-drawer {
    background: var(--nr-surface);
    border-left: 2px solid var(--nr-line);
    box-shadow: -7px 0 0 var(--nr-line);
}

.noir-reader-drawer-header,
.noir-reader-panel-header {
    border-bottom: 2px solid var(--nr-line);
}

.noir-reader-chapter-list a:hover,
.noir-reader-drawer-body a:hover {
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
}

.chr-nav select.chr-jump {
    max-width: 220px;
    height: 40px;
    padding: 0 12px;
    background: var(--nr-muted);
    color: var(--nr-ink);
    border: 2px solid var(--nr-line);
    border-radius: 0;
    font-size: 14px;
    font-weight: 700;
}

#share-toast {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
    border-radius: 0;
    box-shadow: var(--nr-shadow);
}

main#container:has(#login-form),
main#container:has(#register-form),
main#container:has(#tab-bookshelf) {
    background: var(--nr-bg);
    color: var(--nr-ink);
}

main#container:has(#login-form) > div > div:first-child,
main#container:has(#register-form) > div > div:first-child {
    background: var(--nr-bg);
    border-right: 3px solid var(--nr-line);
}

main#container:has(#login-form) > div > div:first-child > div,
main#container:has(#register-form) > div > div:first-child > div {
    background: var(--nr-accent-soft);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow-lg);
    padding: 32px;
}

main#container:has(#login-form) > div > div:first-child span.bg-gradient-to-r,
main#container:has(#register-form) > div > div:first-child span.bg-gradient-to-r {
    background: none;
    color: var(--nr-accent);
    -webkit-text-fill-color: currentColor;
}

main#container:has(#login-form) div:has(> #login-form),
main#container:has(#register-form) div:has(> #register-form) {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow-lg);
}

#login-form input:not([type="checkbox"]),
#register-form input {
    background: var(--nr-muted);
    color: var(--nr-ink);
    border: 2px solid var(--nr-line);
    box-shadow: none;
}

#login-form input:not([type="checkbox"]):focus,
#register-form input:focus {
    border-color: var(--nr-accent);
    box-shadow: 3px 3px 0 var(--nr-accent);
}

#login-form input[type="checkbox"] {
    accent-color: var(--nr-accent);
}

main#container:has(#login-form) .error-message,
main#container:has(#register-form) .error-message {
    color: #b42318;
}

:root.dark main#container:has(#login-form) .error-message,
:root.dark main#container:has(#register-form) .error-message {
    color: #ff8a8a;
}

#login-form button[type="submit"],
#register-form button[type="submit"] {
    background: var(--nr-accent);
    background-image: none;
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

#login-form button[type="submit"]:hover,
#register-form button[type="submit"]:hover {
    background: var(--nr-accent-hover);
    box-shadow: var(--nr-shadow-lg);
    transform: translate(-3px, -3px);
}

main#container:has(#tab-bookshelf) > div > section,
main#container:has(#tab-bookshelf) > div > .grid > div,
main#container:has(#tab-bookshelf) .tab-content > div.bg-white {
    background: var(--nr-surface);
    border: 2px solid var(--nr-line);
    box-shadow: var(--nr-shadow);
}

main#container:has(#tab-bookshelf) > div > section h2 {
    font-size: 20px;
    text-transform: none;
    border: 0;
    padding-bottom: 0;
}

main#container:has(#tab-bookshelf) > div > section > div:first-child {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
    border: 2px solid var(--nr-line);
}

main#container:has(#tab-bookshelf) .section-tabs {
    border-bottom: 4px solid var(--nr-line);
}

main#container:has(#tab-bookshelf) .section-tabs .tab {
    color: var(--nr-ink-soft);
    border-color: transparent;
    font-weight: 800;
    text-transform: uppercase;
}

main#container:has(#tab-bookshelf) .section-tabs .tab.active {
    background: var(--nr-accent-soft);
    color: var(--nr-ink);
    border-color: var(--nr-line);
}

main#container:has(#tab-bookshelf) [id^="bookcase-row-"] a.nl2-book-card {
    height: auto;
}

main#container:has(#tab-bookshelf) [id^="bookcase-row-"] > div.h-1 > div {
    background: var(--nr-accent);
}

footer.noir-footer {
    background: var(--nr-footer);
    color: var(--nr-footer-ink);
    border-top: 4px solid #0033ff;
}

:root.dark footer.noir-footer {
    background: var(--nr-footer);
    color: var(--nr-footer-ink);
    border-top-color: #ccff00;
}

footer.noir-footer h2,
footer.noir-footer h3,
footer.noir-footer p,
footer.noir-footer span,
footer.noir-footer .text-gray-300,
footer.noir-footer .text-gray-400,
footer.noir-footer .text-gray-500 {
    color: var(--nr-footer-ink);
}

footer.noir-footer a {
    color: #d6d6d6;
}

footer.noir-footer a:hover,
footer.noir-footer .text-\[\#d4c4ff\] {
    color: var(--nr-accent);
}

footer.noir-footer .noir-footer-heading {
    color: var(--nr-footer-heading);
}

footer.noir-footer .noir-footer-copyright {
    color: var(--nr-footer-copyright);
}

footer.noir-footer .bg-\[\#7c4dff\] {
    background: var(--nr-accent);
    color: var(--nr-accent-ink);
    border: 1px solid var(--nr-accent);
}

footer.noir-footer .border-\[\#7c4dff\] {
    border-color: var(--nr-accent);
}

.noir-reader-breadcrumb > span:last-child {
    flex: 1 1 auto;
    min-width: 0;
}

.noir-reader-breadcrumb > span:last-child > a {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.noir-reader-title,
.noir-reader-title .chr-text {
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (min-width: 768px) {
    .noir-reader-article {
        padding-left: 24px;
        border-left: 4px solid var(--nr-line);
    }
}

@media (max-width: 640px) {
    .noir-page:not(.noir-reader-page) main h2.noir-section-title {
        font-size: 22px;
    }

    .noir-card-grid {
        column-gap: 14px;
        row-gap: 24px;
    }

    .noir-filters {
        box-shadow: none;
    }

    .chr-nav select.chr-jump {
        max-width: 150px;
    }

    main#container:has(#login-form) div:has(> #login-form),
    main#container:has(#register-form) div:has(> #register-form) {
        box-shadow: var(--nr-shadow);
    }
}

@media (max-width: 374px) {
    #tab-bar.noir-list-tabs {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 0;
        row-gap: 0;
        overflow-x: visible;
    }

    #tab-bar.noir-list-tabs > a {
        min-width: 0;
        padding-left: 2px;
        padding-right: 2px;
        text-align: center;
        font-size: 12px;
    }

    #tab-bar.noir-list-tabs #open-filters {
        grid-column: 1 / -1;
        width: 100%;
        justify-content: center;
        margin: 8px 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    a.nl2-book-card,
    a.nl2-book-card img,
    .noir-book-card-image,
    .noir-related-item img,
    .noir-mobile-panel,
    .noir-mobile-overlay,
    .noir-reader-sheet,
    .noir-reader-drawer,
    .noir-reader-drawer-overlay,
    [data-nl2-reader-overlay],
    [data-nl2-reader-sheet],
    .noir-filter-drawer,
    .noir-filter-overlay,
    #drawer-overlay,
    .noir-reader-tool-btn,
    .noir-reader-nav-card,
    .noir-reader-back-link,
    .noir-reader-chapter-list-button,
    .noir-reader-settings-button,
    #reading-progress-fill,
    #share-toast,
    #share-toast.show {
        transition: none;
        transition-property: none;
        transition-duration: 0s;
        animation: none;
    }
}