/* リセット */

#content h1
 {
    line-height: 1em;
    margin-bottom: 0.3em;
}

h1.n2brnext-book-title{
  margin-bottom: 0em;
}

.post_content h2,
#content h2 {
  margin:0;
  font-size: large;
  margin-bottom: 0.5em;
}

.post_content h4 {
    margin: 1em;
    border-bottom: 1px solid;
    font-size: 1.2em;
}


.top #content {
    padding-top: 1em;
}

.l-mainContent__inner>.post_content{
  margin: 0;
}

h1.n2brnext-archive-title {
    font-size: 1.4em;
}

.dummy-heading
 {
    text-align: right;
    font-size: small;
    color: gray;
}

@media (min-width: 600px) {
    .l-content {
        padding-top: 1em;
    }
}

@media screen and (max-width: 959px) {
    .l-header__logo {
        order: 2;
        text-align: center;
        margin-left: 4em;
    }
    .l-header__menuBtn{
        position: fixed;
        top: 0.2em;
        left: 0.2em;
        background-color: #ffffffba;
        border: none;
        z-index: 1;
        order: 1;
    }
}

div.n2brnext-shiori-info {
    float: left;
    /* IDからclassへ変更し複数設置に対応 */
}


#n2brnext-reader,
#n2brnext-line-reader,
#n2brnext-line-measure {
    --n2br-font-size: 1em;
    --n2br-line-height: 1.8em;
    --n2br-paragraph-margin: 1em;
    --n2br-indent: 1em;
    /* 初期フォントを游ゴシックに設定 */
    --n2br-font-family: 'Yu Gothic', sans-serif;
    --n2br-break-margin: 1em;
    font-size: var(--n2br-font-size);
    line-height: var(--n2br-line-height);
    font-family: var(--n2br-font-family);
}

#n2brnext-reader {
  padding: 0em 0.5em;
}

.n2brnext-illustration {
    display: block;
    text-align: center;
    margin: 1.5em auto;
}

.n2brnext-illustration img {
    max-width: 100%;
    height: auto;
}

#n2brnext-reader img.illustration,
#n2brnext-line-reader img.illustration {
    cursor: zoom-in;
}

.n2brnext-line-measure {
    position: absolute;
    visibility: hidden;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
}

.n2brnext-illustration-caption {
    display: block;
    margin-top: 0.5em;
    font-size: 0.9em;
    color: var(--n2br-font-color);
}

#n2brnext-load-more {
    display: block;
    margin-top: 1em;
}

ul, li {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* 著者ページ: メタ情報（ローマ字・よみ・生没年・作品数）を縦並び表示 */
.n2brnext-author-meta {
    display: flex;
    flex-direction: column;
    gap: 0.2em;
    margin-top: 0.4em;
}
.n2brnext-archive-header { margin-bottom: 0.8em; }
.n2brnext-author-head { margin-top: 0.6em; margin-bottom: 0.6em; }
.n2brnext-author-basic { margin-bottom: 1em; }
.n2brnext-author-actions { margin-top: 0.4em; margin-bottom: 0.4em; }
.n2brnext-author-summary { margin-top: 0.8em; margin-bottom: 0.8em; }
.n2brnext-author-summary-ai {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.4em;
    padding: 0.2em;
    border: none;
    background: transparent;
    color: #ff82af;
    cursor: pointer;
    text-decoration: none;
}
.n2brnext-author-summary-ai .material-symbols-outlined {
    font-size: 1.3em;
    line-height: 1;
}
.n2brnext-author-summary-ai:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}
.n2brnext-author-line {
    font-size: 0.95em;
    color: var(--n2br-font-color);
}
.n2brnext-author-line .label {
    font-weight: bold;
}
.n2brnext-author-line.-wiki,
.n2brnext-author-access {
    font-size: 0.9em;
}
.n2brnext-author-access { margin-top: 0.6em; }

/* 作品数リンクの軽微な装飾 */
a.n2brnext-jump-to-list { text-decoration: underline; }

/* アーカイブコンテンツの上側余白とボーダー */
.p-archiveContent.n2brnext-archive-content {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #ddd;
}

/* 並べ替えフィールドの直下にページ情報 */
.n2brnext-archive-page-info {
    margin-top: 0.4em;
    font-size: 0.9em;
    color: var(--n2br-font-color);
}

.n2brnext-book-search-form {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    gap: 0.6em;
}

.n2brnext-book-search-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.6em;
}

.n2brnext-book-search-row input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
}

.n2brnext-book-search-submit {
    margin: 0;
    white-space: nowrap;
}

.n2brnext-book-search-options {
    display: flex;
    align-items: center;
}


:root {
    --n2br-gap: 0.3em;
    --n2br-footer-bg: #1d2327;
    --n2br-footer-color: #fff;
    --n2br-footer-padding: 0.3em;
    --n2br-footer-right-padding: 0em;
    --n2br-footer-min-height: 40px;
    --n2br-footer-height: var(--n2br-footer-min-height); /* JSで更新 */
    --n2brnext-viewport-height: 100vh;
    --n2brnext-viewport-bottom-offset: 0px;
    --n2br-button-bg: #333;
    --n2br-button-color: #fff;
    --n2br-border-color: #ccc;
    --n2br-toggle-bg: #888;
    --n2br-switch-border: #dbdbdb;
    --n2br-font-color: #333;
    --n2br-margin-s: 0.5em;
    --n2br-margin-n: 1.5em;
}

button {
    font-weight: bold;
    background-color: #979797;
    color: #fff;
    margin: 0;
    margin-left: var(--n2br-gap);
}

.n2brnext-top-reader-menu{
  margin-bottom: 1em;
}

button.n2brnext-top-reader-toggle {
    margin: 0;
    line-height: 1.4em;
    padding: 0.1em 1em;
}

.n2brnext-top-reader-controls {
    line-height: 1.4em;
    padding: 0.5em;
    border: 1px solid hsla(0, 0%, 78%, .5);
}

.n2brnext-top-reader-controls .n2brnext-top-reader-link {
    font-weight: bold;
}

.n2brnext-resume-notice {
    margin: 0 0 1.5em;
    font-size: 0.9em;
    color: #666;
}

.n2brnext-line-resume-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9000;
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.35);
    padding: 1.5em;
    box-sizing: border-box;
}

