/* scripture.how reader static CSS; dynamic rules remain inline in source order. */
#scripture-viewer {
    --scripture-body-font-size: 0.95rem;
    --scripture-body-line-height: 1.85rem;
    --scripture-body-font-family: "Noto Sans KR", Inter, system-ui, sans-serif;
    --scripture-text-10: 0.625rem;
    --scripture-text-11: 0.6875rem;
    --scripture-text-xs: 0.75rem;
    --scripture-text-sm: 0.875rem;
    --scripture-text-base: 1rem;
    --scripture-text-lg: 1.125rem;
    --scripture-text-xl: 1.25rem;
    --scripture-text-2xl: 1.5rem;
    --scripture-heading-bg: #1c1917;
    --scripture-heading-fg: #ffffff;
    --scripture-heading-border: #d6d3d1;
    --scripture-heading-note-border: #e7e5e4;
    --scripture-heading-note-line: #d97706;
    --scripture-heading-note-bg: #ffffff;
    --scripture-parallel-bg: #f0f9ff;
    --scripture-parallel-fg: #0369a1;
    --scripture-parallel-border: #bae6fd;
    --scripture-parallel-hover-bg: #e0f2fe;
    --scripture-parallel-hover-border: #38bdf8;
    --scripture-heading-column-bg: #eef2ff;
    --scripture-heading-column-fg: #3730a3;
    --scripture-heading-column-border: #c7d2fe;
    --scripture-heading-column-hover-bg: #e0e7ff;
    --scripture-heading-column-hover-border: #818cf8;
    --scripture-verse-number-bg: transparent;
    --scripture-verse-number-fg: #b45309;
    --scripture-verse-number-hover-bg: #fef3c7;
    --scripture-action-cross-bg: #f0f9ff;
    --scripture-action-cross-fg: #075985;
    --scripture-action-cross-border: #bae6fd;
    --scripture-action-cross-hover-bg: #e0f2fe;
    --scripture-action-cross-hover-border: #38bdf8;
    --scripture-action-original-bg: #fff1f2;
    --scripture-action-original-fg: #be123c;
    --scripture-action-original-border: #fecdd3;
    --scripture-action-original-hover-bg: #ffe4e6;
    --scripture-action-original-hover-border: #fb7185;
    --scripture-action-commentary-bg: #f5f3ff;
    --scripture-action-commentary-fg: #6d28d9;
    --scripture-action-commentary-border: #ddd6fe;
    --scripture-action-commentary-hover-bg: #ede9fe;
    --scripture-action-commentary-hover-border: #a78bfa;
    --scripture-action-note-bg: #ffffff;
    --scripture-action-note-fg: #92400e;
    --scripture-action-note-border: #fde68a;
    --scripture-action-note-hover-bg: #fffbeb;
    --scripture-action-note-hover-border: #f59e0b;
    --scripture-action-discussion-bg: #ffffff;
    --scripture-action-discussion-fg: #44403c;
    --scripture-action-discussion-border: #e7e5e4;
    --scripture-action-discussion-hover-bg: #fffbeb;
    --scripture-action-discussion-hover-border: #f59e0b;
    --scripture-action-count-bg: #fef3c7;
    --scripture-action-count-fg: #78350f;
    --scripture-action-count-hover-bg: #fde68a;
    --scripture-inline-note-bg: #ffffff;
    --scripture-inline-note-border: #f59e0b;
    --scripture-inline-note-padding-y: 0.45rem;
    --scripture-inline-note-padding-x: 1rem;
    --scripture-inline-note-font-size: var(--scripture-body-font-size);
    --scripture-inline-note-line-height: var(--scripture-body-line-height);
    --scripture-dictionary-underline-color: #0ea5e9;
    --scripture-dictionary-underline-style: dotted;
    --scripture-dictionary-underline-thickness: 1px;
    --scripture-dictionary-underline-offset: 3px;
    --scripture-underline-color: rgb(28 25 23 / 0.78);
    --semantic-god-bg: #fde047;
    --semantic-god-fg: #1f2937;
    --semantic-god-text: #a16207;
    --semantic-satan-bg: #ef4444;
    --semantic-satan-fg: #ffffff;
    --semantic-satan-text: #dc2626;
    --semantic-good-follower-bg: #7dd3fc;
    --semantic-good-follower-fg: #0c4a6e;
    --semantic-good-follower-text: #0284c7;
    --semantic-fleshly-immature-bg: #5eead4;
    --semantic-fleshly-immature-fg: #134e4a;
    --semantic-fleshly-immature-text: #0f766e;
    --semantic-evil-follower-bg: #22c55e;
    --semantic-evil-follower-fg: #052e16;
    --semantic-evil-follower-text: #16a34a;
    --semantic-emphasis-bg: #8b5cf6;
    --semantic-emphasis-fg: #ffffff;
    --semantic-emphasis-text: #7c3aed;
    --semantic-neutral-bg: #92400e;
    --semantic-neutral-fg: #ffffff;
    --semantic-neutral-text: #92400e;
    font-family: var(--scripture-body-font-family);
}
#scripture-viewer :where(button, input, select, textarea, summary, dialog, [contenteditable="true"]) {
    font-family: var(--scripture-body-font-family);
}
#scripture-viewer .text-\[10px\] {
    font-size: var(--scripture-text-10) !important;
    line-height: 1.35 !important;
}
#scripture-viewer .text-\[11px\] {
    font-size: var(--scripture-text-11) !important;
    line-height: 1.35 !important;
}
#scripture-viewer .text-xs {
    font-size: var(--scripture-text-xs) !important;
    line-height: 1.35 !important;
}
#scripture-viewer .text-sm {
    font-size: var(--scripture-text-sm) !important;
    line-height: 1.55 !important;
}
#scripture-viewer .text-base {
    font-size: var(--scripture-text-base) !important;
    line-height: 1.55 !important;
}
#scripture-viewer .text-lg {
    font-size: var(--scripture-text-lg) !important;
    line-height: 1.45 !important;
}
#scripture-viewer .text-xl {
    font-size: var(--scripture-text-xl) !important;
    line-height: 1.4 !important;
}
#scripture-viewer .text-2xl {
    font-size: var(--scripture-text-2xl) !important;
    line-height: 1.3 !important;
}
#scripture-viewer dialog:not(.scripture-nav-sheet)[open] {
    position: fixed !important;
    inset: auto !important;
    top: 50% !important;
    left: 50% !important;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 24px);
    margin: 0 !important;
    transform: translate(-50%, -50%) !important;
}
#scripture-viewer dialog.scripture-editor-dialog[open] {
    width: calc(100vw - 32px) !important;
    height: calc(100vh - 32px) !important;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
}
#scripture-viewer .scripture-column-editor-layout {
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    height: calc(100vh - 7.5rem);
    min-height: 0;
}
#scripture-viewer .scripture-column-editor-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    height: 100%;
    gap: 1rem;
    overflow: hidden;
}
#scripture-viewer .scripture-column-editor-list {
    min-height: 0;
    overflow-y: auto;
}
#scripture-viewer .scripture-column-form {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 0;
}
#scripture-viewer .scripture-column-editor-shell {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    min-height: 0;
    row-gap: 0.25rem;
}
#scripture-viewer .scripture-column-rich-editor {
    min-height: 0;
    height: 100%;
    overflow-y: auto;
}
#scripture-viewer [data-verse-action-menu-panel] {
    isolation: isolate;
    z-index: 2147483000 !important;
    background: #ffffff !important;
    color: #1c1917 !important;
    box-shadow: 0 18px 45px rgb(28 25 23 / 0.22);
}
#scripture-viewer [data-verse-action-menu-panel] button {
    background: #ffffff !important;
    color: #1c1917 !important;
}
#scripture-viewer [data-verse-action-menu-panel] button:hover {
    background: #fff7ed !important;
    color: #7c2d12 !important;
}
@media (min-width: 1280px) {
    #scripture-viewer .scripture-column-editor-main {
        grid-template-columns: minmax(48rem, 1fr) minmax(18rem, 24rem);
    }
}
#scripture-viewer .scripture-column-editor-list[hidden] {
    display: none;
}
#scripture-viewer .scripture-column-editor-main:has(.scripture-column-editor-list[hidden]) {
    grid-template-columns: minmax(0, 1fr);
}
body[data-scripture-theme="light"],
#scripture-viewer[data-scripture-theme="light"] {
    background: #f8fafc !important;
    color: #1c1917 !important;
}
#scripture-viewer[data-scripture-theme="light"] .bg-white,
#scripture-viewer[data-scripture-theme="light"] .bg-stone-50 {
    background-color: #ffffff !important;
}
#scripture-viewer[data-scripture-theme="light"] .text-stone-950,
#scripture-viewer[data-scripture-theme="light"] .text-stone-900,
#scripture-viewer[data-scripture-theme="light"] .text-stone-700 {
    color: #1c1917 !important;
}
#scripture-viewer[data-scripture-theme="light"] .text-stone-600,
#scripture-viewer[data-scripture-theme="light"] .text-stone-500 {
    color: #57534e !important;
}
body[data-scripture-theme="dark"] {
    background: #080f1f !important;
    color: #e8edf7 !important;
}
#scripture-viewer[data-scripture-theme="dark"] {
    background: #080f1f;
    color: #e8edf7;
    --semantic-god-bg: #facc15;
    --semantic-god-fg: #111827;
    --semantic-god-text: #fde68a;
    --semantic-satan-bg: #dc2626;
    --semantic-satan-fg: #ffffff;
    --semantic-satan-text: #fca5a5;
    --semantic-good-follower-bg: #38bdf8;
    --semantic-good-follower-fg: #082f49;
    --semantic-good-follower-text: #7dd3fc;
    --semantic-fleshly-immature-bg: #2dd4bf;
    --semantic-fleshly-immature-fg: #042f2e;
    --semantic-fleshly-immature-text: #5eead4;
    --semantic-evil-follower-bg: #16a34a;
    --semantic-evil-follower-fg: #052e16;
    --semantic-evil-follower-text: #86efac;
    --semantic-emphasis-bg: #8b5cf6;
    --semantic-emphasis-fg: #ffffff;
    --semantic-emphasis-text: #c4b5fd;
    --semantic-neutral-bg: #d97706;
    --semantic-neutral-fg: #111827;
    --semantic-neutral-text: #fbbf24;
    --scripture-underline-color: rgb(248 250 252 / 0.86);
    --scripture-heading-bg: #f8fafc;
    --scripture-heading-fg: #0f172a;
    --scripture-heading-border: #475569;
    --scripture-heading-note-border: #334155;
    --scripture-heading-note-line: #f59e0b;
    --scripture-heading-note-bg: #0f172a;
    --scripture-parallel-bg: #0f2538;
    --scripture-parallel-fg: #bae6fd;
    --scripture-parallel-border: #1e5675;
    --scripture-parallel-hover-bg: #12324a;
    --scripture-parallel-hover-border: #38bdf8;
    --scripture-heading-column-bg: #211d3d;
    --scripture-heading-column-fg: #c4b5fd;
    --scripture-heading-column-border: #4c3f8f;
    --scripture-heading-column-hover-bg: #312a5d;
    --scripture-heading-column-hover-border: #8b5cf6;
    --scripture-verse-number-bg: transparent;
    --scripture-verse-number-fg: #fbbf24;
    --scripture-verse-number-hover-bg: #1e293b;
    --scripture-action-cross-bg: #0f2538;
    --scripture-action-cross-fg: #bae6fd;
    --scripture-action-cross-border: #1e5675;
    --scripture-action-cross-hover-bg: #12324a;
    --scripture-action-cross-hover-border: #38bdf8;
    --scripture-action-original-bg: #351421;
    --scripture-action-original-fg: #fecdd3;
    --scripture-action-original-border: #7f1d1d;
    --scripture-action-original-hover-bg: #4a1d2e;
    --scripture-action-original-hover-border: #fb7185;
    --scripture-action-commentary-bg: #211d3d;
    --scripture-action-commentary-fg: #ddd6fe;
    --scripture-action-commentary-border: #4c3f8f;
    --scripture-action-commentary-hover-bg: #312a5d;
    --scripture-action-commentary-hover-border: #8b5cf6;
    --scripture-action-note-bg: #1f2937;
    --scripture-action-note-fg: #fbbf24;
    --scripture-action-note-border: #92400e;
    --scripture-action-note-hover-bg: #2a2416;
    --scripture-action-note-hover-border: #f59e0b;
    --scripture-action-discussion-bg: #111827;
    --scripture-action-discussion-fg: #e5e7eb;
    --scripture-action-discussion-border: #334155;
    --scripture-action-discussion-hover-bg: #1e293b;
    --scripture-action-discussion-hover-border: #f59e0b;
    --scripture-action-count-bg: #2a2416;
    --scripture-action-count-fg: #fbbf24;
    --scripture-action-count-hover-bg: #3a2b17;
    --scripture-inline-note-bg: #101827;
    --scripture-inline-note-border: #92400e;
    --scripture-inline-note-padding-y: 0.45rem;
    --scripture-inline-note-padding-x: 1rem;
    --scripture-inline-note-font-size: var(--scripture-body-font-size);
    --scripture-inline-note-line-height: var(--scripture-body-line-height);
    --scripture-dictionary-underline-color: #38bdf8;
    --scripture-dictionary-underline-style: dotted;
    --scripture-dictionary-underline-thickness: 1px;
    --scripture-dictionary-underline-offset: 3px;
}
#scripture-viewer[data-scripture-theme="dark"] .bg-white,
#scripture-viewer[data-scripture-theme="dark"] .bg-stone-50 {
    background-color: #101827 !important;
}
#scripture-viewer[data-scripture-theme="dark"] .bg-stone-100 {
    background-color: #172033 !important;
}
/* bg-sky-50 도 어둡게 — 이 배경 위 글자(text-slate-900)를 아래에서 밝게 바꾸므로,
   배경을 그대로 두면 밝은 배경에 밝은 글자가 되어 안 보인다. */