.n2brnext-line-resume-overlay-body {
    width: min(90vw, 520px);
    background: rgba(34, 34, 34, 0.95);
    color: #fff;
    border-radius: 12px;
    padding: 1.4em 1.6em;
    text-align: center;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
    line-height: 1.65;
    font-size: 0.95em;
}

.n2brnext-line-resume-overlay-text {
    margin: 0;
}

.n2brnext-line-resume-overlay-links {
    margin-top: 1em;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.8em;
}

.n2brnext-line-resume-overlay-links a {
    color: #ffe082;
    text-decoration: underline;
}

.n2brnext-line-resume-overlay-links a:hover,
.n2brnext-line-resume-overlay-links a:focus {
    color: #fff59d;
}

.n2brnext-line-resume-overlay-separator {
    color: rgba(255, 255, 255, 0.65);
}

section.n2brnext-book-taxonomy {
    margin-bottom: 1em;
    line-height: 1.5em;
}

.n2brnext-book-taxonomy-widgets {
    margin-bottom: 1.3em;
}

#n2brnext-footer {
    position: fixed;
    bottom: 0;
    bottom: calc(env(safe-area-inset-bottom, 0px) + var(--n2brnext-viewport-bottom-offset, 0px));
    left: 0;
    right: 0;
    width: 100%;
    border-top: 1px solid var(--n2br-border-color);
    padding: var(--n2br-footer-padding);
    padding-bottom: calc(var(--n2br-footer-padding) + env(safe-area-inset-bottom, 0px));
    margin: 0;
    box-sizing: border-box;
    z-index: 10001; /* 行リーダーより前面に表示 */
    font-size: 0.8em;
    padding-right: var(--n2br-footer-right-padding);
    min-height: var(--n2br-footer-min-height);
    background-color: var(--n2br-footer-bg);
    color: var(--n2br-footer-color);
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#n2brnext-footer hr {
    margin: 0.2em;
}

#n2brnext-footer #n2brnext-progress {
    margin-top: 0;
}

#n2brnext-foot-panels {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#n2brnext-foot-panels .n2brnext-bottom-menu {
    flex: 1;
}
#n2brnext-foot-panels > .bottom-align-center {
    height: 100%;            /* フッターと同じ高さに */
}
#n2brnext-foot-panels > .bottom-align-center:not(.n2brnext-hidden) {
    display: flex;           /* 子要素を縦方向中央にするためフレックス化 */
    align-items: center;
}

/* --------------------------------------------
 * タクソノミーアーカイブのレイアウト調整
 * -------------------------------------------- */
.n2brnext-archive .n2brnext-archive-list {
    display: grid;
    gap: 0;
}

.n2brnext-archive .n2brnext-archive-item {
    padding: 1.5em 0;
    border-bottom: 1px solid #dcdcdc;
}

.n2brnext-archive .n2brnext-archive-item:last-child {
    border-bottom: none;
}

.n2brnext-archive .n2brnext-archive-item + .n2brnext-archive-item {
    margin-top: 0.5em;
}

/* --------------------------------------------
 * 著者一覧・ページネーション（ショートコード用）
 * テーマの .navigation.pagination に合わせて横並びになるよう最低限整える
 * -------------------------------------------- */
.n2brnext-archive-pagination {
    width: 100%;
    margin: 1.2em 0 0.8em;
}

/* 著者一覧 表示の微調整 */
.n2brnext-author-list-items {
    padding:20px;
    list-style: none;
}
.n2brnext-author-list-item .-meta,
.n2brnext-author-list-item .-dates {
    display: none; /* 旧表示は隠す */
}
.n2brnext-author-list-item .n2brnext-author-meta2 {
    margin-left: 0.3em;
}
.n2brnext-author-list-item .n2brnext-author-meta2 .-dates2 {
    margin-left: 0.3em;
}
.n2brnext-author-list-item .n2brnext-author-favorite {
    margin-left: 0.5em;
}
.n2brnext-author-list-controls {
    margin-bottom: 0.8em;
}
.n2brnext-author-list-sorts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6em;
    align-items: center;
}
.n2brnext-author-list-sort-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6em;
}
.n2brnext-author-list-sort-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6em;
}
.n2brnext-author-sort-select,
.n2brnext-author-order-select {
    min-width: 140px;
    padding: 0.35em 0.5em;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 0.95em;
}
.n2brnext-author-sort-submit {
    padding: 0.35em 0.9em;
    border: 1px solid #2a4a92;
    border-radius: 4px;
    background: #2a4a92;
    color: #fff;
    font-size: 0.95em;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.n2brnext-author-sort-submit:hover,
.n2brnext-author-sort-submit:focus-visible {
    background: #1f3770;
    color: #fff;
    outline: none;
}
.n2brnext-archive-pagination .nav-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center; /* 中央寄せ */
    gap: 0.6rem;
}
.n2brnext-archive-pagination .nav-links .page-numbers {
    display: inline-flex;              /* 中央揃えしやすく */
    align-items: center;
    justify-content: center;
    min-width: 2.4em;                  /* 数字ボタンの最低幅を統一 */
    height: 2.4em;                     /* 高さを統一 */
    padding: 0 0.6em;                  /* 前/次などテキスト長に対応 */
    font-size: 0.95rem;
    line-height: 1;                    /* 高さ合わせ */
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    background: #eee;
    color: #333;
    text-decoration: none;
    box-sizing: border-box;
}
.n2brnext-archive-pagination .nav-links .page-numbers.current {
    background: #333;
    color: #fff;
    border-color: #333;
}
.n2brnext-archive-pagination .nav-links .page-numbers.dots {
    background: transparent;
    border: none;
    min-width: auto;
    height: auto;
    padding: 0 0.3em;
}
.n2brnext-archive-pagination .nav-links .page-numbers.prev,
.n2brnext-archive-pagination .nav-links .page-numbers.next {
    min-width: 3.2em; /* 前/次の幅は少し広め */
}

.n2brnext-archive-status-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75em;
}

.n2brnext-archive .n2brnext-archive-status-buttons {
    margin-top: 0.5em;
}

.n2brnext-book-status-buttons {
    margin: 1.5em 0;
}

.n2brnext-reader-complete-status {
    justify-content: center;
    margin: 2em auto 0;
}

.n2brnext-archive-status-buttons .n2brnext-archive-status-control {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}

.n2brnext-archive .n2brnext-archive-pagination {
    margin-top: 2em;
}

.n2brnext-archive .n2brnext-archive-pagination .navigation.pagination {
    display: flex;
    justify-content: center;
}

.n2brnext-archive .n2brnext-archive-pagination .nav-links {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
}

.n2brnext-archive .n2brnext-archive-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5em;
    padding: 0.5em 0.75em;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    background-color: #fff;
    color: inherit;
    text-decoration: none;
    box-sizing: border-box;
}

.n2brnext-archive .n2brnext-archive-pagination .page-numbers:hover {
    background-color: #f0f0f0;
}

.n2brnext-archive .n2brnext-archive-pagination .page-numbers.current {
    background-color: #333;
    border-color: #333;
    color: #fff;
}

.n2brnext-archive .n2brnext-archive-pagination .page-numbers.prev,
.n2brnext-archive .n2brnext-archive-pagination .page-numbers.next {
    padding-inline: 1em;
}

.n2brnext-archive .n2brnext-archive-status-control .n2brnext-status-btn,
.n2brnext-archive-status-buttons .n2brnext-archive-status-control .n2brnext-status-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25em 0.65em;
    font-size: 0.9rem;
    line-height: 1.2;
    min-height: auto;
    white-space: nowrap;
}

.n2brnext-archive .n2brnext-status-count,
.n2brnext-archive-status-buttons .n2brnext-status-count {
    font-size: 0.85rem;
    line-height: 1.2;
}
#n2brnext-foot-panels > .bottom-align-center:not(.n2brnext-hidden) > div {
    height: 100%;
    display: flex;
    align-items: center;     /* テキストを縦方向中央に */
}

body.n2brnext-illustration-modal-open {
    overflow: hidden;
}

.n2brnext-illustration-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: 10002; /* フッターより前面に表示 */
    padding: 2em;
    box-sizing: border-box;
}

.n2brnext-illustration-modal.is-open {
    display: flex;
}

.n2brnext-illustration-modal__dialog {
    position: relative;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.n2brnext-illustration-modal__image {
    max-width: 90vw;
    max-height: 90vh;
    width: auto;
    height: auto;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
    border-radius: 4px;
}

.n2brnext-illustration-modal__close {
    position: absolute;
    top: -1.5em;
    right: -1.5em;
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    font-size: 1.5em;
    line-height: 1;
    border: none;
    cursor: pointer;
}

.n2brnext-illustration-modal__close:focus {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

#n2brnext-footer .n2brnext-foot-switch {
    background: #888;
    width: 2.5em;
    margin-left: var(--n2br-gap);
}

#n2brnext-toc {
    position: fixed;
    right: 1em;
    bottom: 3em;
    width: 250px;
    max-height: 50vh;
    overflow: auto;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    padding: 0.5em;
    z-index: 11000;
}
#n2brnext-close-toc {
    position: sticky;
    top: 0em; /* 目次がスクロールしても常に右上に表示 */
    margin-left: 83%;
    background: #a3a3a380;
    border: none;
    line-height: 1.6em;
    font-size: 1.2em;
    text-align: center;
    cursor: pointer;
    z-index: 11001;
}
#n2brnext-footer button,
.n2brnext-bottom-menu button {
    background: var(--n2br-button-bg);
    color: var(--n2br-button-color);
    font-size: 1em;
    margin-right: var(--n2br-gap);
    margin-bottom: 0;
}

#n2brnext-fixed-buttons {
    position: fixed;
    margin-bottom: var(--n2br-gap);
    right: var(--n2br-gap);
    bottom: calc(var(--n2br-footer-height) + var(--n2br-gap)); /* フッター高さに応じて配置 */
    display: flex;
    gap: var(--n2br-gap);
    z-index: 10000; /* 行リーダーより前面・右パネルと目次より背面に配置 */
    font-size: 0.8em;
    height: 2.8em; /* 高さを調整 */
}
#n2brnext-fixed-buttons button {
    margin: 0;
    height:100%;
}

/* 固定ボタン領域 */
.n2brnext-visually-hidden {
    /* アクセシビリティ対応: 画面外に退避しつつ読み上げ対象にする */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

#n2brnext-fixed-buttons-1 {
    display: flex;
}
.n2brnext-foot-switch-set {
    display: flex;
    flex: 1;
    position: relative; /* サブメニューをトグルボタンと左揃えにするため基準を持たせる */
}

.n2brnext-foot-switch-buttons {
    color:var(--n2br-font-color);
    position: absolute;
    bottom: 0; /* 表示位置は JS 側で必要に応じて調整 */
    left: 0;
    display: flex;
    flex-direction: column;
    gap: var(--n2br-gap);
    border-radius: 3px 3px 0 3px;
    border: 1px solid var(--n2br-switch-border);
    padding: 5px;
    background: #fff;
    width: 100px;
}

.n2brnext-foot-switch-set[data-dropdown="down"] .n2brnext-foot-switch-buttons {
    top: calc(100% + var(--n2br-gap, 0.5em));
    bottom: auto;
}

.n2brnext-foot-switch-buttons.n2brnext-hidden {
    display: none;
}

.n2brnext-share-set {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.n2brnext-share-title {
    font-size: 0.85em;
    font-weight: 600;
}

.n2brnext-share-list {
    display: flex;
    flex-direction: column;
    gap: 0.35em;
}

.n2brnext-share-button {
    display: flex;
    align-items: center;
    gap: 0.35em;
    width: 100%;
    padding: 0.35em 0.5em;
    border: 1px solid var(--n2br-switch-border);
    border-radius: 4px;
    background: #f7f7f7;
    color: inherit;
    font-size: 0.95em;
    text-align: left;
    cursor: pointer;
}

.n2brnext-share-button .material-symbols-outlined {
    font-size: 1.2em;
}

.n2brnext-share-feedback {
    font-size: 0.75em;
    line-height: 1.3;
    color: inherit;
}

.n2brnext-share-feedback-error {
    color: #c0392b;
}

.n2brnext-foot-switch-toggle {
}

#n2brnext-fixed-buttons-1 .n2brnext-foot-switch-set {
    flex: 0 0 auto;
    height: 100%;
}