#scripture-viewer[data-scripture-theme="dark"] .bg-sky-50 {
    background-color: #0f2538 !important;
}
#scripture-viewer[data-scripture-theme="dark"] .border-stone-100,
#scripture-viewer[data-scripture-theme="dark"] .border-stone-200,
#scripture-viewer[data-scripture-theme="dark"] .border-stone-300 {
    border-color: #334155 !important;
}
/* 어두운 본문 색 계열은 다크 테마에서 모두 밝게 뒤집는다.
   한 단계라도 빠지면(예전 text-stone-800) 그 클래스를 쓰는 요소만 어두운 배경에 어두운 글자로 남아
   보이지 않는다 — 실제로 주석서 패널 제목이 그렇게 사라졌다. slate/zinc 계열도 같은 이유로 포함. */
#scripture-viewer[data-scripture-theme="dark"] .text-stone-950,
#scripture-viewer[data-scripture-theme="dark"] .text-stone-900,
#scripture-viewer[data-scripture-theme="dark"] .text-stone-800,
#scripture-viewer[data-scripture-theme="dark"] .text-stone-700,
#scripture-viewer[data-scripture-theme="dark"] .text-slate-900,
#scripture-viewer[data-scripture-theme="dark"] .text-slate-800,
#scripture-viewer[data-scripture-theme="dark"] .text-slate-700,
#scripture-viewer[data-scripture-theme="dark"] .text-zinc-800 {
    color: #f8fafc !important;
}
#scripture-viewer[data-scripture-theme="dark"] .text-stone-600,
#scripture-viewer[data-scripture-theme="dark"] .text-stone-500 {
    color: #cbd5e1 !important;
}
#scripture-viewer[data-scripture-theme="dark"] input,
#scripture-viewer[data-scripture-theme="dark"] select,
#scripture-viewer[data-scripture-theme="dark"] textarea {
    background-color: #0b1220;
    color: #f8fafc;
}
#scripture-viewer[data-scripture-theme="dark"] dialog {
    background: #101827;
    color: #f8fafc;
}
#scripture-viewer[data-scripture-theme="dark"] dialog .bg-white,
#scripture-viewer[data-scripture-theme="dark"] dialog .bg-stone-50,
#scripture-viewer[data-scripture-theme="dark"] dialog .bg-stone-50\/80,
#scripture-viewer[data-scripture-theme="dark"] dialog .bg-stone-100 {
    background-color: #172033 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-settings-sheet .bg-amber-50\/60 {
    background-color: #172033 !important;
    border-color: #92400e !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-settings-sheet [data-viewer-language-theme-controls] {
    border-color: #475569 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-settings-sheet [data-viewer-theme] {
    background-color: #172033 !important;
    border-color: #475569 !important;
    color: #cbd5e1 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-settings-sheet [data-viewer-theme]:hover {
    background-color: #334155 !important;
    color: #f8fafc !important;
}
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-settings-sheet button[type="button"].bg-stone-900,
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-settings-sheet [data-reader-mode-option].bg-amber-50 {
    background-color: #f8fafc !important;
    border-color: #f8fafc !important;
    color: #0f172a !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .bg-stone-50\/60 {
    background-color: #172033 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .sc-meta-row {
    color: #cbd5e1;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .text-sky-950,
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .text-sky-900 {
    color: #e0f2fe !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .text-sky-700 {
    color: #bae6fd !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .border-sky-200 {
    border-color: #1e5675 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .hover\:border-sky-500:hover {
    border-color: #38bdf8 !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .hover\:bg-sky-100:hover {
    background-color: #12324a !important;
}
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-navigation-sheet .sc-pick-on,
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-navigation-sheet .scripture-nav-tabs .bg-stone-900 {
    background-color: #f8fafc !important;
    border-color: #f8fafc !important;
    color: #0f172a !important;
}
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-navigation-sheet .sc-meta-row > span:first-child,
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-navigation-sheet .sc-pick-off .sc-ico-row > span:last-child {
    background-color: #172033 !important;
    border-color: #475569 !important;
    color: #cbd5e1 !important;
}
#scripture-viewer[data-scripture-theme="dark"]:not([data-read-profile="eink"]) #scripture-navigation-sheet .sc-pick-on .sc-ico-row > span {
    background-color: #e2e8f0 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}
#scripture-viewer[data-scripture-theme="dark"] #scripture-navigation-sheet .scripture-nav-tabs .hover\:bg-stone-100:hover {
    background-color: #334155 !important;
    color: #f8fafc !important;
}
#scripture-viewer[data-scripture-theme="dark"] .semantic-user-color-panel {
    background: #0b1220;
    border-color: #334155;
}
#scripture-viewer[data-scripture-theme="dark"] input[type="color"] {
    background: transparent;
}