#n2brnext-fixed-buttons-1 .n2brnext-foot-switch-toggle {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.75em;
}

#n2brnext-fixed-buttons-1 .n2brnext-foot-switch-buttons {
    left: auto;
    right: 0;
    bottom: calc(100% + var(--n2br-gap, 0.5em));
}

#n2brnext-fixed-buttons-1 .n2brnext-foot-switch-buttons button {
    width: 100%;
}

#n2brnext-fixed-buttons-1 .n2brnext-shiori-info {
    white-space: nowrap;
}

.n2brnext-bottom-menu {
}

#n2brnext-foot-format-menu { /* フッター上に展開する書式パネル */
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    background-color: #fff;
    color: #333;
    padding: 0.3em 1em;
    z-index: 100001;
}

#n2brnext-footer #n2brnext-foot-format-menu button#n2brnext-format-close{
    background: var(--n2br-button-bg);
    color: var(--n2br-button-color);
    position: absolute;
    left: 0; /* 書式パネル左上に配置 */
    bottom: 100%;
    margin: 0;
    min-width: 2.5em;
    height: 3em;
}


#n2brnext-sentinel {
    height: 1px;
}


#n2brnext-progress .bar {
    position: relative;
    height: 100%;
    width: 0;
    background: #9aacbd;
    overflow: visible;
}

/* プログレスバーのクリック位置を示すハンドル */
#n2brnext-progress .progress-handle,
#n2brnext-chapter-progress .progress-handle {
    position: absolute;
    top: 50%;
    right: 0;
    left: auto;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #9aacbd;
    transform: translate(50%, -50%);
    pointer-events: none;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.6);
}

#n2brnext-progress {}
#n2brnext-chapter-progress {}

#n2brnext-chapter-progress,
#n2brnext-progress {
    top: -0.5em;
    flex: 1;
    height: 4px;
    background: #eee;
    margin-top: 0.3em;
    position: relative;
    cursor: pointer;
}


#n2brnext-chapter-progress .bar {
    position: relative;
    height: 100%;
    width: 0;
    background: #9aacbd;
    overflow: visible;
}

.progress-text{
    /* background: #31313191; */
    position: absolute;
    right: 0;
    top: 1px;
    font-size: 1em;
}

#n2brnext-chapter-progress-text {
}

#n2brnext-progress-text {
}

.n2brnext-progress-container {
    display: flex;
    align-items: center;
}

.n2brnext-progress-label {
    margin-right: 0.3em;
    font-size: 1em;
    white-space: nowrap;
}

.n2brnext-toc {
    list-style: none;
    padding-left: 0;
    margin: 0;
    font-size: 0.8em;
}
.n2brnext-toc li {
    margin-bottom: 0.3em;
}
.n2brnext-toc .toc-level-4 {
    margin-left: 1em;
}
.n2brnext-toc .toc-level-5 {
    margin-left: 2em;
}

/*目次装飾*/

/* .n2brnext-toc {
  list-style: none;
  padding-left: 0;
  margin: 0;
  font-size: 0.95em;
} */

ul.n2brnext-toc {
  padding: 0;
}

.n2brnext-toc li {
  border-bottom: 1px solid #ddd;
  position: relative;
  transition: background 0.2s ease;
  --progress: 0%;
}

.n2brnext-toc li::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: var(--progress);
  background: #3f94ff;
  pointer-events: none; /* クリック判定を妨げない */
}

.n2brnext-toc li:hover {
  background: #f5faff;
}

/* 目次項目を横幅全体でクリックできるようにする */
.n2brnext-toc a {
  display: block;
  padding: 0.2em 0.6em;
  text-decoration: none;
  color: #333;
  transition: color 0.2s ease;
}

.n2brnext-toc-label {
  display: block;
  padding: 0.2em 0.6em;
  color: #333;
}

.n2brnext-toc-char-count {
  display: inline-block;
  margin-left: 0.5em;
  color: #888;
  font-size: 0.85em;
  white-space: nowrap;
}

.n2brnext-toc a:hover {
  color: #007acc;
}

.n2brnext-toc a.active-toc {
  font-weight: bold;
  background: #ffcc00;
  color: #007acc;
}

.n2brnext-toc li::before {
  content: "›";
  color: #ccc;
  margin-right: 0.5em;
  position: absolute;
  left: 0;
}



.n2brnext-error {
    color: red;
    margin-top: 1em;
}

.n2brnext-toggle-toc {
    margin-bottom: 0.5em;
    /* class化により複数ボタン対応 */
}

.n2brnext-hidden {
    display: none !important;
}

/* 「◁戻る」を閉じる✕ボタン */
.n2brnext-return-close {
    margin-left: 0.5em;
}

.n2brnext-current-line {
    /* background: #fff3cd; */
    background: #ffffff;
}

#n2brnext-line-reader .n2brnext-current-line {
    background: transparent;
}

/* スクロール境界行の強調表示 */
.n2brnext-scroll-boundary {
    position: absolute;
    background: #fff3cd;
    pointer-events: none;
    z-index: 2;
    opacity: 1;
    transition: opacity 0.5s; /* JSのフェード時間に合わせる */
}
.n2brnext-scroll-boundary.n2brnext-vertical {
    width: 3px;
    height: 100%;
    top: 0;
}
.n2brnext-scroll-boundary:not(.n2brnext-vertical) {
    height: 3px;
    width: 100%;
    left: 0;
}

.n2brnext-scroll-boundary.n2brnext-fade-out {
    opacity: 0;
}

/* 指定行を一時的に強調表示 */
.n2brnext-highlight {
    background-color: #cce5ff;
    transition: background-color 0.4s ease-out;
}

#n2brnext-line-reader .n2brnext-current-line.n2brnext-highlight {
    background-color: #cce5ff;
}

#n2brnext-loading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 0.5em 1em;
    border-radius: 4px;
    z-index: 100500;
}



/* 行選択メッセージ */

.n2brnext-msg-wrap {
    position: fixed;
    top: 30%; /* トーストと重ならないように表示 */
    left: 0;
    width: 100%;
    z-index: 100500;
    display: flex;
    justify-content: center;
    pointer-events: none;
}

.n2brnext-msg {
    max-width: 90%;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 0.5em 1em;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 0.5em;
    pointer-events: auto;
}

.n2brnext-msg-text {
    pointer-events: none;
}

.n2brnext-msg-actions {
    display: flex;
    gap: 0.5em;
    margin-left: auto;
}

.n2brnext-msg-close {
    pointer-events: auto;
    background: none;
    border: 1px solid #fff; /* 枠線でボタンらしく表示 */
    color: #fff;
    cursor: pointer;
    border-radius: 3px;
    padding: 0 0.3em;
}

.n2brnext-msg-ok {
    pointer-events: auto;
    background: var(--n2br-button-bg);
    border: none;
    color: #fff;
    cursor: pointer;
    border-radius: 3px;
    padding: 0 0.6em;
}

/* 現在の章をハイライト */
.n2brnext-current-chapter {
    background: #e2ffe2;
}
#n2brnext-line-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh; /* JSでフッター高さを差し引く */
    background: #fff;
    border: 1px solid #ccc;
    padding: 1em;
    box-sizing: border-box;
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
}
#n2brnext-line-wrapper.n2brnext-hidden { display: none; }

body.n2brnext-line-mode header#header,
body.n2brnext-line-mode #wpadminbar {
    display: none;
}
#n2brnext-line-wrapper .n2brnext-line-top-controls {
    position: absolute;
    top: 0.2em;
    right: 0.2em;
    display: flex;
    align-items: center;
    gap: 0.1em;
    z-index: 1;
}

#n2brnext-line-wrapper .n2brnext-line-bookmark-set {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

#n2brnext-line-wrapper .n2brnext-line-top-controls > button,
#n2brnext-line-wrapper .n2brnext-line-top-controls .n2brnext-foot-switch-toggle {
    background-color: #fff;
    color: #666;
    border: 1px solid #ccc;
    padding: 0.1em 0.4em;
    min-width: 2.6em;
    display: flex;
    align-items: center;
    justify-content: center;
}

#n2brnext-line-wrapper .n2brnext-line-bookmark-set .n2brnext-foot-switch-buttons {
    left: auto;
    right: 0;
}

#n2brnext-line-wrapper.n2brnext-focus .n2brnext-line-bookmark-set {
    display: none;
}
#n2brnext-line-wrapper.n2brnext-focus {
    width: 100vw;
    height: 100vh;
    z-index: 100000;
}
#n2brnext-line-wrapper.n2brnext-focus #n2brnext-line-reader {
    width: 100%;
    height: 100%;
}
#n2brnext-line-reader,
#n2brnext-line-measure {
  width: 50%;
  height: 80%;
  /* margin: auto; */
  overflow: hidden;
  position: relative;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-y;
}
#n2brnext-line-reader.n2brnext-vertical,
#n2brnext-line-measure.n2brnext-vertical {
  touch-action: pan-x;
}

@media (max-width: 768px) {
  #n2brnext-line-reader {
    width: 90%;
  }
}
#n2brnext-line-reader::-webkit-scrollbar,
#n2brnext-line-measure::-webkit-scrollbar {
  display: none;
}

/* サイズ変更時に背景色を一時的に点滅させる */
#n2brnext-line-reader.n2brnext-flash,
#n2brnext-line-measure.n2brnext-flash {
  background-color: #e0e0e0;
  z-index: 100003;
}

/* サイズ変更時に行リーダーを最前面で表示 */
#n2brnext-line-wrapper.n2brnext-flash-layer {
  z-index: 100002;
  /* background: transparent; */
  pointer-events: none;
}
#n2brnext-foot-format-menu .n2brnext-line-controls {
    display: none;
}
body.n2brnext-line-mode #n2brnext-foot-format-menu .n2brnext-line-controls {
    display: block;
}


/* 行リーダー非表示中は表示 */
#n2brnext-foot-format-menu .n2brnext-reader-controls {
    display: block;
}

/* 行リーダー表示中は非表示 */
body.n2brnext-line-mode #n2brnext-foot-format-menu .n2brnext-reader-controls {
    display: none;
}

#n2brnext-foot-format-menu .n2brnext-line-controls button { margin: 0 0.2em; }

#n2brnext-foot-format-menu .n2brnext-visible-control .n2brnext-visible-auto {
    margin-left: 0.4em;
    padding: 0.2em 0.6em;
    font-weight: bold;
}

#n2brnext-foot-format-menu .n2brnext-visible-control .n2brnext-visible-auto.is-active {
    background-color: #1b6ac9;
    color: #fff;
}

#n2brnext-foot-format-menu .n2brnext-common-controls .n2brnext-control-set {
    display: inline-flex;
    align-items: center;
    margin: 0.2em 0.3em;
}
#n2brnext-foot-format-menu .n2brnext-ruby-scale-controls {
    display: inline-flex;
    align-items: center;
    margin-left: 0.5em;
    gap: 0.2em;
}
#n2brnext-foot-format-menu .n2brnext-ruby-scale-label {
    margin-right: 0.2em;
}
#n2brnext-foot-format-menu .n2brnext-line-controls .n2brnext-control-set {
    /* 狭い画面ではボタン群を折り返せるようflex化 */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0.2em 0.3em;
}

#n2brnext-foot-format-menu .n2brnext-control-title {
    margin-right: 0.3em;
    background-color: #fff;
}

#n2brnext-footer #n2brnext-foot-format-menu button {
    font-weight: bold;
    background-color: #ededed;
    border: none;
    border-radius: 0;
    color: #333;
}

#n2brnext-line-reader.n2brnext-vertical,
#n2brnext-line-measure.n2brnext-vertical {
/* 縦書き時は右から左へ流れる */
    writing-mode: vertical-rl;
    text-orientation: upright;
    text-align: top;
}
#n2brnext-line-reader:not(.n2brnext-vertical),
#n2brnext-line-measure:not(.n2brnext-vertical) {
    box-sizing: border-box;
}

#n2brnext-line-reader .n2brnext-line-completion {
    margin-block: 6em 1.5em;
    display: flex;
}

.n2brnext-line-completion {
     margin-block: 2em 1.5em;
    display: flex;
}

.n2brnext-line-completion-body {
    writing-mode: inherit;
    text-align: center;
    color: #333;
    line-height: 1.6;
}
.n2brnext-line-completion-label {
    font-weight: 600;
}
.n2brnext-line-completion-return {
    color: #0066cc;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}
.n2brnext-line-completion-return:hover,
.n2brnext-line-completion-return:focus-visible {
    color: #004f9e;
}

#n2brnext-reader p {
    text-indent: var(--n2br-indent, 1em);
}
#n2brnext-line-reader:not(.n2brnext-vertical) p,
#n2brnext-line-measure:not(.n2brnext-vertical) p,
#n2brnext-reader:not(.n2brnext-vertical) p {
    margin-bottom: var(--n2br-paragraph-margin, 1em);
}
#n2brnext-line-reader.n2brnext-vertical p,
#n2brnext-line-measure.n2brnext-vertical p,
#n2brnext-reader.n2brnext-vertical p {
    margin-left: var(--n2br-paragraph-margin, 1em);
}
/* 行リーダーでインデントON時の字下げと余白調整 */
#n2brnext-line-reader.n2brnext-indent-on:not(.n2brnext-vertical) p,
#n2brnext-line-measure.n2brnext-indent-on:not(.n2brnext-vertical) p {
    text-indent: var(--n2br-indent, 1em);
    margin-right: var(--n2br-indent, 1em);
}
#n2brnext-line-reader.n2brnext-indent-on.n2brnext-vertical p,
#n2brnext-line-measure.n2brnext-indent-on.n2brnext-vertical p {
    text-indent: var(--n2br-indent, 1em);
    /* margin-bottom: var(--n2br-indent, 1em); */
}
/* 改行モードとインデントONが同時の場合の字下げ調整 */
#n2brnext-line-reader.n2brnext-indent-on.n2brnext-break:not(.n2brnext-vertical) p,
#n2brnext-line-measure.n2brnext-indent-on.n2brnext-break:not(.n2brnext-vertical) p {
    text-indent: 0;
    margin-right: 0;
}
#n2brnext-line-reader.n2brnext-indent-on.n2brnext-break:not(.n2brnext-vertical) p [data-idx],
#n2brnext-line-measure.n2brnext-indent-on.n2brnext-break:not(.n2brnext-vertical) p [data-idx] {
    text-indent: var(--n2br-indent, 1em);
    /* margin-right: var(--n2br-indent, 1em); */
}
#n2brnext-line-reader.n2brnext-indent-on.n2brnext-break.n2brnext-vertical p,
#n2brnext-line-measure.n2brnext-indent-on.n2brnext-break.n2brnext-vertical p {
    text-indent: 0;
    margin-bottom: 0;
}
#n2brnext-line-reader.n2brnext-indent-on.n2brnext-break.n2brnext-vertical p [data-idx],
#n2brnext-line-measure.n2brnext-indent-on.n2brnext-break.n2brnext-vertical p [data-idx] {
    text-indent: var(--n2br-indent, 1em);
    /* margin-bottom: var(--n2br-indent, 1em); */
}

#n2brnext-line-reader.n2brnext-break p [data-idx],
#n2brnext-line-measure.n2brnext-break p [data-idx],
#n2brnext-reader.n2brnext-break p [data-idx] {
    display: inline-block;
}
#n2brnext-line-reader.n2brnext-break:not(.n2brnext-vertical) p [data-idx],
#n2brnext-line-measure.n2brnext-break:not(.n2brnext-vertical) p [data-idx],
#n2brnext-reader.n2brnext-break:not(.n2brnext-vertical) p [data-idx] {
    margin-bottom: var(--n2br-break-margin, 1em);
}
#n2brnext-line-reader.n2brnext-break.n2brnext-vertical p [data-idx],
#n2brnext-line-measure.n2brnext-break.n2brnext-vertical p [data-idx],
#n2brnext-reader.n2brnext-break.n2brnext-vertical p [data-idx] {
    margin-left: var(--n2br-break-margin, 1em);
}
#n2brnext-line-reader:not(.n2brnext-break) p [data-idx],
#n2brnext-line-measure:not(.n2brnext-break) p [data-idx],
#n2brnext-reader:not(.n2brnext-break) p [data-idx] {
    display: inline;
    margin: 0;
}

ruby rp {
    display: none;
}
#n2brnext-reader ruby rt,
#n2brnext-line-reader ruby rt,
#n2brnext-line-measure ruby rt {
    font-size: calc(var(--n2br-ruby-scale, 0.5) * 1em);
}
.n2brnext-ruby-paren ruby rt {
    display: inline;
    font-size: calc(var(--n2br-ruby-scale, 0.5) * 1em);
}
.n2brnext-ruby-paren ruby rp {
    display: inline;
}
.n2brnext-ruby-none ruby rt,
.n2brnext-ruby-none ruby rp {
    display: none;
}
#n2brnext-line-reader.n2brnext-vertical [data-idx],
#n2brnext-line-measure.n2brnext-vertical [data-idx] {
    /* 縦書き時に行を上揃えにする */
  vertical-align: top;
}
.n2brnext-scroll-indicator {
  position: absolute;
  color: #ccc;
  opacity: 0.6;
  font-size: 1.5em;
  pointer-events: none;
  display: none;
}
#n2brnext-line-reader.n2brnext-vertical .n2brnext-scroll-indicator {
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
#n2brnext-line-reader:not(.n2brnext-vertical) .n2brnext-scroll-indicator {
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}
.n2brnext-format-controls { margin-bottom: 0.5em; }
#n2brnext-foot-format-menu .n2brnext-format-controls span,
#n2brnext-foot-format-menu .n2brnext-format-controls button {
    white-space: nowrap; /* 狭い画面でもテキストを折り返さない */
}
#n2brnext-visible-lines { display: inline-block; text-align: center; }

body.n2brnext-line-mode {
    overflow: hidden;
}
body.n2brnext-line-mode #n2brnext-reader,
body.n2brnext-line-mode #n2brnext-sentinel {
    display: none;
}
/* 右スライドメニュー */
#n2brnext-side-menu-toggle {
}
#n2brnext-side-menu {
    position: fixed;
    top: 0;
    right: -300px;
    width: 300px;
    height: var(--n2brnext-viewport-height, 100vh);
    background: #eee;
    box-shadow: -2px 0 5px rgba(0,0,0,0.2);
    transition: right 0.3s ease;
    z-index: 10001;
    display: flex;
    flex-direction: column;
}
#n2brnext-side-menu.open {
    right: 0;
}
.n2brnext-side-menu-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: calc(1.25em + env(safe-area-inset-bottom, 0px));
}
@media (max-width: 600px) {
    .n2brnext-side-menu-body {
        padding-bottom: calc(3.5em + env(safe-area-inset-bottom, 0px));
    }
}
.n2brnext-side-panel-controls {
    position: sticky;
    bottom: 0;
    flex-shrink: 0;
    display: flex;
    gap: 0.75em;
    padding: 0.75em;
    padding-bottom: calc(0.75em + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(180deg, #b71c1c, #8e0000);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.n2brnext-side-panel-button {
    flex: 1 1 50%;
    min-width: 0;
    border: 1px solid #c8c8c8;
    border-radius: 0;
    background: #f5f5f5;
    color: #333;
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.1;
    padding: 0.75em 0.5em;
    cursor: pointer;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.08);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.n2brnext-side-panel-button:hover,
.n2brnext-side-panel-button:focus {
    background: #e7e7e7;
    color: #111;
    border-color: #b5b5b5;
}
.n2brnext-side-panel-button:active {
    background: #dcdcdc;
    border-color: #a8a8a8;
}
.n2brnext-side-panel-button:disabled {
    opacity: 0.5;
    cursor: default;
}
body.n2brnext-side-open #header,
body.n2brnext-side-open #wpadminbar {
    /* 右パネル展開中はヘッダーと管理バーを退避 */
    display: none !important;
}
.n2brnext-side-section {
    border-bottom: 1px solid #ccc;
}
.n2brnext-side-section summary {
    background: #ddd;
    padding: 0.5em;
    cursor: pointer;
}
.n2brnext-side-section .n2brnext-side-content {
    padding: 0.5em;
}

.n2brnext-book-info-item {
    margin: 0 0 0.75em;
    font-size: 0.9em;
    line-height: 1.6;
}

.n2brnext-book-info-item:last-child {
    margin-bottom: 0;
}

.n2brnext-book-info-label {
    margin: 0 0 0.25em;
    font-weight: 600;
    font-size: 0.95em;
}

.n2brnext-book-info-value,
.n2brnext-side-book-overview {
    word-break: break-word;
    line-height: 1.2em;
    font-size: small;
}

.n2brnext-book-info-value a {
    color: inherit;
    text-decoration: underline;
}

.n2brnext-book-info-source {
    margin: 0.75em 0 0;
    font-size: 0.9em;
    line-height: 1.5;
}

.n2brnext-book-info-source-label {
    font-weight: 600;
    margin-right: 0.25em;
}

.n2brnext-book-info-empty {
    margin: 0;
    font-size: 0.9em;
    color: #555;
}

.n2brnext-book-arasuji {
    margin-bottom: var(--n2br-margin-n);
}

.n2brnext-side-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35em;
}

.n2brnext-side-controls > button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.3em;
    padding: 0.5em 0.25em 0.55em;
    border: 1px solid #d0d0d0;
    background: #f7f7f7;
    color: #333333;
    font-size: 0.8em;
    line-height: 1.3;
    text-align: center;
    cursor: pointer;
}

.n2brnext-side-controls > button .material-symbols-outlined {
    font-size: 1.6em;
    line-height: 1;
}


.n2brnext-side-control-block {
    --n2brnext-side-label-width: 4.5em;
    grid-column: 1 / -1;
    background: #f5f5f5;
    border: 1px solid #d0d0d0;
    padding: 0.6em;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    font-size: 0.85em;
}

.n2brnext-side-control-row {
    display: flex;
    align-items: center;
    gap: 0.4em;
    flex-wrap: nowrap;
}

.n2brnext-side-gesture-row {
    display: flex;
}

.n2brnext-side-control-label {
    flex: 0 0 auto;
    min-width: var(--n2brnext-side-label-width, 4.5em);
    font-weight: 600;
    font-size: 0.85em;
    white-space: nowrap;
}

.n2brnext-side-control-label::after {
    content: '：';
}

.n2brnext-side-control-actions {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    gap: 0.4em;
    align-items: stretch;
}

.n2brnext-side-menu-body button {
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35em;
    padding: 0.45em 0.5em;
    border: 1px solid #c9c9c9;
    background: #ffffff;
    color: #333333;
    font-size: 0.82em;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
}

.n2brnext-side-control-actions select {
    flex: 1 1 100%;
    min-width: 0;
    padding: 0.45em 0.5em;
    border: 1px solid #c9c9c9;
    background: #ffffff;
    color: #333333;
    font-size: 0.82em;
    line-height: 1.2;
    border-radius: 0.2em;
}

.n2brnext-side-bookmark-actions .n2brnext-show {
    flex: 1.4 1 0;
}

.n2brnext-side-control-actions .n2brnext-shiori-info {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    font-weight: 600;
}

.n2brnext-side-quick-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6em;
}

.n2brnext-side-quick-item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.45em;
}

.n2brnext-side-quick-label {
    flex: 0 0 auto;
    font-weight: 600;
    font-size: 0.85em;
    white-space: nowrap;
}

.n2brnext-side-quick-label::after {
    content: '：';
}

.n2brnext-side-quick-buttons {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    gap: 0.4em;
}

.n2brnext-side-quick-buttons button {
    flex: 1 1 0;
}

.n2brnext-break-toggle-button[aria-pressed="true"] {
    border-color: #3367d6;
    background: #3367d6;
    color: #ffffff;
}

.n2brnext-side-control-actions .n2brnext-shiori-info:empty::before {
    content: '🔖';
    color: #999999;
}

.n2brnext-bookmark-action-label {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.n2brnext-side-content .widget {
    margin: 0 0 1em;
}

.n2brnext-side-content .widget:last-child {
    margin-bottom: 0;
}

.n2brnext-side-content .widget-title {
    margin: 0 0 0.4em;
    font-size: 0.95rem;
    font-weight: 600;
}

.n2brnext-widget-placeholder {
    margin: 0;
    color: #666666;
    font-size: 0.9rem;
}

.n2brnext-side-widgets a
 {
    padding: .3em .5em .3em 1.5em;
    transition: padding .25s;
    border-bottom: 1px solid var(--color_border);
    color: inherit;
    display: block;
    line-height: 1.4;
    position: relative;
    text-decoration: none;
}

.n2brnext-side-widgets ul, .n2brnext-side-widgets ul li.menu-item
 {
    padding: 0em;
    margin: 0em;
}


.n2brnext-status-buttons {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    margin-top: 0.75em;
}

.n2brnext-status-btn {
    padding: 0.45em 0.6em;
    border: 1px solid #c9c9c9;
    border-radius: 1em;
    background: #ffffff;
    color: #333333;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.n2brnext-status-btn:hover {
    background: #f3f4f6;
}

.n2brnext-status-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.n2brnext-status-btn.n2brnext-status-active {
    background: #101d39;
    border: none;
    color: #ffffff;
    font-weight: 600;
}

.n2brnext-rating-block {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    margin-top: 1em;
}

.n2brnext-rating-label {
    font-weight: 600;
}

.n2brnext-rating-select {
    width: 100%;
    padding: 0.3em;
    border: 1px solid #c9c9c9;
    border-radius: 4px;
    background: #ffffff;
    box-sizing: border-box;
}

.n2brnext-rating-comment {
    width: 100%;
    min-height: 4.5em;
    padding: 0.4em;
    border: 1px solid #c9c9c9;
    border-radius: 4px;
    resize: vertical;
    box-sizing: border-box;
}

.n2brnext-rating-actions {
    display: flex;
    justify-content: flex-end;
}

.n2brnext-rating-save {
    padding: 0.4em 0.9em;
    border: none;
    border-radius: 4px;
    background: #3c434a;
    color: #ffffff;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.n2brnext-rating-save:hover {
    opacity: 0.9;
}

.n2brnext-rating-save:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.n2brnext-article-lists {
    display: flex;
    flex-direction: column;
    gap: 0.75em;
}

.n2brnext-article-sort {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5em;
}

.n2brnext-article-sort-label {
    font-size: 0.85em;
    color: #555;
}

.n2brnext-article-sort-btn {
    padding: 0.3em 0.7em;
    border: 1px solid #c9c9c9;
    border-radius: 999px;
    background: #ffffff;
    color: #333;
    cursor: pointer;
    font-size: 0.85em;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.n2brnext-article-sort-btn:hover {
    background: #f3f4f6;
}

.n2brnext-article-sort-btn.is-active {
    background: #3c434a;
    color: #ffffff;
    border-color: #3c434a;
}

.n2brnext-article-groups {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

/* マイページ: H3自動タブ化 UI */
.n2brnext-article-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35em;
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 0.35em;
}
.n2brnext-article-tab {
    padding: 0.35em 0.8em;
    border: 1px solid #c9c9c9;
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    background: #f3f4f6;
    color: #333;
    cursor: pointer;
    font-size: 0.9em;
}
.n2brnext-article-tab.is-active {
    background: #ffffff;
    color: #111;
    border-color: #3c434a;
}
.n2brnext-article-group { display: none; }
.n2brnext-article-group.is-active { display: block; }
.n2brnext-article-lists.has-tabs .n2brnext-article-heading { display: none; }

.n2brnext-article-heading {
    margin: 0 0 0.4em;
    font-size: 1em;
    color: #333;
}

.n2brnext-article-list {
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    background: #ffffff;
    padding: 0.6em;
    box-sizing: border-box;
    min-height: 2.4em;
}

.n2brnext-article-items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4em;
}

.n2brnext-article-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5em;
    padding: 0.35em 0.45em;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

.n2brnext-article-item:hover {
    background: #f6f6f9;
}

.n2brnext-article-info {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    flex: 1;
    min-width: 0;
}

.n2brnext-article-link,
.n2brnext-author-list a {
    color: #2a4a92;
    text-decoration: none;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.n2brnext-article-link:hover {
    text-decoration: underline;
}

.n2brnext-article-link-disabled {
    color: #555;
    cursor: default;
}

.n2brnext-article-updated,
.n2brnext-article-bookmark,
.n2brnext-article-char-count {
    font-size: 0.78em;
    color: #666;
}

.n2brnext-article-char-count { margin-right: 0.6em; }

/* 文字数 + 更新を横並びで1行に固定 */
.n2brnext-article-meta { font-size: 0.78em; color: #666; white-space: nowrap; }

.n2brnext-article-actions {
    display: flex;
    align-items: center;
}

.n2brnext-article-remove {
    border: 1px solid #d9534f;
    background: #fff0f0;
    color: #b52222;
    border-radius: 4px;
    padding: 0.25em 0.6em;
    font-size: 0.85em;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.n2brnext-article-remove:hover {
    background: #ffe2e2;
}

.n2brnext-article-remove:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.n2brnext-article-empty {
    margin: 0;
    font-size: 0.85em;
    color: #777;
}

.n2brnext-article-message {
    margin: 0;
    font-size: 0.85em;
    color: #555;
}


/* 書式パネルをタブ表示にして高さを抑える */
#n2brnext-foot-format-menu .n2brnext-format-tabs {
    display: flex;
    margin-bottom: 0.5em;
}
#n2brnext-foot-format-menu .n2brnext-format-tab {
    flex: 1;
    background: #ededed; /* 背景 */
    color: #333;         /* 文字色 */
    border: none;
    padding: 0.3em;
    font-weight: bold;
}
/* アクティブのタブ */
#n2brnext-footer #n2brnext-foot-format-menu button.active {
    background: #3c434a; /* 背景 */
    color: #ededed;      /* 文字色 */
}
#n2brnext-foot-format-menu .n2brnext-format-content {
    display: none;
}
#n2brnext-foot-format-menu .n2brnext-format-content.active {
    display: block;
}
#n2brnext-foot-format-menu hr {
    display: none;
}

/* 音声読み上げ停止ボタン */
#n2brnext-tts-stop {
    position: fixed;
    right: var(--n2br-gap);
    bottom: calc(var(--n2br-footer-height) + var(--n2br-gap));
    /* 行リーダー表示中も最前面に表示するため高めのz-indexを設定 */
    z-index: 100005;
}

/* 朗読中に強調表示する行 */
.n2brnext-tts-active {
    background-color: rgba(255, 255, 0, 0.5);
}
