/* =========================
   Global Base & Tokens
   ========================= */
   @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@400;600;700;800;900&family=Noto+Serif+KR:wght@400;500;600;700&family=Nanum+Myeongjo:wght@400;700;800&family=Gowun+Batang:wght@400;700&family=Song+Myung&family=Gowun+Dodum:wght@400;700&display=swap');

   :root{
     --main-bg:#f7fbff;
     --surface-bg:#ffffff;
     --point-color:#0f3e66;
     --point-soft:#D1A054;
     --overlay-bg:rgba(6, 14, 25, 0.56);
     --brand:#166534;           /* 로고 딥그린 */
     --nav:#0f3e66;             /* 네비 활성 네이비 */
     --tab-point:var(--app-point, var(--nav));
     --tab-point-soft:var(--app-point-soft, var(--nav));
     --tab-point-highlight:var(--app-point-highlight, rgba(15, 62, 102, 0.16));
     --ink:#0f172a;             /* 본문 글자 */
     --muted:#6b7280;           /* 보조 텍스트 */
     --bg:#f6f9fc;              /* 페이지 배경 */
     --line:#e5e7eb;
   
     --accent-bg:#eef4fb;
     --accent-border:#cfe0f0;
     --accent-rgb: 15, 62, 102;
   
     --header-h:56px;
     --radius:12px;
     --radius-pill:999px;
   
     --shadow-sm: 0 6px 16px rgba(0, 0, 0, 0.05);
     --shadow-md: 0 14px 30px rgba(0, 0, 0, 0.10);
   
     --font:'Inter', 'Noto Sans KR', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
   
     --content-max-w: min(1440px, 100%);
     /* 카드 높이를 모든 페이지에서 동일하게 강제하고 싶다면 아래 값을 사용하세요.
        기본은 자동 높이(내용에 따라 증가). */
     --card-fixed-h: auto; /* 예: 220px */
     /* --card-min-w: 480px; *//* 데스크톱 기본 */
     --card-min-w: clamp(260px, 28vw, 320px);
     --footer-h: 82px; /* 현재 푸터 높이 */
   
     --label-color: #0a2540;
     --memo-indicator: #ef4444;
     --memo-indicator-ink: #b91c1c;
     --memo-verse-gutter: #f7b4ad;
   }
   
   @media (max-width: 768px) {
     :root{ --card-min-w: clamp(240px, 90vw, 320px); }
   }
   
   *{ box-sizing:border-box; }

   /* ----------------------------------------------------------------------------- */
   html, body {
     /* height: 100%; */
     margin: 0;
     padding: 0;
     overflow-x: hidden; /* 가로 스크롤 방지 */
   }
   /* 전역: 스크롤을 html 한 곳에서만 하도록 하여 스크롤바/뷰포트 불일치 방지 */
   html{
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
     -webkit-text-size-adjust:100%;
     text-size-adjust:100%;
   }
   
   body{
     min-height: 100dvh;            /* 한 화면 채움 */
     display: flex;
     flex-direction: column;
     background: var(--main-bg);
     color: var(--ink);
     line-height: 1.55;
     font-family: var(--font);
     background-color: var(--main-bg);
   }

   input[type="date"]{
     cursor:pointer;
   }
   input[type="date"]::-webkit-calendar-picker-indicator{
     cursor:pointer;
   }
   
   /* 성경 페이지: 일반 문서 흐름(block) + html 한 곳만 스크롤 루트 */
   html.page-bible-root{
     overflow-y: auto;
     overflow-x: hidden;
     -webkit-overflow-scrolling: touch;
     scroll-padding-top:0 !important;
   }
   body.page-bible{
     display:block;                 /* 전역 flex 레이아웃 해제 */
     min-height:auto !important;    /* 100dvh 최소 높이 해제 */
     height:auto;
     max-height:none;
     overflow-x:hidden;
     overflow-y:clip;
     scroll-padding-top:0 !important;
   }
   body.page-bible.has-sticky-header .page-title{
     padding-top:var(--sticky-header-offset, 56px) !important;
   }
   body.page-bible.has-sticky-header main{
     padding-top:0 !important;
   }
   body.page-bible main{
     flex:0 1 auto !important;
     height:auto !important;
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   body.page-bible main.section{
     margin-bottom:0 !important;
     padding-bottom:0 !important;
     height:auto !important;
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   body.page-bible .site-footer{
     margin-bottom:0 !important;
   }
   /* 성경 페이지만: 스크롤 최상단 방지 (전역 has-sticky-header의 calc 간섭 제거) */
   body.page-bible.has-sticky-header{
     scroll-padding-top:0 !important;
   }
   /* ----------------------------------------------------------------------------- */
   /* Common containers */
   .section{ max-width:var(--content-max-w); margin:28px auto 64px; padding:0 16px; }
   .container{ max-width:var(--content-max-w); margin:0 auto; padding:0 16px; }
   main{ flex:1; }
   [data-include="partials/header.html"],
   [data-include-html="partials/header.html"]{
     display:block;
     min-height:72px;
   }
   @media (max-width:768px){
     [data-include="partials/header.html"],
     [data-include-html="partials/header.html"]{
       min-height:76px;
     }
   }
   
   /* A11y */
   .sr-only{
     position:absolute; width:1px; height:1px; padding:0; margin:-1px;
     overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
   }
   
   /* =========================
      Header
      ========================= */
   .topbar{
     position: sticky; top: 0; z-index: 50;
     background: var(--surface-bg); border-bottom: 1px solid var(--line);
   }
   .topbar .wrap{
     max-width:var(--content-max-w); margin:0 auto; height:var(--header-h); padding:0 16px;
     display:flex; align-items:center; justify-content:space-between;
   }
   .brand img{ height:32px; width:auto; display:block; }
   
   .nav-main{ display:flex; gap:16px; }
   .nav-main a{
     text-decoration:none; color:var(--ink);
     font-weight:700; font-size:15px;
     padding:8px 14px; border-radius:var(--radius-pill);
     transition:background .18s, color .18s, box-shadow .18s;
   }
   .nav-main a:hover{ background:var(--accent-bg); color:var(--nav); }
   .nav-main a.active{ background:var(--nav); color:var(--surface-bg); box-shadow:var(--shadow-sm); position:relative; }
   .nav-main a:focus-visible{ outline:2px solid var(--nav); outline-offset:2px; }
   .nav-main a.locked{
     opacity:.5;
   }
   
   .auth-slot{
     display:flex;
     align-items:center;
     gap:8px;
     margin-left:16px;
   }
   .auth-user{
     font-size:13px;
     font-weight:700;
     color:var(--ink);
   }
   .auth-login-links{
     display:flex;
     align-items:center;
     gap:6px;
   }
   .auth-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     padding:6px 10px;
     border-radius:999px;
     font-size:12px;
     font-weight:700;
     border:1px solid #d5deea;
     background:#fff;
     color:#203a4a;
     text-decoration:none;
   }
   .auth-logout{
     cursor:pointer;
   }
   .auth-google{
     border-color:#c8d7ee;
   }
   .auth-kakao{
     border-color:#f6da6c;
     background:#fee36f;
     color:#3a2f00;
   }
   .auth-admin{
     border-color:#b8c8e6;
     background:#f2f6ff;
     color:#1f3e73;
   }
   .auth-disabled{
     font-size:12px;
     color:var(--muted);
   }
   @media (max-width:640px){
     .topbar .wrap{
       height:auto;
       min-height:var(--header-h);
       padding:8px 12px;
       flex-wrap:wrap;
       row-gap:8px;
     }
     .brand img{ height:28px; }
     .nav-main{
       width:100%;
       justify-content:space-between;
       gap:6px;
     }
     .nav-main a{
       flex:1 1 0;
       text-align:center;
       white-space:nowrap;
       word-break:keep-all;
       font-size:14px;
       padding:7px 6px;
     }
     .auth-slot{
       order:3;
       width:100%;
       justify-content:flex-end;
       margin-left:0;
     }
   }
   
   /* =========================
      Page Title
      ========================= */
   .page-title{ margin:24px auto 6px; padding:0 16px; max-width:var(--content-max-w); }
   .page-title .h1{
     margin:0; font-weight:800;
     font-size:clamp(26px, 4vw, 36px);
     letter-spacing:-0.02em; line-height:1.25;
     color:#0f3e66;
   }
   body.page-bible .page-title .h1{
     font-size:20px;
   }
   .page-title .h1::before,
   .page-title .h1::after{ content:none !important; }
   
   .auth-gate-card{
     margin:0 auto 14px;
     width:min(100%, 960px);
     background:#fff;
     border:1px solid var(--line);
     border-radius:12px;
     padding:14px 16px;
     box-shadow:var(--shadow-sm);
   }
   .auth-gate-card h2{
     margin:0 0 6px;
     font-size:18px;
     color:#0f3e66;
   }
   .auth-gate-card p{
     margin:0;
     color:#334e63;
   }
   .auth-gate-actions{
     margin-top:10px;
     display:flex;
     gap:8px;
     flex-wrap:wrap;
   }
   .auth-main-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     text-decoration:none;
     font-size:13px;
     font-weight:700;
     padding:8px 12px;
     border-radius:10px;
     border:1px solid #d5deea;
     background:#fff;
     color:#203a4a;
   }
   
   .admin-card{
     margin-top:12px;
   }
   .admin-page .auth-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     padding:8px 12px;
     border-radius:999px;
     border:1px solid #d5deea;
     background:#fff;
     color:#203a4a;
     text-decoration:none;
     font-size:13px;
     font-weight:700;
     line-height:1.2;
     min-height:36px;
     cursor:pointer;
   }
   .admin-page .auth-btn:hover,
   .admin-page .auth-btn:focus-visible{
     background:#f4f8ff;
     color:#102f4d;
   }
   .admin-toolbar{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     flex-wrap:wrap;
   }
   .admin-status{
     margin:0;
     color:#274760;
     font-size:14px;
     font-weight:700;
     min-height:22px;
     text-align:left;
   }
   .admin-table-wrap{
     margin-top:14px;
     overflow:auto;
     border:1px solid #d9e3f0;
     border-radius:12px;
   }
   .admin-table{
     width:100%;
     border-collapse:collapse;
     min-width:860px;
     background:#fff;
   }
   .admin-table th,
   .admin-table td{
     border-bottom:1px solid #eef2f7;
     padding:10px 12px;
     text-align:left;
     font-size:13px;
   }
   .admin-role-select{
     min-width:92px;
     border:1px solid #cad8ea;
     border-radius:10px;
     background:#fff;
     color:#193852;
     font-size:13px;
     padding:6px 10px;
   }
   .admin-user-input{
     width:100%;
     min-width:160px;
     border:1px solid #cad8ea;
     border-radius:10px;
     background:#fff;
     color:#193852;
     font-size:13px;
     padding:7px 10px;
   }
   .admin-table td:last-child{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     align-items:center;
   }
   .admin-table th{
     background:#f6f9ff;
     color:#1f4567;
     font-size:12px;
     letter-spacing:.01em;
   }
   .admin-panel{
     margin-top:14px;
   }
   .admin-panel:not(.active){
     display:none;
   }
   .admin-event-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     flex-wrap:wrap;
   }
   .admin-event-head h2{
     margin:0;
     font-size:18px;
     color:#1f4567;
   }
   .admin-note{
     margin:8px 0 12px;
     color:#54708a;
     font-size:13px;
   }
   .admin-event-list{
     margin:0;
     padding:0;
     list-style:none;
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   .admin-event-item{
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fff;
     padding:10px 12px;
     display:flex;
     align-items:flex-start;
     justify-content:space-between;
     gap:12px;
   }
   .admin-event-item.dragging{
     opacity:0.6;
   }
   .admin-event-main{
     display:flex;
     gap:10px;
     flex:1;
     min-width:0;
   }
   .admin-event-handle{
     appearance:none;
     border:1px solid #d1deef;
     background:#f4f8ff;
     color:#2d4c67;
     border-radius:8px;
     cursor:grab;
     font-size:14px;
     font-weight:700;
     height:30px;
     width:30px;
     flex:0 0 30px;
   }
   .admin-event-meta{
     min-width:0;
   }
   .admin-event-meta strong{
     display:block;
     margin-top:4px;
     color:#173d5b;
   }
   .admin-event-meta p{
     margin:6px 0 0;
     color:#36566f;
     font-size:13px;
     line-height:1.5;
   }
   .admin-event-date{
     display:inline-block;
     margin-right:8px;
     font-weight:800;
     color:#1f4f79;
   }
   .admin-event-tag{
     display:inline-block;
     padding:2px 8px;
     border-radius:999px;
     background:#eef5ff;
     color:#1f4f79;
     font-size:12px;
     font-weight:700;
   }
   .admin-event-actions{
     display:flex;
     align-items:center;
     gap:6px;
     flex-wrap:wrap;
   }
   .admin-event-empty{
     border:1px dashed #d1deef;
     border-radius:10px;
     padding:14px;
     color:#54708a;
     background:#f8fbff;
   }
   .admin-event-form{
     margin-top:16px;
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fbfdff;
     padding:14px;
   }
   .admin-event-form h3{
     margin:0 0 10px;
     color:#1f4567;
   }
   .admin-search-toolbar{
     display:flex;
     flex-wrap:wrap;
     gap:12px;
     align-items:flex-end;
     margin:16px 0 18px;
   }
   .admin-search-toolbar label{
     display:flex;
     flex-direction:column;
     gap:6px;
     color:#304f68;
     font-size:13px;
     font-weight:700;
   }
   .admin-search-toolbar select{
     min-width:120px;
     border:1px solid #cad8ea;
     border-radius:10px;
     background:#fff;
     color:#193852;
     font-size:14px;
     padding:8px 10px;
   }
   .admin-search-metrics{
     display:grid;
     grid-template-columns:repeat(4, minmax(0, 1fr));
     gap:10px;
     margin:0 0 16px;
   }
   .admin-search-metric{
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fbfdff;
     padding:14px;
   }
   .admin-search-metric span{
     display:block;
     margin-bottom:6px;
     color:#54708a;
     font-size:12px;
     font-weight:700;
   }
   .admin-search-metric strong{
     color:#173d5b;
     font-size:22px;
     line-height:1.1;
   }
   .admin-search-grid{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:16px;
   }
   .admin-search-section{
     min-width:0;
   }
   .admin-search-detail{
     grid-column:1 / -1;
   }
   .admin-search-section-head{
     margin-bottom:8px;
   }
   .admin-search-section-head h3{
     margin:0;
     color:#1f4567;
     font-size:16px;
   }
   .admin-form-grid{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:10px;
   }
   .admin-form-grid label{
     display:flex;
     flex-direction:column;
     gap:6px;
     color:#304f68;
     font-size:13px;
     font-weight:700;
   }
   .admin-form-grid input,
   .admin-form-grid textarea{
     width:100%;
     border:1px solid #cad8ea;
     border-radius:10px;
     background:#fff;
     color:#193852;
     font-size:14px;
     padding:8px 10px;
     box-sizing:border-box;
   }
   .admin-form-wide{
     grid-column:1 / -1;
   }
   .admin-form-actions{
     margin-top:10px;
     display:flex;
     gap:8px;
     flex-wrap:wrap;
     align-items:center;
   }
   .admin-save-apply-btn{
     margin-left:auto;
   }
   .admin-prompt-helper{
     margin-top:16px;
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fff;
     padding:14px;
   }
   .admin-prompt-helper h3{
     margin:0 0 10px;
     color:#1f4567;
   }
   .admin-prompt-list{
     margin:0;
     padding:0;
     list-style:none;
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   .admin-prompt-list li{
     border:1px solid #e4edf8;
     border-radius:10px;
     background:#f8fbff;
     padding:10px;
     display:flex;
     align-items:flex-start;
     justify-content:space-between;
     gap:10px;
   }
   .admin-prompt-list code{
     white-space:normal;
     color:#294760;
     font-size:12px;
     line-height:1.5;
   }
  .admin-prompt-text{
    margin:0;
    white-space:pre-wrap;
    color:#294760;
     font-size:12px;
     line-height:1.5;
     font-family:inherit;
     text-align:left;
     word-break:keep-all;
     overflow-wrap:anywhere;
   }
   @media (max-width:768px){
     .admin-form-grid{
       grid-template-columns:1fr;
     }
     .admin-event-item{
       flex-direction:column;
     }
     .admin-event-actions{
       width:100%;
       justify-content:flex-end;
     }
     .admin-prompt-list li{
       flex-direction:column;
       align-items:stretch;
     }
     .admin-search-metrics,
     .admin-search-grid{
       grid-template-columns:1fr;
     }
     .admin-prompt-list li [data-copy-prompt]{
       align-self:flex-end;
     }
     .admin-save-apply-btn{
       margin-left:0;
     }
   }
   .admin-dream-layout{
     display:grid;
     grid-template-columns:minmax(280px, 360px) minmax(0, 1fr);
     gap:16px;
     align-items:stretch;
   }
   .admin-dream-section{
     display:flex;
     flex-direction:column;
     min-width:0;
     min-height:0;
   }
   .admin-dream-headline{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:10px;
   }
   .admin-dream-toolbar{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     align-items:flex-end;
     margin-bottom:12px;
   }
   .admin-dream-toolbar label{
     display:flex;
     flex-direction:column;
     gap:6px;
     color:var(--ink);
     font-size:13px;
     font-weight:700;
   }
   .admin-dream-toolbar input{
     min-width:150px;
     border:1px solid var(--line);
     border-radius:10px;
     background:var(--surface-bg);
     color:var(--ink);
     font-size:13px;
     padding:7px 10px;
   }
   .admin-dream-toolbar input[type="date"]{
     appearance:auto;
     -webkit-appearance:auto;
     color-scheme:light dark;
     min-height:38px;
     cursor:pointer;
   }
   .admin-dream-toolbar input[type="date"]::-webkit-datetime-edit,
   .admin-dream-form input[type="date"]::-webkit-datetime-edit{
     color:inherit;
   }
   .admin-dream-toolbar input[type="date"]::-webkit-calendar-picker-indicator{
     cursor:pointer;
     opacity:1;
   }
   .admin-dream-list{
     display:flex;
     flex-direction:column;
     gap:10px;
     min-height:0;
     max-height:min(68dvh, 920px);
     overflow:auto;
     padding-right:4px;
   }
   .admin-dream-item{
     appearance:none;
     width:100%;
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fff;
     padding:12px 14px;
     text-align:left;
     display:flex;
     flex-direction:column;
     gap:6px;
     cursor:pointer;
   }
   .admin-dream-item:hover,
   .admin-dream-item:focus-visible,
   .admin-dream-item.active{
     border-color:#9fbbd8;
     background:#f8fbff;
   }
   .admin-dream-item-date{
     color:#173d5b;
     font-size:15px;
   }
   .admin-dream-item-meta{
     color:#54708a;
     font-size:12px;
     line-height:1.5;
   }
   .admin-dream-detail{
     min-height:180px;
   }
   .admin-dream-form{
     border:1px solid #d9e3f0;
     border-radius:12px;
     background:#fbfdff;
     padding:16px;
     display:flex;
     flex-direction:column;
     gap:14px;
   }
   .admin-dream-readonly{
     margin:-4px 0 0;
     color:#54708a;
     font-size:12px;
     font-weight:700;
   }
   .admin-dream-visibility{
     justify-content:flex-start;
     align-items:flex-start;
     gap:4px;
   }
   .admin-dream-visibility-control{
     display:inline-flex;
     align-items:center;
     align-self:flex-start;
     gap:8px;
     min-height:auto;
     color:var(--ink);
     font-size:14px;
     font-weight:400;
     /* font-weight:600; */
     line-height:1.35;
   }
   .admin-dream-visibility-control input[type="checkbox"]{
     width:16px;
     height:16px;
     margin:0;
     flex:0 0 auto;
     accent-color:#2563eb;
   }
   .admin-dream-visibility-control > span{
     display:block;
     line-height:1.35;
   }
   .admin-dream-actions-editor{
     border-top:1px solid #e4edf8;
     padding-top:12px;
   }
   .admin-dream-action-list{
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   .admin-dream-action-row{
     display:grid;
     grid-template-columns:120px minmax(0, 1fr) auto;
     gap:8px;
     align-items:center;
   }
   .admin-dream-action-field{
     display:flex;
     flex-direction:column;
     gap:6px;
     min-width:0;
   }
   .admin-dream-action-field .admin-user-input{
     width:100%;
   }
   .admin-dream-file-input{
     width:100%;
   }
   .admin-dream-file-status{
     display:flex;
     flex-direction:column;
     gap:4px;
     color:#54708a;
     font-size:12px;
     line-height:1.5;
   }
   .admin-dream-file-meta{
     display:flex;
     flex-wrap:wrap;
     gap:6px;
     align-items:center;
     min-width:0;
   }
   .admin-dream-file-meta a{
     color:#1f4f79;
     font-weight:700;
     word-break:break-all;
   }
   .admin-bulletin-row{
     display:grid;
     grid-template-columns:minmax(90px, 110px) minmax(150px, 170px) minmax(0, 1fr) auto;
     gap:8px;
     align-items:center;
   }
   .admin-bulletin-row-special{
     grid-template-columns:minmax(160px, 1fr) minmax(0, 1fr) auto;
   }
   .admin-bulletin-row .admin-user-input{
     width:100%;
   }
   .admin-bulletin-readonly{
     background:#eef4fa;
     color:#54708a;
     font-weight:700;
   }
   .admin-dream-form input[type="date"]{
     cursor:pointer;
     color-scheme:light dark;
   }
   .admin-dream-form input[type="date"]::-webkit-calendar-picker-indicator{
     cursor:pointer;
     opacity:1;
   }
   .admin-dream-block{
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   .admin-dream-block strong{
     color:#1f4567;
     font-size:14px;
   }
   .admin-dream-block p{
     margin:0;
     color:#36566f;
     line-height:1.6;
   }
   .admin-dream-bullets,
   .admin-dream-links{
     margin:0;
     padding-left:18px;
     color:#36566f;
   }
   .admin-dream-bullets li,
   .admin-dream-links li{
     margin:0 0 8px;
     line-height:1.5;
   }
   .admin-dream-links a{
     display:inline-block;
     margin:0 8px 0 6px;
   }
   .admin-dream-links code{
     display:block;
     margin-top:4px;
     color:#54708a;
     font-size:12px;
     word-break:break-all;
   }
   .admin-dream-action-type{
     display:inline-block;
     min-width:40px;
     color:#1f4f79;
     font-weight:700;
     text-transform:lowercase;
   }
   .admin-dream-empty{
     border:1px dashed #d1deef;
     border-radius:10px;
     padding:14px;
     color:#54708a;
     background:#f8fbff;
   }
   @media (max-width:768px){
     .admin-dream-layout{
       grid-template-columns:1fr;
     }
     .admin-dream-toolbar{
       align-items:stretch;
     }
     .admin-dream-toolbar label,
     .admin-dream-toolbar input,
     .admin-dream-toolbar .auth-btn{
       width:100%;
     }
     .admin-dream-action-row{
       grid-template-columns:1fr;
     }
     .admin-bulletin-row,
     .admin-bulletin-row-special{
       grid-template-columns:1fr;
     }
     .admin-dream-list{
       max-height:none;
       overflow:visible;
       padding-right:0;
     }
   }
   
   /* =========================
      Filter Bar (공용) – 오른쪽 끝 정렬
      ========================= */
   .section.date-filter{
     margin-top:0; 
     margin-bottom:16px;
     width:100%;
     display:flex;
     justify-content:flex-end;
     text-align:right;
   }
   .section.date-filter .filter-row{
     display:flex; 
     gap:12px; 
     align-items:center; 
     flex-wrap:wrap;
     margin-left:auto;
   }
   .filter-row label{
     display:flex; 
     align-items:center; 
     gap:8px;
     background:var(--surface-bg); 
     border:1px solid var(--line); 
     border-radius:10px;
     padding:8px 12px; 
     box-shadow:0 2px 8px rgba(0, 0, 0, 0.04);
   }
   .filter-row span{ color:#5b6b76; font-size:13px; font-weight:700; }
   .filter-row select{ border:0; outline:0; background:transparent; font-weight:700; color:var(--nav); }
   
   /* =========================
      Cards Grid (주보/드림 공통)
      ========================= */
   .month-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(var(--card-min-w), 1fr));
     gap: 20px;
     justify-content: center;
   }
   
   /* Dream page: limit cards to max 2 per row on desktop/tablet */
   body.page-dream .month-grid{
     grid-template-columns:repeat(2, minmax(0, 1fr));
   }
   @media (max-width:768px){
     body.page-dream .month-grid{
       grid-template-columns:1fr;
     }
   }
   
    /* 데스크톱에서  1 열고정 */
   @media (min-width:800px) {
     .month-grid { grid-template-columns: repeat(auto-fill, minmax(var(--card-min-w), 1fr)); }
   }
   @media (min-width:1120px) {
     .month-grid { grid-template-columns: repeat(auto-fill, minmax(var(--card-min-w), 1fr)); }
   }
   
   /* =========================
      Card (공통 스타일)
      - 가로 고정 안정화: min-width:0
      - 긴 텍스트 줄바꿈/말줄임, 이미지 폭 제한
      ========================= */
   .month-card {
     background:var(--surface-bg); border:1px solid var(--line); border-radius:12px;
     padding:18px; box-shadow:var(--shadow-sm);
     transition:transform .18s, box-shadow .18s;
     display:flex; flex-direction:column;   /* 내부 정렬 */
     height:var(--card-fixed-h);            /* ← 필요 시 동일 높이 강제 (예: 220px) */
     min-height:unset;                      /* 기본은 자동 */
   
     /* === 추가: 가로 고정/내부 컨텐츠로 폭 밀림 방지 === */
     width:100%;
     min-width:0;                           /* 핵심 */
     overflow-wrap:anywhere;                /* 긴 단어도 강제 줄바꿈 */
     word-break:break-word;
   }
   .month-card * { min-width:0; } /* 자식이 폭을 밀지 못하게 */
   .month-card img { max-width:100%; height:auto; display:block; }
   
   .month-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); }
   
   /* =========================
      Bulletin (주보)
      ========================= */
   .month-title{ margin:0 0 12px; font-size:18px; font-weight:800; color:var(--nav); }
   
   .special{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; }
   .special-link{
     display:inline-block; text-decoration:none; font-weight:700; font-size:13px;
     color:var(--nav); background:var(--accent-bg); border:1px solid var(--accent-border);
     padding:6px 10px; border-radius:10px; transition:background .18s, box-shadow .18s, color .18s;
   }
   .special-link:hover{
     background:color-mix(in srgb, var(--accent-bg) 80%, var(--nav) 20%);
     box-shadow:0 2px 8px rgba(0,0,0,.06);
   }
   
   .week-buttons{ display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; }
   .week-buttons .btn{
     display:inline-flex; align-items:center; justify-content:center;
     text-decoration:none; font-weight:700; font-size:14px;
     padding:7px 12px; border-radius:10px; color:var(--ink); background:var(--accent-bg); border:1.5px solid var(--accent-border);
     transition:background .18s, color .18s, border-color .18s, box-shadow .18s, transform .05s;
   }
   .week-buttons .btn:hover{
     background:var(--nav); color:var(--surface-bg); border-color:var(--nav);
     box-shadow:0 2px 8px rgba(15,62,102,.18);
   }
   .week-buttons .btn:active{ transform:translateY(1px); }
   
   /* =========================
      Dream (찬양단)
      ========================= */
   .dream-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
   .dream-date{ margin:0; font-size:18px; font-weight:800; color:var(--tab-point); }
   .dream-note{ margin:0; color:#6b7280; font-size:13px; }

   .dream-setlist-search{
     margin:0 0 16px;
     width:100%;
     max-width:none;
     padding:0;
     display:flex;
     justify-content:flex-end;
   }
   .dream-setlist-search-row{
     display:flex;
     align-items:center;
     gap:14px;
     margin-left:auto;
     width:100%;
     max-width:302px;
     flex-wrap:nowrap;
   }
   .dream-setlist-search-field{
     margin:0;
     flex:1 1 auto;
     min-width:0;
     width:auto;
   }
   .dream-setlist-search-input{
     width:100%;
     min-width:0;
     height:50px;
     padding:0 16px;
   }
   .dream-setlist-search-reset{
     flex:0 0 auto;
     white-space:nowrap;
     height:50px;
     padding:0 18px;
   }
   @media (max-width:720px){
     .dream-setlist-search-input{
       height:48px;
     }
     .dream-setlist-search-reset{
       height:48px;
     }
   }
   @media (max-width:480px){
     .dream-setlist-search-row{
       max-width:298px;
       gap:10px;
     }
   }
   .dream-setlist-search-empty{
     margin:0;
     padding:24px 0;
     text-align:center;
     color:#6b7280;
   }
   
   .songlist{
     list-style:none; padding:0; margin:10px 0 14px 0;
     display:grid; row-gap:6px; color:#3b4752;
     font-size:13px; line-height:1.5;
   }
   body.page-dream #tab-dream-setlist .songlist{
     align-content:start;
     grid-auto-rows:max-content;
   }
   @media (max-width:520px){ .songlist{ font-size:12.5px; } }

   .action-bar{ display:flex; flex-wrap:wrap; gap:10px; margin-top:auto; }
   body.page-dream #tab-dream-setlist .action-bar{
     display:grid;
     grid-template-columns:repeat(5, minmax(0, max-content));
     grid-auto-flow:row;
     justify-content:start;
   }
   .chip{
     display:inline-flex; align-items:center; gap:6px;
     padding:8px 12px; border-radius:10px; font-weight:700; font-size:13.5px;
     text-decoration:none; color:#4a6c89; background:#f7fbff; border:1.5px solid #d3dfec;
     transition: background .18s, color .18s, border-color .18s, box-shadow .18s, transform .05s;
   }
   .chip:hover{
     background:var(--tab-point);
     color:#fff;
     border-color:var(--tab-point);
     box-shadow:0 2px 8px color-mix(in srgb, var(--tab-point) 32%, transparent);
   }
   .chip:active{ transform:translateY(1px); }
   
   .chip-icon{ width:40px; height:40px; padding:0; justify-content:center; border-radius:10px; }
   .chip-icon svg{ width:18px; height:18px; display:block; }
   
   .action-bar .chip span:not(.sr-only){ display:none; }
   .dream-render-error{
     margin:0;
     padding:24px 0;
     text-align:center;
     color:#6b7280;
   }

   .svg-sprite{ display:none; }
   
   /* =========================
      Footer
      ========================= */
   .site-footer{
     border-top:1px solid var(--line);
     background:#fff; color:#8a909a; text-align:center;
   }
   .site-footer .container{ padding:30px 16px; font-size:13.5px; letter-spacing:.15px; }
   
   /* =========================
      필터적용
      ========================= */
   [hidden] { display: none !important; }
   .month-card[hidden], .dream-card[hidden]{ display: none !important; }
   
   /* =========================
      동영상 모달(정중앙 고정)
      ========================= */
   .video-modal{
     position: fixed; 
     inset: 0; 
     z-index: 9999;
     background: rgba(0,0,0,.6);
   }
   
   .video-modal > .video-modal-content{
     position: fixed; 
     top: 50%; 
     left: 50%;
     transform: translate(-50%, -50%);
     width: min(92vw, 960px);
     max-height: 85vh; 
     background: #000;
     border-radius: 12px; 
     padding: 0;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
     overflow: hidden;
   }
   #videoPlayer{
     display:block; width:100%; height:auto; max-height:85vh;
     margin:0 !important; object-fit:contain;
   }
   .video-modal-close{
     color:#fff; 
     text-shadow:0 1px 2px rgba(0, 0, 0, 0.6);
   }
   
   /* =========================================
      홈 히어로(최소 스타일) – 스크롤 없이 중앙 정렬
      ========================================= */
   /* 홈 히어로: 화면 중앙 정렬 */
   .home main.section{
     margin: 0;
     padding: 0;
     max-width: 100%;
     flex: 1;              /* 남는 공간 채우기 */
     display: flex;
   }
   
   /* 홈 비주얼 배너 */
   .home .visual-banner{
     flex: 1;
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .visual-banner-image{
     width: min(18vw, 324px, 100%);
     max-height: 56.25vh;
     height: auto;
     object-fit: contain;
   }
   
   @media (max-width: 768px){
     .visual-banner-image{
       width: min(60vw, 324px, 100%);
     }
   }
   
   /* ===== Hymn: 검색 ===== */
   .hymn-search{
     margin:0 0 20px;
     padding:0 16px;
   }
   .hymn-search-input{
     width:100%;
     padding:14px 16px;
     border-radius:12px;
     border:1.5px solid var(--line);
     font-size:15px;
     font-weight:600;
     background:#fff;
     box-shadow:0 6px 18px rgba(15, 62, 102, 0.08);
     transition:border-color .18s, box-shadow .18s;
   }
   .hymn-search-input:focus{
     outline:none;
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 3px var(--tab-point-highlight);
   }
   .hymn-search-status{
     margin:12px 0 0;
     color:#3f6786;
     font-size:13px;
     font-weight:700;
   }
   .hymn-search-options{
     margin:16px 0 0;
     display:flex;
     gap:10px;
   }
   .hymn-search-option{
     display:flex;
     align-items:center;
     gap:6px;
     padding:8px 12px;
     border-radius:12px;
     border:1.5px solid var(--line);
     background:#fff;
     color:var(--tab-point);
     font-weight:600;
     font-size:13px;
     cursor:pointer;
     transition:border-color .18s, background .18s, color .18s, box-shadow .18s;
   }
   .hymn-search-option input{
     accent-color:var(--tab-point-soft);
   }
   .hymn-search-option:hover{
     border-color:var(--tab-point-soft);
     box-shadow:0 4px 14px color-mix(in srgb, var(--tab-point) 22%, transparent);
   }
   .hymn-search-option input:checked + span{
     color:var(--tab-point);
     font-weight:700;
   }
   .hymn-results-wrapper{
     padding:0 16px;
     margin:0 0 20px;
   }
   .hymn-results{
     list-style:none;
     margin:0;
     padding:0;
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   .hymn-result{
     display:flex;
     align-items:center;
     justify-content:space-between;
     width:100%;
     padding:12px 16px;
     border-radius:12px;
     border:1.5px solid var(--line);
     background:#fff;
     color:var(--tab-point);
     font-weight:700;
     font-size:15px;
     text-align:left;
     cursor:pointer;
     transition:background .18s, color .18s, border-color .18s, box-shadow .18s, transform .05s;
   }
   .hymn-result:hover{
     background:var(--tab-point);
     color:#fff;
     border-color:var(--tab-point);
     box-shadow:0 4px 12px color-mix(in srgb, var(--tab-point) 28%, transparent);
   }
   .hymn-result:focus-visible{
     outline:2px solid var(--tab-point-soft);
     outline-offset:2px;
   }
   .hymn-result.is-active{
     background:var(--tab-point);
     color:#fff;
     border-color:var(--tab-point);
     box-shadow:0 4px 14px color-mix(in srgb, var(--tab-point) 36%, transparent);
   }
   .hymn-results-empty{
     margin:8px 0 0;
     padding:16px 0;
     color:#6b7280;
     font-size:14px;
     text-align:center;
   }
   .hymn-viewer{
     padding:0 16px 40px;
   }
   .hymn-viewer-placeholder{
     margin:0;
     color:#6b7280;
     font-size:14px;
   }
   .hymn-viewer-figure{
     margin:0;
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   .hymn-viewer-title{
     margin:0;
     font-size:18px;
     font-weight:800;
     color:#0f3e66;
   }
   .hymn-viewer img{
     width:100%;
     max-width: min(100%, 720px);
     border-radius:14px;
     border:1px solid #d9e2ec;
     box-shadow:0 18px 36px rgba(15, 62, 102, 0.18);
     background:#fff;
   }
   .hymn-viewer-lyrics{
     margin:0;
     color:#3b4752;
     font-size:14px;
     line-height:1.6;
     white-space:pre-line;
   }
   
   .btn-open{background:#0f3e66;color:#fff;border-radius:10px;padding:8px 14px;margin-right:6px;}
   
   .btn-download{border-radius:10px;padding:8px 14px;border:1.5px solid #d3dfec;color:#4a6c89;background:#f7fbff;}
   .btn-download:hover{background:#0f3e66;color:#fff;border-color:#0f3e66;}
   
   .week-buttons .btn-open{background:#0f3e66;color:#fff;border:1.5px solid #0f3e66;border-radius:10px;padding:8px 14px;font-weight:700;}
   .week-buttons .btn-open:hover{background:#134a84;}
   .week-buttons .btn-download{background:#f7fbff;color:#4a6c89;border:1.5px solid #d3dfec;border-radius:10px;padding:8px 14px;font-weight:700;}
   .week-buttons .btn-download:hover{background:#0f3e66;color:#fff;border-color:#0f3e66;}
   
   /* =========================
      Card Utility
      ========================= */
   .card{
     background:var(--surface-bg);
     border:1px solid var(--line);
     border-radius:var(--radius);
     padding:24px;
     box-shadow:var(--shadow-sm);
   }
   
   @media (max-width:640px){
     .card{ padding:18px; }
   }
   
   /* =========================
      Tabs (Bible page)
      ========================= */
   .tab-container{ display:flex; flex-direction:column; gap:20px; width:100%; box-sizing:border-box; }
   .tab-toolbar{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:8px;
     border-bottom:1px solid var(--line);
     padding-bottom:4px;
   }
   .tab-list{
     display:flex;
     gap:8px;
     align-items:flex-end;
     flex-wrap:nowrap;
     overflow-x:auto;
     scrollbar-width:none;
     -ms-overflow-style:none;
   }
   .tab-list::-webkit-scrollbar{
     display:none;
   }
   .tab-toolbar .tab-list{
     flex:1 1 auto;
     min-width:0;
   }
   .tab{
     border:0;
     background:transparent;
     font-weight:700;
     font-size:16px;
     color:var(--muted);
     padding:10px 14px;
     border-radius:0;
     cursor:pointer;
     border-bottom:3px solid transparent;
     transition:color .18s, border-color .18s;
   }
   .tab:hover{
     color:var(--tab-point);
     border-bottom-color:color-mix(in srgb, var(--tab-point-soft) 55%, transparent);
   }
   .tab.active{
     color:var(--tab-point);
     border-bottom-color:var(--tab-point-soft);
     box-shadow:none;
   }

   /* =========================
      Finance page (재정부)
      — .tab-container · .tab · .card · .btn-* · CSS 변수 재사용
      — 다크 모드: 성경(reader) 토큰과 동일 계열 (--reader-*, --tab-point-*)
      ========================= */
   body.app-dark-mode.page-finance{
     --reader-card-bg:var(--app-dark-surface);
     --reader-card-border:var(--app-dark-border);
     --reader-text:var(--app-dark-text);
   }
   body.page-finance .finance-main{
     max-width:min(960px, var(--content-max-w));
     margin:28px auto 64px;
     padding:0 16px 32px;
     box-sizing:border-box;
   }
   body.page-dream main[data-dream-tabs]{
     padding-bottom:32px;
   }
   body.page-dream main[data-dream-tabs] > .tab-toolbar{
     width:min(100%, 960px);
     margin:0 auto;
     box-sizing:border-box;
   }
   body.page-finance .finance-dev-hint{
     color:var(--muted);
     font-size:0.875rem;
     margin:0 0 12px;
     line-height:1.5;
   }
   body.app-dark-mode.page-finance .finance-dev-hint{
     color:var(--app-dark-muted);
   }
   body.page-finance .finance-loading,
   body.page-finance .finance-disabled{
     border-radius:var(--radius);
     border:1px solid var(--line);
     padding:24px;
     text-align:center;
     color:var(--muted);
     background:var(--surface-bg);
     box-shadow:var(--shadow-sm);
   }
   body.app-dark-mode.page-finance .finance-loading,
   body.app-dark-mode.page-finance .finance-disabled{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-muted);
   }
   body.page-finance #financeTabRoot{
     gap:20px;
   }
   body.page-finance #financeTabRoot .tab-toolbar{
     align-items:flex-start;
    }
   body.page-finance #financeTabRoot .tab-list{
     gap:24px;
   }
   body.page-finance .finance-panel.card{
     margin:0;
   }
   body.page-finance .finance-panel.card:not(.is-active){
     display:none;
   }
   body.page-finance .finance-panel.card.is-active{
     display:block;
   }
   body.page-finance .finance-panel.card .field .field-label{
     color:var(--muted);
     font-weight:700;
     font-size:13px;
   }
   body.page-finance .finance-report-sections,
   body.page-finance .finance-report-card{
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   body.page-finance .finance-report-card.card{
     margin:10px 0 0;
     padding:14px 16px;
     border-bottom:1px solid var(--border-color, rgba(31, 61, 85, 0.14));
     transition:background-color .22s ease, box-shadow .22s ease, border-color .22s ease;
   }
   body.page-finance .finance-report-card.card.is-open{
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--tab-point-highlight) 12%);
     box-shadow:0 10px 24px rgba(31, 61, 85, 0.08);
   }
   body.page-finance .finance-report-head{
     display:grid;
     grid-template-columns:minmax(0, 1fr) auto;
     align-items:flex-start;
     justify-content:space-between;
     gap:8px;
   }
   body.page-finance .finance-report-expander{
     width:100%;
     cursor:pointer;
     border-radius:14px;
     padding:4px 2px;
     transition:background-color .2s ease, color .2s ease;
   }
   body.page-finance .finance-report-expander:hover{
     background:color-mix(in srgb, var(--surface-bg) 90%, var(--tab-point-highlight) 10%);
   }
   body.page-finance .finance-report-expander:focus-visible{
     outline:none;
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--tab-point-highlight) 12%);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-highlight) 24%, transparent);
   }
   body.page-finance .finance-report-head > .h3,
   body.page-finance .finance-report-department-head > .h3{
     margin:0;
     font-size:1.02rem;
     line-height:1.35;
   }
   body.page-finance .finance-report-head-actions{
     display:flex;
     flex-wrap:wrap;
     justify-content:flex-end;
     align-items:center;
     align-self:flex-start;
     gap:10px;
   }
   body.page-finance .finance-report-copy-btn{
     min-height:40px;
   }
   body.page-finance .finance-report-body[hidden]{
     display:none;
   }
   body.page-finance .finance-report-body{
     padding-top:4px;
   }
   body.page-finance .finance-users-admin-department{
      min-height:40px;
      min-width:140px;
      width:auto;
    }
   body.page-finance .finance-users-admin-name,
   body.page-finance .finance-users-admin-role{
     min-height:40px;
     width:100%;
   }
   body.page-finance .finance-users-admin-actions{
     white-space:nowrap;
   }
   body.page-finance .finance-users-admin-actions .finance-toolbar-btn + .finance-toolbar-btn{
     margin-left:8px;
   }
   body.page-finance .finance-users-admin-save[disabled]{
     opacity:.6;
     pointer-events:none;
   }
   body.page-finance .finance-report-sections{
     gap:16px;
   }
   body.page-finance .finance-report-department-head{
     display:flex;
     align-items:flex-start;
     justify-content:space-between;
     gap:12px;
     margin-bottom:4px;
   }
   body.page-finance .finance-report-chevron{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     width:36px;
     height:36px;
     border-radius:999px;
     color:var(--muted);
     background:color-mix(in srgb, var(--surface-bg) 82%, transparent);
     transition:transform .3s ease, background-color .2s ease, color .2s ease;
     flex-shrink:0;
     pointer-events:none;
   }
   body.page-finance .finance-report-expander:hover .finance-report-chevron,
   body.page-finance .finance-report-expander:focus-visible .finance-report-chevron{
     background:color-mix(in srgb, var(--surface-bg) 74%, var(--tab-point-highlight) 26%);
     color:var(--app-point, var(--nav));
   }
   body.page-finance .finance-report-expander.is-open .finance-report-chevron{
     transform:rotate(180deg);
     color:var(--app-point, var(--nav));
   }
   body.page-finance .finance-report-department-body{
     display:flex;
     flex-direction:column;
     gap:10px;
     padding-top:4px;
   }
   body.page-finance .finance-report-item-summary{
     min-width:0;
     color:var(--muted);
     font-size:0.95rem;
     line-height:1.5;
   }
   body.page-finance .finance-report-item-summary .finance-budget-over,
   body.page-finance .finance-table td.finance-budget-over{
     color:#b42318;
     font-weight:700;
   }
   body.app-dark-mode.page-finance .finance-report-item-summary .finance-budget-over,
   body.app-dark-mode.page-finance .finance-table td.finance-budget-over{
     color:#ef9a93;
   }
   body.page-finance .finance-panel[data-finance-panel="users_admin"] .finance-toolbar-actions{
     align-items:center;
   }
   body.page-finance .finance-weekly-summary{
     margin:0;
   }
   body.page-finance .finance-toolbar{
     display:flex;
     flex-direction:column;
     align-items:stretch;
     gap:10px;
     margin-bottom:16px;
   }
   body.page-finance .finance-toolbar-row{
     display:flex;
     align-items:center;
     gap:10px;
     width:100%;
   }
   body.page-finance .finance-toolbar-actions{
     justify-content:flex-start;
   }
   body.page-finance .finance-approval-total{
     margin-left:auto;
     color:var(--text);
     font-size:1.125rem;
     font-weight:700;
     text-align:right;
   }
   body.page-finance .finance-toolbar-btn{
     min-height:48px;
     min-width:48px;
   }
   body.page-finance .finance-check-label{
     display:inline-flex;
     align-items:center;
     gap:10px;
     font-weight:700;
     color:inherit;
   }
   body.page-finance .finance-check-label input{
     accent-color:var(--tab-point);
     width:18px;
     height:18px;
   }
   body.page-finance .finance-period-fields-row{
     display:grid;
     grid-template-columns:repeat(3, minmax(0, 1fr));
     gap:12px;
     align-items:end;
   }
   body.page-finance .finance-period-fields-row[hidden]{
     display:none;
   }
   body.page-finance .finance-period-fields-row .field{
     min-width:0;
   }
   body.page-finance .finance-period-fields-row .memo-index-date{
     min-height:44px;
     height:44px;
     padding:0 18px;
     border-radius:16px;
     font-size:15px;
     background:color-mix(in srgb, var(--surface-bg) 92%, #000000 8%);
     color:inherit;
     border:1px solid color-mix(in srgb, var(--ink, var(--reader-text, currentColor)) 24%, transparent);
   }
   body.page-finance .finance-period-fields-row .memo-index-date:focus{
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 24%, transparent);
   }
   body.page-finance .finance-period-fields-row .memo-index-apply-btn{
     min-width:92px;
     min-height:44px;
     height:44px;
     padding:0 24px;
     border-radius:16px;
     align-self:end;
     border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     color:var(--reader-text, var(--ink));
   }
   body.page-finance .finance-period-fields-row .memo-index-apply-btn:hover,
   body.page-finance .finance-period-fields-row .memo-index-apply-btn:focus-visible{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-finance .finance-period-fields-row .memo-index-apply-btn:active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
     transform:translateY(1px);
   }
   body.page-finance .finance-error{
     border-radius:var(--radius);
     border:1px solid var(--line);
     padding:12px 16px;
     margin-bottom:12px;
     color:var(--memo-indicator-ink);
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--memo-indicator) 12%);
   }
   body.page-finance .finance-table-wrap{
     overflow-x:auto;
     -webkit-overflow-scrolling:touch;
   }
   body.page-finance .finance-table{
     width:100%;
     border-collapse:collapse;
     border-spacing:0;
     font-size:0.9375rem;
     color:inherit;
    }
   body.page-finance .finance-table th,
   body.page-finance .finance-table td{
     border:1px solid var(--line);
     padding:10px 12px;
     text-align:left;
   }
   body.page-finance .finance-table th{
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--tab-point-highlight) 12%);
     color:var(--app-point, var(--nav));
     font-weight:700;
     text-align:center;
    }
   body.page-finance .finance-table tbody tr:nth-child(even){
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
   }
   body.page-finance .finance-table tbody tr.finance-report-group-row,
   body.page-finance .finance-table tbody tr.finance-report-group-row:nth-child(even){
     background:transparent;
   }
   body.page-finance .finance-table tbody tr.finance-report-group-row th{
     text-align:left;
     font-size:0.95rem;
     letter-spacing:-0.01em;
     background:color-mix(in srgb, var(--surface-bg) 82%, var(--tab-point-highlight) 18%);
   }
   body.page-finance .finance-table tbody tr.finance-report-summary-row{
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--tab-point-highlight) 12%);
     font-weight:700;
   }
   body.page-finance .finance-table tbody tr.finance-report-title-row{
     color:var(--app-point, var(--nav));
   }
   body.page-finance .finance-table tbody tr.finance-doc-row{
     cursor:pointer;
     transition:background-color .16s ease, box-shadow .16s ease;
   }
   body.page-finance .finance-table tbody tr.finance-doc-row:hover,
   body.page-finance .finance-table tbody tr.finance-doc-row:focus-visible,
   body.page-finance .finance-table tbody tr.finance-doc-row.is-selected{
     background:color-mix(in srgb, var(--surface-bg) 82%, var(--tab-point-highlight) 18%);
     outline:none;
   }
   body.app-dark-mode.page-finance .finance-table th{
     background:color-mix(in srgb, var(--app-dark-surface) 82%, var(--tab-point-highlight) 18%);
     color:var(--app-point-soft);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode.page-finance .finance-table td{
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.page-finance .finance-period-fields-row .memo-index-date{
     background:color-mix(in srgb, var(--app-dark-surface) 88%, #000000 12%);
     color:var(--app-dark-text);
     border-color:color-mix(in srgb, var(--app-dark-text) 30%, transparent);
   }
   body.app-dark-mode.page-finance .finance-period-fields-row .memo-index-date:focus{
     border-color:var(--app-point-soft);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-soft) 24%, transparent);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr{
     background:color-mix(in srgb, var(--app-dark-surface) 92%, transparent);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr:nth-child(even){
     background:color-mix(in srgb, var(--app-dark-surface) 84%, var(--tab-point-highlight) 16%);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-report-group-row,
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-report-group-row:nth-child(even){
     background:transparent;
   }
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-report-group-row th{
     background:color-mix(in srgb, var(--app-dark-surface) 72%, var(--tab-point-highlight) 28%);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-report-summary-row{
     background:color-mix(in srgb, var(--app-dark-surface) 76%, var(--tab-point-highlight) 24%);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-report-title-row{
     color:var(--app-point-soft);
   }
   body.app-dark-mode.page-finance .finance-report-card.card{
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode.page-finance .finance-report-card.card.is-open{
     background:color-mix(in srgb, var(--app-dark-surface) 84%, var(--tab-point-highlight) 16%);
     box-shadow:0 12px 28px rgba(0, 0, 0, 0.28);
   }
   body.app-dark-mode.page-finance .finance-report-expander:hover{
     background:color-mix(in srgb, var(--app-dark-surface) 80%, var(--tab-point-highlight) 20%);
   }
   body.app-dark-mode.page-finance .finance-report-expander:focus-visible{
     background:color-mix(in srgb, var(--app-dark-surface) 78%, var(--tab-point-highlight) 22%);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-soft) 24%, transparent);
   }
   body.app-dark-mode.page-finance .finance-report-chevron{
     background:color-mix(in srgb, var(--app-dark-surface) 78%, transparent);
     color:var(--app-dark-text-muted, var(--muted));
   }
   body.app-dark-mode.page-finance .finance-report-expander:hover .finance-report-chevron,
   body.app-dark-mode.page-finance .finance-report-expander:focus-visible .finance-report-chevron,
   body.app-dark-mode.page-finance .finance-report-expander.is-open .finance-report-chevron{
     background:color-mix(in srgb, var(--app-dark-surface) 68%, var(--tab-point-highlight) 32%);
     color:var(--app-point-soft);
   }
   .theme-refreshing{
     transform:translateZ(0);
   }
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-doc-row:hover,
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-doc-row:focus-visible,
   body.app-dark-mode.page-finance .finance-table tbody tr.finance-doc-row.is-selected{
     background:color-mix(in srgb, var(--app-dark-surface) 70%, var(--tab-point-highlight) 30%);
   }
   body.page-finance .finance-table .finance-num{
     text-align:right;
     font-variant-numeric:tabular-nums;
   }
   body.page-finance .finance-table th.finance-num{
     text-align:center;
   }
   body.page-finance .finance-table td.finance-num{
     text-align:right;
   }
   body.page-finance .finance-approval-table .finance-col-id{
     width:57px;
     min-width:57px;
   }
   body.page-finance .finance-approval-table .finance-col-date{
     width:172px;
     min-width:172px;
   }
   body.page-finance .finance-approval-table .finance-col-drafter{
     width:92px;
     min-width:92px;
   }
   body.page-finance .finance-approval-table .finance-col-department{
     width:118px;
     min-width:118px;
   }
   body.page-finance .finance-approval-table .finance-col-state{
     width:120px;
     min-width:120px;
   }
   body.page-finance .finance-approval-table .finance-col-amount{
     width:150px;
     min-width:150px;
   }
   body.page-finance .finance-closed-table .finance-col-action{
     width:124px;
     min-width:124px;
   }
   body.page-finance .finance-summary-card{
     display:flex;
     flex-wrap:wrap;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     margin:0 0 12px;
     padding:14px 16px;
     border:1px solid var(--line);
     border-radius:var(--radius);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
   }
   body.page-finance .finance-summary-period,
   body.page-finance .finance-summary-total{
     margin:0;
   }
   body.page-finance .finance-summary-total strong{
     font-size:1.125rem;
     color:var(--app-point, var(--tab-point));
   }
   body.page-finance .finance-row-detail-btn{
     min-width:96px;
   }
   body.page-finance .finance-empty{
     color:var(--muted);
     text-align:center;
     padding:24px 16px;
   }
   body.page-finance .finance-docs-cards{
     display:none;
   }
   body.page-finance .finance-doc-card{
     width:100%;
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     border-radius:var(--radius);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     padding:16px;
     display:flex;
     flex-direction:column;
     gap:12px;
     text-align:left;
     color:inherit;
   }
   body.page-finance .finance-doc-card:hover,
   body.page-finance .finance-doc-card:focus-visible,
   body.page-finance .finance-doc-card.is-selected{
     border-color:color-mix(in srgb, var(--tab-point-soft) 72%, var(--line) 28%);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 16%, transparent);
   }
   body.page-finance .finance-doc-card-top{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
   }
   body.page-finance .finance-doc-badge{
     display:inline-flex;
     align-items:center;
     min-height:30px;
     padding:0 12px;
     border-radius:999px;
     background:color-mix(in srgb, var(--tab-point-highlight) 68%, var(--surface-bg) 32%);
     color:var(--app-point, var(--tab-point));
     font-weight:700;
     font-size:.875rem;
   }
   body.page-finance .finance-doc-card-amount{
     font-size:1.0625rem;
     font-variant-numeric:tabular-nums;
   }
   body.page-finance .finance-doc-card-body{
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   body.page-finance .finance-doc-card-title{
     margin:0;
     font-weight:700;
     line-height:1.45;
   }
   body.page-finance .finance-doc-card-meta{
     margin:0;
     color:var(--muted);
     font-size:.875rem;
   }

   body.page-finance .finance-write-form{
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   body.page-finance .finance-field{
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   body.page-finance .finance-toolbar .finance-input-date,
   body.page-finance .finance-write-form .field :is(select,textarea),
   body.page-finance .finance-write-form .field input:not(.sr-only){
     min-height:48px;
     font:inherit;
     width:100%;
     max-width:100%;
    }
   body.page-finance .finance-write-form .field{
     width:100%;
     min-width:0;
   }
   body.page-finance .finance-receipt-upload-field{
     overflow:hidden;
   }
   body.page-finance .finance-write-form .field .sr-only{
     width:1px;
     max-width:none;
     min-width:0;
     min-height:0;
   }
   body.page-finance .finance-write-form .field textarea.entry-detail{
     min-height:5.5rem;
     resize:vertical;
     line-height:1.55;
   }
   body.page-finance .finance-receipt-upload-trigger{
     width:100%;
     max-width:100%;
     min-width:0;
     min-inline-size:0;
     box-sizing:border-box;
     display:flex;
     align-items:center;
     justify-content:center;
     gap:10px;
     min-height:88px;
      padding:16px 14px;
      border:2px dashed color-mix(in srgb, var(--line) 72%, var(--tab-point-highlight) 28%);
     border-radius:var(--radius);
     background:color-mix(in srgb, var(--surface-bg) 96%, var(--tab-point-highlight) 4%);
     color:var(--ink);
     text-align:center;
     border-collapse:separate;
     vertical-align:middle;
     overflow:hidden;
     cursor:pointer;
     transition:
       border-color 0.18s ease,
       background-color 0.18s ease,
       color 0.18s ease,
       box-shadow 0.18s ease,
       transform 0.18s ease;
   }
   body.page-finance .finance-receipt-upload-trigger:hover,
   body.page-finance .finance-receipt-upload-trigger:focus-visible,
   body.page-finance .finance-receipt-upload-trigger.is-dragover{
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--surface-bg) 90%, var(--tab-point-highlight) 10%);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-highlight) 24%, transparent);
   }
   body.page-finance .finance-receipt-upload-trigger.is-dragover{
     transform:translateY(-1px);
   }
   body.page-finance .finance-receipt-upload-icon{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     flex:0 0 auto;
     width:52px;
     height:52px;
     border-radius:999px;
     background:color-mix(in srgb, var(--tab-point-highlight) 68%, transparent);
     color:var(--tab-point);
   }
   body.page-finance .finance-receipt-upload-icon svg{
     width:26px;
     height:26px;
     stroke:currentColor;
     fill:none;
     stroke-width:1.8;
     stroke-linecap:round;
     stroke-linejoin:round;
   }
   body.page-finance .finance-receipt-upload-copy{
     min-width:0;
     max-width:100%;
     white-space:normal;
     overflow-wrap:anywhere;
     font-size:.95rem;
     font-weight:500;
      line-height:1.4;
   }
   body.app-dark-mode.page-finance .finance-receipt-upload-trigger{
     border-color:color-mix(in srgb, var(--app-dark-border) 76%, var(--tab-point-highlight) 24%);
     background:color-mix(in srgb, var(--app-dark-surface) 92%, var(--tab-point-highlight) 8%);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.page-finance .finance-receipt-upload-trigger:hover,
   body.app-dark-mode.page-finance .finance-receipt-upload-trigger:focus-visible,
   body.app-dark-mode.page-finance .finance-receipt-upload-trigger.is-dragover{
     border-color:var(--app-point-soft);
     background:color-mix(in srgb, var(--app-dark-surface) 84%, var(--tab-point-highlight) 16%);
   }
   body.app-dark-mode.page-finance .finance-receipt-upload-copy{
     color:var(--app-dark-muted);
   }
   body.page-finance .finance-write-form .field input[type="number"]{
     appearance:textfield;
     -moz-appearance:textfield;
   }
   body.page-finance .finance-write-form .field input[type="number"]::-webkit-outer-spin-button,
   body.page-finance .finance-write-form .field input[type="number"]::-webkit-inner-spin-button{
     -webkit-appearance:none;
     margin:0;
   }
   body.page-finance .finance-entry-rows{
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   body.page-finance .finance-entry-card{
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     border-radius:var(--radius);
     padding:16px 18px;
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
    }
   body.app-dark-mode.page-finance .finance-entry-card{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 90%, var(--tab-point-highlight) 10%);
   }
   body.page-finance .finance-entry-grid{
     display:grid;
     grid-template-columns:1fr;
     gap:12px;
   }
   body.page-finance .finance-entry-grid .field{
     min-width:0;
   }
   @media (min-width:731px){
     body.page-finance .finance-entry-grid{
       grid-template-columns:repeat(2, minmax(0, 1fr));
     }
     body.page-finance .finance-entry-grid .finance-span-2{
       grid-column:span 2;
     }
   }
   body.page-finance .finance-panel.card .finance-entry-remove{
     margin-top:12px;
     min-height:48px;
    }
   body.page-finance .finance-entry-actions{
     display:flex;
     justify-content:flex-end;
     margin-top:12px;
   }
   body.app-dark-mode.page-finance #financeSubmitDoc{
     background:var(--app-point-highlight);
     border:1px solid var(--app-point-soft);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.page-finance #financeSubmitDoc:hover,
   body.app-dark-mode.page-finance #financeSubmitDoc:focus-visible{
     background:color-mix(in srgb, var(--app-point-highlight) 86%, var(--app-point-soft) 14%);
     border-color:var(--app-point-soft);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.page-finance #financeSubmitDoc:active{
     background:color-mix(in srgb, var(--app-point-highlight) 74%, var(--app-point-soft) 26%);
     border-color:var(--app-point-soft);
     color:var(--app-dark-text);
   }
   body.page-finance .finance-write-actions{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     align-items:center;
     justify-content:flex-end;
   }
   body.page-finance .finance-write-actions .finance-toolbar-btn,
   body.page-finance .finance-write-actions .finance-btn-add-row{
     width:auto;
     flex:0 0 auto;
   }
   body.page-finance .finance-receipt-status,
   body.page-finance .finance-receipt-preview,
   body.page-finance .finance-receipt-preview-card,
   body.page-finance .finance-receipt-preview-image,
   body.page-finance .finance-receipt-preview-remove,
   body.page-finance .finance-receipt-preview-remove svg{
     transition:all .3s ease;
   }
   body.page-finance .finance-receipt-status{
     margin:0;
     color:var(--muted);
     font-size:.95rem;
   }
   body.page-finance .finance-receipt-preview{
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   body.page-finance .finance-receipt-preview-title{
     color:var(--ink);
   }
   body.page-finance .finance-receipt-preview-grid{
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   body.page-finance .finance-receipt-preview-card{
     display:flex;
     flex-direction:column;
     gap:14px;
     min-width:0;
   }
   body.page-finance .finance-receipt-preview-head{
     display:flex;
     align-items:center;
     justify-content:flex-end;
     gap:12px;
   }
   body.page-finance .finance-receipt-preview-remove{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     width:36px;
     height:36px;
     padding:0;
     margin:0;
     flex:0 0 auto;
     border:0;
     border-radius:999px;
     background:transparent;
     color:color-mix(in srgb, var(--ink) 58%, transparent);
     opacity:.5;
     cursor:pointer;
   }
   body.page-finance .finance-receipt-preview-remove svg{
     width:18px;
     height:18px;
   }
   body.page-finance .finance-receipt-preview-remove:hover,
   body.page-finance .finance-receipt-preview-remove:focus-visible{
     opacity:1;
     color:var(--tab-point);
     background:color-mix(in srgb, var(--tab-point-highlight) 72%, transparent);
   }
   body.page-finance .finance-receipt-preview-image{
     width:100%;
     max-height:min(42vh, 360px);
     object-fit:contain;
     border-radius:12px;
     border:0;
     background:transparent;
     }
   body.page-finance .finance-receipt-preview-meta{
     margin:0;
     color:var(--muted);
      font-size:.95rem;
      line-height:1.5;
    }
   @media (max-width:730px){
     body.page-finance .finance-write-actions{
       flex-direction:column;
       align-items:stretch;
       justify-content:stretch;
     }
      body.page-finance .finance-write-actions .btn-primary,
      body.page-finance .finance-write-actions .finance-btn-add-row{
       width:100%;
     }
     body.page-finance .finance-entry-actions{
       justify-content:stretch;
     }
     body.page-finance .finance-entry-remove{
       width:100%;
     }
     body.page-finance .finance-receipt-preview-image{
       max-height:min(34vh, 260px);
     }
     body.page-finance .finance-period-fields-row{
       grid-template-columns:1fr;
     }
     body.page-finance .finance-period-fields-row .memo-index-apply-btn{
       width:100%;
     }
   }
   body.page-finance .finance-doc-detail{
     margin-top:16px;
     display:flex;
     flex-direction:column;
     gap:16px;
   }
   body.page-finance .finance-doc-detail-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
   }
   body.page-finance .finance-doc-detail-meta{
     display:grid;
     grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
     gap:10px;
   }
   body.page-finance #financeApprovalDetail .finance-doc-detail-meta{
     grid-template-columns:repeat(3, minmax(0, 1fr));
   }
   body.page-finance .finance-doc-detail-chip{
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     border-radius:var(--radius);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     padding:12px 14px;
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   body.page-finance .finance-doc-detail-chip strong{
     color:var(--muted);
     font-size:.8125rem;
   }
   body.page-finance .finance-doc-detail-approver-line{
     display:flex;
     align-items:baseline;
     gap:6px;
     flex-wrap:nowrap;
     min-width:0;
   }
   body.page-finance .finance-doc-detail-approver-line strong{
     flex:0 0 auto;
     white-space:nowrap;
   }
   body.page-finance .finance-doc-detail-approver-name{
     display:block;
     min-width:0;
     color:inherit;
     font-size:1rem;
     font-weight:700;
     line-height:1.45;
     white-space:nowrap;
   }
   body.page-finance .finance-doc-detail-chip span{
     display:flex;
     flex-direction:column;
     gap:4px;
   }
   body.page-finance .finance-doc-detail-chip em{
     font-style:normal;
     color:var(--muted);
     font-size:.8125rem;
   }
   body.page-finance.finance-toast-open{
     overflow:hidden;
   }
   body.page-finance .finance-toast-backdrop{
     position:fixed;
     inset:0;
     background:rgba(15,23,42,.52);
     backdrop-filter:blur(3px);
     z-index:1200;
    }
   body.page-finance .finance-toast{
     position:fixed;
      left:50%;
      top:50%;
     transform:translate(-50%, -50%);
     min-width:min(320px, calc(100vw - 32px));
     max-width:min(420px, calc(100vw - 32px));
     padding:16px 18px;
     border-radius:var(--radius);
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     box-shadow:var(--shadow-lg);
      text-align:center;
      font-weight:700;
      z-index:1210;
      pointer-events:none;
    }
   body.page-finance .finance-toast::before{
     content:"";
     position:absolute;
     inset:0;
     border-radius:inherit;
     border:1px solid color-mix(in srgb, var(--tab-point-soft) 20%, transparent);
     pointer-events:none;
   }
   body.page-finance .finance-toast[data-state="success"]{
     color:var(--app-point, var(--tab-point));
   }
   body.page-finance .finance-toast[data-state="error"]{
     color:var(--memo-indicator-ink);
   }
   body.page-finance .finance-doc-detail-table th:nth-child(3),
   body.page-finance .finance-doc-detail-table td:nth-child(3){
     width:34%;
   }
   body.page-finance .finance-doc-detail-table{
     min-width:760px;
   }
   body.page-finance .finance-doc-detail-table th,
   body.page-finance .finance-doc-detail-table td{
     white-space:nowrap;
     word-break:keep-all;
   }
   body.page-finance .finance-doc-detail-table th:nth-child(4),
   body.page-finance .finance-doc-detail-table td:nth-child(4){
     width:16%;
     min-width:120px;
   }
   body.page-finance .finance-doc-detail-table th:nth-child(3),
   body.page-finance .finance-doc-detail-table td:nth-child(3){
     white-space:normal;
   }
   body.page-finance .finance-doc-detail-table th:nth-child(5),
   body.page-finance .finance-doc-detail-table td:nth-child(5){
     min-width:90px;
   }
   body.page-finance .finance-doc-detail-files{
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   body.page-finance .finance-approval-actions{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     align-items:center;
   }
   body.page-finance #financeApprovalDetailDocNo{
     color:var(--muted);
     font-size:.95em;
     font-weight:700;
   }
   body.page-finance .finance-reject-panel{
     position:fixed;
     inset:0;
     z-index:1220;
     display:flex;
     align-items:center;
     justify-content:center;
     padding:24px;
     background:rgba(15,23,42,.68);
     backdrop-filter:blur(4px);
   }
   body.page-finance .finance-reject-dialog{
     width:min(520px, calc(100vw - 32px));
     display:flex;
     flex-direction:column;
     gap:12px;
     padding:20px;
     box-shadow:var(--shadow-lg);
   }
   .popup-dialog-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     min-height:36px;
     padding-right:48px;
   }
   .popup-dialog-title{
     margin:0;
   }
   .popup-dialog-actions{
     display:flex;
     gap:10px;
     flex-wrap:wrap;
   }
   body.page-finance .finance-complete-panel{
     display:grid;
     grid-template-columns:minmax(0, 1fr) auto;
     gap:12px;
     align-items:end;
     padding:16px 18px;
   }
   body.page-finance .finance-download-actions{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     align-items:center;
   }
   body.page-finance .finance-download-actions a.finance-toolbar-btn{
     text-decoration:none;
   }
   body.page-finance .finance-download-actions .finance-toolbar-btn.is-disabled,
   body.page-finance .finance-download-actions .finance-toolbar-btn[aria-disabled="true"]{
     opacity:0.55;
     pointer-events:none;
     cursor:not-allowed;
     text-decoration:none;
   }
   body.page-finance .finance-weekly-admin-result{
     margin-top:16px;
     padding:16px 18px;
   }
   body.page-finance .finance-weekly-admin-list{
     margin:0;
     padding-left:18px;
   }
   body.page-finance .finance-weekly-admin-list-error{
     color:#9f2d2d;
   }
   body.page-finance .finance-reject-panel .finance-error{
     margin:0;
   }
   body.page-finance .finance-doc-detail-entry-list{
     display:none;
   }
   body.page-finance .finance-doc-entry-card{
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     border-radius:var(--radius);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     padding:14px;
   }
   body.page-finance .finance-doc-entry-card-grid{
     display:grid;
     grid-template-columns:1fr 1fr;
     gap:10px 14px;
   }
   body.page-finance .finance-doc-entry-card-grid div{
     display:flex;
     flex-direction:column;
     gap:4px;
   }
   body.page-finance .finance-doc-entry-card-grid strong{
     color:var(--muted);
     font-size:.8125rem;
   }
   body.page-finance .finance-doc-detail-files-title{
     margin:0;
     font-weight:700;
   }
   body.page-finance .finance-doc-detail-files-list{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
   }
   body.page-finance .finance-doc-file-link{
     text-decoration:none;
   }
   body.app-dark-mode.page-finance .finance-doc-detail-chip{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
   }
   body.app-dark-mode.page-finance .finance-reject-panel{
     background:rgba(2,6,23,.76);
   }
   body.app-dark-mode.page-finance .finance-reject-dialog{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
   }
   body.app-dark-mode.page-finance .finance-doc-card,
   body.app-dark-mode.page-finance .finance-doc-entry-card{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
   }
   body.app-dark-mode.page-finance .finance-summary-card{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
   }
   body.app-dark-mode.page-finance .finance-toast{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
     color:var(--app-dark-text);
   }
   body.page-finance.finance-busy-open{
     overflow:hidden;
   }
   body.page-finance .finance-busy-backdrop{
     position:fixed;
     inset:0;
     background:rgba(15,23,42,.62);
     backdrop-filter:blur(4px);
     z-index:1230;
   }
   body.page-finance .finance-busy-toast{
     position:fixed;
     left:50%;
     top:50%;
     transform:translate(-50%, -50%);
     min-width:min(320px, calc(100vw - 32px));
     max-width:min(420px, calc(100vw - 32px));
     padding:18px 20px;
     border-radius:var(--radius);
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     box-shadow:var(--shadow-lg);
     text-align:center;
     font-weight:700;
     z-index:1240;
   }
   body.app-dark-mode.page-finance .finance-busy-toast{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
     color:var(--app-dark-text);
   }
   body.admin-page.admin-toast-open,
   body.admin-page.admin-busy-open{
     overflow:hidden;
   }
   body.admin-page .admin-toast-backdrop,
   body.admin-page .admin-busy-backdrop{
     position:fixed;
     inset:0;
     background:rgba(15,23,42,.52);
     backdrop-filter:blur(3px);
     z-index:1200;
   }
   body.admin-page .admin-busy-backdrop{
     background:rgba(15,23,42,.62);
     backdrop-filter:blur(4px);
     z-index:1230;
   }
   body.app-confirm-open{
     overflow:hidden;
   }
   .app-confirm-modal{
     position:fixed;
     inset:0;
     z-index:2400;
     display:grid;
     place-items:center;
     padding:20px;
   }
   .app-confirm-modal[hidden]{
     display:none;
   }
   .app-confirm-backdrop{
     position:absolute;
     inset:0;
     background:rgba(15,23,42,.52);
     backdrop-filter:blur(4px);
     -webkit-backdrop-filter:blur(4px);
   }
   .app-confirm-dialog{
     position:relative;
     z-index:1;
     width:min(100%, 420px);
     padding:22px 22px 18px;
     border-radius:18px;
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     box-shadow:var(--shadow-lg);
   }
   .app-confirm-head{
     margin-bottom:10px;
   }
   .app-confirm-title{
     margin:0;
     color:var(--app-point, var(--nav));
   }
   .app-confirm-message{
     margin:0;
     color:color-mix(in srgb, var(--ink) 82%, transparent);
     font-size:15px;
     line-height:1.6;
   }
   .app-confirm-actions{
     display:flex;
     justify-content:flex-end;
     gap:10px;
     margin-top:18px;
   }
   .app-confirm-actions .btn-primary,
   .app-confirm-actions .btn-secondary{
     min-width:84px;
   }
   body.app-dark-mode .app-confirm-dialog{
     border-color:color-mix(in srgb, var(--app-dark-border) 82%, var(--tab-point-soft) 18%);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .app-confirm-message{
     color:color-mix(in srgb, var(--reader-text, #e2e8f0) 88%, transparent);
   }
   @media (max-width:640px){
     .app-confirm-modal{
       padding:16px;
     }
     .app-confirm-dialog{
       width:min(100%, 360px);
       padding:18px 18px 16px;
     }
     .app-confirm-actions{
       flex-direction:column-reverse;
     }
     .app-confirm-actions .btn-primary,
     .app-confirm-actions .btn-secondary{
       width:100%;
     }
   }
   body.admin-page .admin-toast,
   body.admin-page .admin-busy-toast{
     position:fixed;
     left:50%;
     top:50%;
     transform:translate(-50%, -50%);
     min-width:min(320px, calc(100vw - 32px));
     max-width:min(420px, calc(100vw - 32px));
     padding:18px 20px;
     border-radius:var(--radius);
     border:1px solid color-mix(in srgb, var(--line) 82%, var(--tab-point-highlight) 18%);
     background:color-mix(in srgb, var(--surface-bg) 94%, var(--tab-point-highlight) 6%);
     box-shadow:var(--shadow-lg);
     text-align:center;
     font-weight:700;
   }
   body.admin-page .admin-toast{
     z-index:1210;
     pointer-events:none;
   }
   body.admin-page .admin-busy-toast{
     z-index:1240;
   }
   body.admin-page .admin-toast::before{
     content:"";
     position:absolute;
     inset:0;
     border-radius:inherit;
     border:1px solid color-mix(in srgb, var(--tab-point-soft) 20%, transparent);
     pointer-events:none;
   }
   body.admin-page .admin-toast[data-state="success"]{
     color:var(--app-point, var(--tab-point));
   }
   body.admin-page .admin-toast[data-state="error"]{
     color:var(--memo-indicator-ink);
   }
   body.app-dark-mode.admin-page .admin-toast,
   body.app-dark-mode.admin-page .admin-busy-toast{
     border-color:var(--app-dark-border);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--tab-point-highlight) 12%);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.page-finance .finance-doc-badge{
     background:color-mix(in srgb, var(--tab-point-highlight) 30%, var(--app-dark-surface) 70%);
     color:var(--app-point-soft);
   }
   @media (max-width:730px){
     body.page-finance #financeDocsTableWrap{
       display:none;
     }
     body.page-finance .finance-docs-cards{
       display:grid;
       grid-template-columns:minmax(0, 1fr);
       gap:12px;
     }
     body.page-finance #financeApprovalCards,
     body.page-finance #financeCompletedCards,
     body.page-finance #financeClosedCards{
       display:none !important;
     }
     body.page-finance .finance-docs-cards > .finance-doc-detail{
       grid-column:1 / -1;
     }
     body.page-finance .finance-complete-panel{
       grid-template-columns:1fr;
     }
    }
   @media (max-width:768px){
     body.page-dream .dream-tab-shell{
       gap:16px;
     }
   }
   @media (max-width:480px){
     body.page-finance .finance-doc-detail-meta{
       grid-template-columns:1fr;
     }
     body.page-finance #financeApprovalDetail .finance-doc-detail-meta{
       grid-template-columns:1fr;
     }
     body.page-finance .finance-doc-detail .finance-table-wrap{
       display:none;
     }
     body.page-finance .finance-doc-detail-entry-list{
       display:flex;
       flex-direction:column;
       gap:12px;
     }
     body.page-finance .finance-doc-entry-card-grid{
       grid-template-columns:1fr;
     }
   }
   @media (max-width:730px){
     body.page-finance .finance-doc-detail .finance-table-wrap{
       display:none;
     }
     body.page-finance .finance-doc-detail-entry-list{
       display:flex;
       flex-direction:column;
       gap:12px;
     }
   }
   body.page-finance .finance-panel.card > p{
     color:var(--muted);
     line-height:1.55;
   }

   .tab-reader-tools{
     flex:0 0 auto;
     display:grid;
     grid-template-columns:auto minmax(128px, 220px) auto;
     align-items:center;
     gap:6px;
   }
   .tab-font-control{
     display:flex;
     align-items:center;
     gap:6px;
     width:min(220px, 30vw);
     border:none;
     border-bottom:none;
   }

/* 통합 폰트 설정 래퍼 (아이콘 + 펼쳐지는 패널) */
.font-control-wrapper{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.font-trigger-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  min-width:32px;
  min-height:32px;
  padding:0;
  border-radius:50%;
  border:none;
  background:transparent;
  color:var(--reader-text, var(--ink, var(--muted)));
  cursor:pointer;
  flex:0 0 auto;
  transition:color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.font-trigger-btn:hover,
.font-trigger-btn:focus-visible{
  background:color-mix(in srgb, var(--tab-point-highlight) 24%, transparent);
  color:var(--tab-point);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 14%, transparent);
}
.font-trigger-icon{
  width:16px;
  height:16px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}

/* 통합 패널: 폰트 선택 + 크기 슬라이더 */
.font-expanded-panel{
  position:absolute;
  top:50%;
  left:calc(100% + 10px);
  display:flex;
  align-items:center;
  gap:8px;
  width:min(560px, calc(100vw - 88px));
  max-width:min(560px, calc(100vw - 88px));
  min-height:48px;
  background:var(--reader-card-bg, #ffffff);
  color:var(--reader-text, #222222);
  padding:8px 12px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 78%, transparent);
  box-shadow:0 10px 24px rgba(15,23,42,0.12);
  overflow:hidden;
  max-width:0;
  opacity:0;
  transform:translate3d(12px, -50%, 0);
  pointer-events:none;
  transition:max-width .28s ease-out, opacity .24s ease-out, transform .28s ease-out;
  z-index:20;
}
.font-expanded-panel.active{
  max-width:min(560px, calc(100vw - 88px));
  opacity:1;
  transform:translate3d(0, -50%, 0);
  pointer-events:auto;
}
.font-expanded-panel .reader-font-select{
  min-width:116px;
}
.font-control-divider{
  width:1px;
  height:18px;
  background-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 60%, transparent);
}

.hidden{
  display:none;
}
.tab-panel{
  display:none;
  width:100%;
  box-sizing:border-box;
}
.tab-panel[hidden]{
  display:none !important;
}
.tab-panel.active{
  display:flex;
  flex-direction:column;
  gap:24px;
  width:100%;
     align-items:stretch;
   }
   .tab-panel.active > *{
     width:100%;
     flex:0 0 100%;
     box-sizing:border-box;
   }
   .tab-panel .card{
     width:100%;
     max-width:100%;
     box-sizing:border-box;
   }
   @media (max-width:768px){
     body.page-bible .tab-toolbar{
       flex-direction:column;
       align-items:stretch;
       flex-wrap:wrap;
       overflow:hidden;
       min-width:0;
       gap:8px;
     }
     body.page-bible .tab-toolbar .tab-list{
       width:100%;
       min-width:0;
       flex:0 0 auto;
     }
     body.page-bible .tab-reader-tools{
       width:100%;
       min-width:0;
       max-width:100%;
       display:flex;
       flex-wrap:wrap;
       justify-content:flex-start;
       gap:6px;
       overflow:hidden;
     }
     body.page-bible .tab-reader-tools .reader-font-select,
     body.page-bible .tab-reader-tools .tab-font-control{
       min-width:0;
     }
     body.page-bible .tab{
       font-size:14px;
       padding:8px 10px;
     }
   }
   @media (max-width:1200px){
     .tab-toolbar{
       flex-wrap:wrap;
       align-items:flex-end;
     }
     .tab-toolbar .tab-list{
       width:100%;
       flex:1 1 100%;
     }
     .tab-reader-tools{
       width:100%;
       grid-template-columns:auto minmax(130px, 1fr) auto;
       justify-content:flex-end;
     }
   }
   @media (max-width:640px){
     .tab{
       padding:9px 8px;
       font-size:15px;
     }
     .tab-reader-tools{
       grid-template-columns:auto minmax(120px, 1fr) auto;
       justify-content:stretch;
       gap:6px;
     }
     .tab-font-control{
       width:100%;
       gap:6px;
     }
   }
   @media (max-width:480px){
     .tab-reader-tools{
       gap:4px;
     }
     .tab-font-control{
       width:100%;
       gap:4px;
     }
     .tab-reader-select{
       min-width:84px;
       padding:0 8px;
       font-size:12px;
     }
     #fontSizeControl{
       min-width:64px;
     }
     .font-size-icon-lg{
       display:none;
     }
   }
   
   /* iPhone SE 등 소형 화면에서 성경 폰트/슬라이더 행 가로 스크롤 방지 */
   @media (max-width:414px){
     body.page-bible .tab-toolbar{
       flex-wrap:wrap;
       overflow:hidden;
       min-width:0;
     }
     body.page-bible .tab-toolbar .tab-list{
       min-width:0;
       overflow-x:auto;
       overflow-y:hidden;
       flex-wrap:nowrap;
     }
     body.page-bible .tab{
       font-size:14px;
       padding:8px 10px;
       white-space:nowrap;
       flex:0 0 auto;
     }
     body.page-bible .tab-reader-tools{
       width:100%;
       min-width:0;
       flex-wrap:wrap;
       justify-content:flex-start;
       row-gap:4px;
       overflow:hidden;
     }
     body.page-bible .reader-font-select{
       min-width:0;
       flex:1 1 40%;
       max-width:100%;
     }
     body.page-bible .tab-font-control{
       min-width:0;
       width:100%;
       max-width:100%;
     }
     body.page-bible #fontSizeControl{
       min-width:0;
     }
     body.page-bible .reader-my-memos-btn{
       flex:0 0 auto;
     }
   }
   
   /* =========================
      Bible Reader
      ========================= */
   .bible-reader{ display:flex; flex-direction:column; gap:20px; }
   .bible-reader,
   .search-card{
     width:100%;
     box-sizing:border-box;
   }
   /* 성경 페이지: 스크롤은 문서(html) 한 곳만. 카드/본문 내부 스크롤 제거 */
   body.page-bible .tab-container{
     flex:0 1 auto;
     min-height:0;
     height:auto !important;
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   /* 성경읽기 탭 패널·카드·본문 전부 block+visible로 해서 내부 스크롤 제거 */
   body.page-bible #tab-reader.tab-panel.active{
     display:block !important;
     min-height:0;
     height:auto !important;
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   body.page-bible #tab-reader > #bibleReader,
   body.page-bible #tab-reader > .card.bible-reader{
     display:block !important;
     min-height:0;
     height:auto !important;
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   body.page-bible #bibleReader > .reader-controls,
   body.page-bible #bibleReader > .reader-status,
   body.page-bible #bibleReader > .reader-meta,
   body.page-bible #bibleReader > #readerContent,
   body.page-bible #bibleReader > .bible-reader-compare,
   body.page-bible #bibleReader > .reader-nav{
     margin-bottom:20px;
   }
   body.page-bible #bibleReader > .reader-nav:last-child{
     margin-bottom:0;
   }
   body.page-bible #tab-reader,
   body.page-bible #tab-reader > #bibleReader,
   body.page-bible #bibleReader,
   body.page-bible .card.bible-reader,
   body.page-bible #readerContent,
   body.page-bible .bible-reader-content,
   body.page-bible #readerCompare,
   body.page-bible #comparePairs{
     max-height:none !important;
     overflow:visible !important;
     overflow-y:visible !important;
   }
   body.page-bible #readerContent,
   body.page-bible .bible-reader-content{
     min-height:0;
     flex:none;
   }
   /*
   .reader-controls{
     display:flex;
     flex-direction:column;
     gap:14px;
   }
   */
   .reader-controls {
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 100%;
   }
   
   .reader-controls .select-controls {
     display:flex;
     flex-wrap:nowrap;
     gap:14px;
     width:100%;
   }
   
   .field{
     display:flex;
     flex-direction:column;
     gap:6px;
     min-width:100px;
     width:auto;
   }
   
   .field-label{
     font-size:13px;
     font-weight:700;
     color:#4a6c89;
   }
   
   .field select,
   .field input,
   .field textarea{
     border:1px solid var(--line);
     border-radius:10px;
     padding:10px 12px;
     font-size:15px;
     font-family:var(--font);
     background:#fff;
     color:var(--ink);
     width:100%;
     min-width:0;
   }

   .field input[type="file"]{
     padding:8px 10px;
     line-height:1.4;
     cursor:pointer;
   }

   .field input[type="file"]::file-selector-button{
     margin-right:10px;
     border:1px solid var(--ui-surface-border, #cbd5e1);
     border-radius:var(--radius-pill);
     padding:8px 14px;
     background:var(--ui-surface-bg, #ffffff);
     color:var(--ink);
     font:inherit;
     font-weight:700;
     cursor:pointer;
     transition:
       background-color 0.18s ease,
       border-color 0.18s ease,
       color 0.18s ease,
       box-shadow 0.18s ease;
   }

   .field input[type="file"]::file-selector-button:hover,
   .field input[type="file"]::file-selector-button:focus-visible{
     background:var(--ui-hover-bg, #f4f8fb);
     border-color:var(--app-point-soft, #d1a054);
     color:var(--app-point, var(--nav));
   }
   
   .field textarea{
     min-height:120px;
     resize:vertical;
     line-height:1.6;
   }
   
   input::-webkit-contacts-auto-fill-button,
   input::-webkit-credentials-auto-fill-button{
     visibility:hidden;
     display:none !important;
     pointer-events:none;
     position:absolute;
     right:0;
   }
   input[type="search"]::-webkit-search-decoration,
   input[type="search"]::-webkit-search-cancel-button,
   input[type="search"]::-webkit-search-results-button,
   input[type="search"]::-webkit-search-results-decoration{
     -webkit-appearance:none;
     appearance:none;
     display:none;
   }
   
   .select-controls .field{
     flex:1;
     min-width:0;
   }
   .field-chapter-row{
     display:flex;
     align-items:stretch;
     gap:8px;
   }
   .field-chapter-row select{
     flex:1 1 auto;
     min-width:0;
   }
   
   .font-control-field{
     width:100%;
   }
   .field-inline .font-control{
     display:flex;
     align-items:center;
     gap:10px;
   }
   .reader-controls .field-inline{
     flex: 1 1 auto;
     display:flex;
     flex-direction:row;
     align-items:center;
     gap:12px;
     min-width:0;
   }
   .reader-controls .field-inline .field-label{
     margin:0;
     flex:0 0 auto;
     white-space:nowrap;
   }
   .reader-controls .field-inline .font-control{
     flex:1 1 auto;
     min-width:0;
   }
   
   /* ===== Bible Reader: Compare + Font Size Left-aligned ===== */
   /* 두 번째 줄: 대조역본 보기 / 글자 크기 */
   .reader-controls-row {
     display: flex;
     flex-direction: row;
     align-items: flex-end;     /* ✅ 아래 라인 기준으로 맞추기 */
     justify-content: flex-start; /* ✅ 왼쪽 정렬 */
     gap: 16px;
     margin-top: 8px;
     width: 100%;
     box-sizing: border-box;
     padding-left: 4px;
   }
   
   /* 왼쪽: 대조역본 보기 */
   .compare-wrap {
     display: inline-flex;
     align-items: baseline;   /* ✅ 텍스트 기준선 정렬 */
     gap: 6px;
     white-space: nowrap;
     color: #0f3e66;
     font-weight: 600;
   }
   .compare-wrap input[type="checkbox"] {
     width: 18px;
     height: 18px;
     accent-color: var(--nav, #0f3e66);
     cursor: pointer;
     margin: 0;
     transform: translateY(2px); /* ✅ 살짝 아래로 보정 */
   }
   
   /* 오른쪽: 글자 크기 */
   .font-wrap {
     display: inline-flex;
     align-items: baseline; /* ✅ 라벨과 슬라이더 높이 맞춤 */
     gap: 8px;
     color: #0f3e66;
     font-weight: 600;
   }
   .font-wrap label {
     font-size: 14px;
   }
   .font-control {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     width: 160px;
   }
   #fontSizeControl {
     flex: 1;
     cursor: pointer;
   }
   #fontSizeValue {
     font-size: 14px;
     font-weight: 600;
     white-space: nowrap;
   }
   
   /* 반응형: 모바일일 때 약간 더 붙여줌 */
   @media (max-width: 520px) {
     .reader-controls-row {
       flex-wrap: wrap;
       gap: 10px;
       margin-top: 6px;
     }
     .font-wrap {
       margin-left: 6px;
     }
   }
   
   /* compare-toggle styles */
   
   .compare-toggle{
     display:flex;
     align-items:center;
     gap:8px;
     padding:0;
     border:0;
     background:none;
     width:auto;
     flex: 0 0 auto;
     white-space: nowrap;
     min-width:0;
   }
   
   .compare-toggle input[type="checkbox"]{
     width:18px;
     height:18px;
     accent-color:var(--app-point-soft);
     cursor:pointer;
   }
   
   .compare-toggle span{
     font-size:14px;
     font-weight:600;
     color:#0f3e66;
     cursor:pointer;
   }
   
   .font-control-field{
     flex: 1 1 auto;
     min-width:0;
   }
   
   .bible-reader.compare-active .bible-reader-content{ display:none; }
   .bible-reader.compare-active .reader-status{ display:none; }
   body.page-bible #tab-related .related-reader.compare-active .related-reader-content{ display:none; }
   body.page-bible #tab-related .related-reader.compare-active #relatedStatus{ display:none; }
   
   .bible-reader-compare{
     display:none;
     max-height:none;
     overflow:visible;
     padding:0;
   }
   
   .bible-reader-compare.active{
     display:block;
   }
   
   .compare-head{
     display:flex;
     gap:0;
     align-items:center;
     justify-content:stretch;
     margin-bottom:0;
     padding:10px 8px;
     background:#e0e7f3;
     /* border-bottom:1px solid #dde6ef; */
     border:1px solid #dde6ef;
     border-radius:12px 12px 0 0;
     position:sticky;
     top:0;
     z-index:12;
   }
   .bible-reader-compare .compare-head {
     padding: 4px 8px;
     height: 36px;
   }
   
   @media (max-width:619px){
     .compare-head{
       display:none;
     }
   }
   
   .compare-label{
     /*
     font-weight:800;
     font-size:16px;
     */
     color:#0f3e66;
     text-align:center;
     padding:6px 0;
     flex:1;
     border-right:1px solid #dde6ef;
   }
   .bible-reader-compare .compare-label {
     font-size: 16px;
     font-weight: 600;
   }
   
   .compare-label:last-child{
     border-right:none;
   }
   
   .compare-pairs{
     display:block;
     padding:0;
     border:1px solid #dde6ef;
     border-top:none;
     border-radius:0 0 12px 12px;
     background:#f9fbff;
   }
   
   .compare-chapter-title{
     font-weight:800;
     font-size:1.1em;
     color:#0f3e66;
     padding:12px 8px;
     margin-bottom:4px;
     background:#f0f5fa;
     border-bottom:2px solid rgba(15,62,102,0.15);
   }
   
   .compare-titles{
     background:#f9fbff !important;
     border-bottom:2px solid #dde6ef !important;
   }
   
   .compare-titles .pair-side{
     /*padding:10px 8px;*/
     padding:1px 8px;
     border-right:1px solid #dde6ef;
   }
   
   .compare-titles .pair-side:last-child{
     border-right:none;
   }
   .compare-heading-row{
     background:#f9fbff;
     border-bottom:1px solid #dde6ef;
   }
   .compare-heading-side{
     padding:6px 8px;
   }
   .compare-heading-empty{
     padding:6px 8px;
     min-height:18px;
   }
   .compare-notes{
     background:#f9fbff;
     border-bottom:1px dashed rgba(15,62,102,0.08);
   }
   .pair-notes-side{
     padding:8px;
   }
   .pair-notes-side .chapter-note-strip{
     margin:0;
   }
   
   .verse-title-text{
     /*
     font-weight:800;
     font-size:1em;
     color:#0f3e66;
     */
     font-weight:600;
     color:#1d4b68;
     display:block;
   }
   /* Title small parentheses style */
   .verse-title-text .alt-title{
     font-size:0.85em;
     font-weight:600;
     color: #557188;
     margin-left:6px;
   }
   
   /* Hide title on narrow screens to save space */
   @media (max-width:619px){
     .compare-chapter-title{
       display:none;
     }
     .compare-titles{
       display:none;
     }
   }
   
   /* Wide screens (>=620px): side-by-side per verse */
   @media (min-width:620px){
     .compare-pair{
       display:grid;
       grid-template-columns: 1fr 1fr;
       gap:0;
       align-items:start;
       padding:6px 8px;   /* top/bottom , left/right*/
       background:transparent;
       border-bottom:1px dashed rgba(15,62,102,0.04);
     }
   
     .compare-pair:last-child{
       border-bottom:none;
     }
   
     .pair-side{
       display:flex;
       gap:10px;
       align-items:flex-start;
       padding:0 8px;
       border-right:1px solid #dde6ef;
     }
   
     .pair-side:last-child{
       border-right:none;
     }
   
     .pair-side .verse-number{
       min-width:36px;
       font-weight:800;
       color:#0f3e66;
     }
   
     .pair-side .verse-text{
       flex:1;
     }
   
     .pair-side.is-highlight{
       background-color: #fff4d6;
       border-radius: 4px;
       box-shadow: 0 2px 8px rgba(255, 186, 73, 0.2);
     }
   }
   
   /* Narrow screens (<620px): stack vertically */
   @media (max-width:619px){
     .compare-titles{
       display:none;
     }
   
     .compare-pair{
       display:flex;
       flex-direction:column;
       gap:0;
       align-items:stretch;
       padding:4px 8px;   /* top/bottom , left/right*/
       background:transparent;
       border-bottom:1px dashed rgba(15,62,102,0.04);
     }
   
     .compare-pair:last-child{
       border-bottom:none;
     }
   
     .pair-side{
       display:flex;
       gap:10px;
       align-items:flex-start;
       padding:10px 8px;
       border-bottom:1px dashed rgba(15,62,102,0.04);
       border-right:none;
       min-width:0;
     }
   
     /* Swap backgrounds: first-child becomes "comparison" color, last-child becomes "selected" color */
     .pair-side:first-child{
       /* previously selected background, now swapped */
       background:#f5f8fb;
       border-left:4px solid #0f3e66; /* left vertical line: selected color */
     }
   
     .pair-side:last-child{
       border-bottom:none;
       background:#fafbfc;
       border-left:4px solid #7a9fb5; /* left vertical line: comparison color */
     }
   
     /* Hide verse-number visually for comparison side but keep spacing so text aligns */
     .pair-side:last-child .verse-number{
       visibility:hidden; /* preserves layout */
     }
   
     .pair-side .verse-number{
       min-width:36px;
       font-weight:800;
       color:#0f3e66;
     }
   
     .pair-side .verse-text{
       flex:1;
     }
   
     .pair-side.is-highlight{
       background-color: #fff4d6;
       border-radius: 4px;
       box-shadow: 0 2px 8px rgba(255, 186, 73, 0.2);
     }
   }
   
   .font-control input[type="range"]{
     width:160px;
     accent-color:var(--nav);
   }
   .reader-controls .field-inline .font-control input[type="range"]{
     width:clamp(100px, 30vw, 200px);
   }
   .font-size-display{
     font-size:13px;
     font-weight:700;
     color:#0f3e66;
     min-width:44px;
     text-align:right;
   }
   
   /* Narrow screen: adjust font control width */
   @media (max-width: 600px) {
     .reader-controls .field-inline .font-control input[type="range"]{
       width: clamp(80px, 25vw, 150px);
     }
   }
   
   .reader-status{
     font-size:14px;
     font-weight:600;
     color:#4a6c89;
   }
   .reader-status.is-hidden{ display:none; }
   .bible-reader-content{
     display:flex;
     flex-direction:column;
     gap:12px;
     background:#f9fbff;
     border:1px solid #dde6ef;
     border-radius:14px;
     padding:20px;
     max-height:none;
     overflow:visible;
   }
   
   /* 관련성경 탭에서는 별도 카드 안에 그려지므로, 중첩 테두리를 제거한다. */
   body.page-bible #tab-related .bible-reader-content{
     border:none;
     background:transparent;
     padding:0;
   }
   .chapter-header{
     margin-bottom:6px;
     padding-bottom:10px;
     border-bottom:1px solid rgba(15,62,102,0.1);
   }
   .chapter-title-main{
     margin:0;
     font-weight:800;
     font-size:20px;
     color:#0f3e66;
   }
   .chapter-subtitle{
     margin:6px 0 0;
     font-weight:600;
     color:#1d4b68;
   }
   .chapter-note-strip{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
     margin:8px 0 0;
   }
   .chapter-note-strip .note-inline{
     display:inline-flex;
     align-items:center;
     margin:0;
   }
   .chapter-note-strip .note-trigger-visual{
     margin:0 4px 0 0;
     transform:none;
   }
   .chapter-note-strip .note-popover{
     min-width:180px;
   }
   .verse-line{
     display:flex;
     gap:12px;
     line-height:var(--reader-line-height, 1.7);
     font-size:var(--reader-font-size, 16px);
     color:#123248;
     border-bottom:none;
     align-items:flex-start;
     position:relative;
   }
   .verse-line.is-highlight{
     background:#fff4d6;
     border-radius:10px;
     padding:6px 10px;
     box-shadow:0 6px 18px rgba(255, 186, 73, 0.25);
   }
   .verse-line.has-memo{
     padding-left:0;
   }
   .verse-line.has-memo::before{
     content:"";
     position:absolute;
     left:-10px;
     top:5px;
     bottom:5px;
     width:3px;
     border-radius:999px;
     background:var(--memo-verse-gutter);
   }
   .verse-line.has-memo.is-highlight{
     padding-left:0;
   }
   .verse-line.has-memo:hover{
     background:#f8fafc;
     border-radius:10px;
   }
   .verse-line.has-memo.is-highlight:hover{
     background:#fff4d6;
   }
   .verse-number{
     flex:none;
     min-width:32px;
     font-weight:800;
     color:#0f3e66;
     font-size:calc(var(--reader-font-size, 16px) * 0.9);
   }
   .verse-number-btn{
     appearance:none;
     border:none;
     background:transparent;
     cursor:pointer;
     display:inline-flex;
     align-items:flex-start;
     justify-content:flex-end;
     text-align:right;
     padding:0 4px 0 0;
     margin:0;
     line-height:inherit;
     position:relative;
     touch-action:manipulation;
   }
   .verse-number-btn::after{
     content:"";
     position:absolute;
     inset:-8px -6px -8px -10px;
   }
   .verse-number-btn:hover,
   .verse-number-btn:focus-visible{
     color:#0b2f4e;
   }
   .verse-number-btn:focus-visible{
     outline:2px solid var(--app-point-soft);
     outline-offset:3px;
     border-radius:6px;
   }
   .verse-text{ flex:1; word-break:keep-all; white-space:pre-line; }
   .chapter-memo-btn{
     --memo-btn-size:34px;
     appearance:none;
     border:none;
     background:transparent;
     color:#64748b;
     border-radius:999px;
     width:var(--memo-btn-size);
     height:var(--memo-btn-size);
     padding:0;
     cursor:pointer;
     line-height:1;
     position:relative;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     transition:background .18s ease, color .18s ease, transform .16s ease;
   }
   .chapter-memo-btn:hover,
   .chapter-memo-btn:focus-visible{
     background:#e9eef5;
     color:#334155;
   }
   .chapter-memo-btn:focus-visible{
     outline:2px solid var(--app-point-soft);
     outline-offset:2px;
   }
   .chapter-memo-btn:active{
     transform:scale(0.96);
   }
   .chapter-memo-icon{
     width:20px;
     height:20px;
     stroke:currentColor;
     fill:none;
     stroke-width:1.9;
     stroke-linecap:round;
     stroke-linejoin:round;
   }
   .chapter-memo-btn.has-memo{
     color:#5b6777;
   }
   .chapter-memo-btn.has-memo::after{
     content:"";
     position:absolute;
     top:1px;
     right:-1px;
     width:6px;
     height:6px;
     border-radius:999px;
     background:var(--memo-indicator);
     border:2px solid #fff;
     box-sizing:content-box;
   }
   .verse-line.is-multiline .verse-text,
   .pair-side.is-multiline .verse-text{
     padding-left:6px;
     border-left:2px solid rgba(15,62,102,0.12);
   }
   .verse-title{
     display:block;
     font-weight:700;
     font-size:0.95em;
     color:#0f3e66;
     margin-bottom:6px;
   }
   .reader-nav{
     display:flex;
     justify-content:space-between;
     gap:12px;
     flex-wrap:nowrap;
   }
   .reader-nav .btn-pill{ flex:1; }
   .btn-pill{
     border:1.5px solid var(--line);
     background:var(--surface-bg);
     color:var(--nav);
     border-radius:var(--radius-pill);
     padding:10px 20px;
     font-weight:700;
     font-size:15px;
     cursor:pointer;
     transition:background .18s, transform .18s;
   }
   .btn-pill:disabled{
     background:var(--accent-bg);
     border-color:var(--line);
     color:#94a3b8;
     cursor:not-allowed;
     box-shadow:none;
   }
   .btn-pill:not(:disabled):hover{
     background:var(--nav);
     color:var(--surface-bg);
     border-color:var(--nav);
     box-shadow:0 4px 12px rgba(15,62,102,0.18);
   }
   .btn-pill:not(:disabled):active{ transform:translateY(1px); }
   
   .memo-modal{
     position:fixed;
     top:var(--sticky-header-offset, 56px);
     right:0;
     bottom:0;
     left:0;
     z-index:2200;
     background:rgba(10,26,44,0.4);
     display:flex;
     align-items:center;
     justify-content:center;
     padding:16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
     overflow:hidden;
   }
   .memo-modal-panel{
     width:min(560px, calc(100vw - 48px));
     position:relative;
     max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 32px - env(safe-area-inset-bottom, 0px));
     background:var(--surface-bg);
     border:1px solid var(--line);
     border-radius:14px;
     box-shadow:0 22px 45px rgba(8,24,42,0.28);
     padding:16px 14px 14px;
     display:flex;
     flex-direction:column;
     gap:8px;
     overflow:auto;
     -webkit-overflow-scrolling:touch;
   }
   
   @media (max-height:520px){
     .memo-modal-panel{
       max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 24px - env(safe-area-inset-bottom, 0px));
     }
   }
   .memo-modal-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:10px;
     min-height:52px;
     padding-right:80px;
   }
   .memo-modal-title{
     margin:0;
     font-size:17px;
     font-weight:800;
     color:var(--ink);
   }
   .memo-modal-meta{
     margin:0;
     font-size:12px;
     color:#94a3b8;
   }
   .btn-popup-close{
     position:absolute;
     top:10px;
     right:10px;
     width:36px;
     height:36px;
     display:flex;
     align-items:center;
     justify-content:center;
     background:var(--surface-bg);
     border:1px solid var(--line);
     border-radius:8px;
     color:var(--ink);
     font-size:20px;
     line-height:1;
     cursor:pointer;
     z-index:100;
     padding:0;
   }
   .memo-modal-input{
     width:100%;
     min-height:180px;
     border:1px solid #cfdeec;
     border-radius:10px;
     padding:12px;
     font-size:15px;
     line-height:1.6;
     color:#15314a;
     resize:vertical;
   }
   .memo-modal-input:focus{
     outline:none;
     border-color:#89adcf;
     box-shadow:0 0 0 3px rgba(137,173,207,0.2);
   }
   .memo-modal-actions{
     display:flex;
     justify-content:flex-end;
     align-items:center;
     gap:8px;
   }
   .memo-modal-actions .btn-primary,
   .memo-modal-actions .btn-secondary{
     min-width:72px;
     height:36px;
     padding:0 14px;
     border-radius:10px;
     font-size:13px;
   }
   .memo-modal-delete{
     border-color:#f2c9ce;
     color:#a73a46;
   }
   .memo-modal-delete:hover,
   .memo-modal-delete:focus-visible{
     border-color:#e6a8b0;
     background:#fff5f6;
   }
   
   .memo-index-modal{
     position:fixed;
     top:var(--sticky-header-offset, 56px);
     right:0;
     bottom:0;
     left:0;
     z-index:2200;
     background:rgba(10,26,44,0.42);
     display:flex;
     align-items:center;
     justify-content:center;
     padding:16px 16px calc(16px + env(safe-area-inset-bottom, 0px));
     overflow:hidden;
   }
   .memo-index-panel{
     width:min(450px, calc(100vw - 48px));
     max-width:450px;
     margin-left:auto;
     margin-right:auto;
     position:relative;
     max-height:min(760px, calc(100dvh - var(--sticky-header-offset, 56px) - 32px - env(safe-area-inset-bottom, 0px)));
     background:#fff;
     border:1px solid #dbe7f3;
     border-radius:14px;
     box-shadow:0 24px 48px rgba(8,24,42,0.28);
     padding:14px 20px;
     display:flex;
     flex-direction:column;
     gap:12px;
     overflow-y:auto;
     -webkit-overflow-scrolling:touch;
     scrollbar-width:thin;
     scrollbar-color:#cbd5e1 transparent;
   }
   .memo-index-panel::-webkit-scrollbar{
     width:8px;
   }
   .memo-index-panel::-webkit-scrollbar-track{
     background:transparent;
   }
   .memo-index-panel::-webkit-scrollbar-thumb{
     background:#cbd5e1;
     border-radius:999px;
   }
   .memo-index-panel::-webkit-scrollbar-thumb:hover{
     background:#94a3b8;
   }
   
   @media (min-width:640px){
     .memo-index-panel{
       max-width:520px;
     }
     .memo-index-filter-actions{
       margin-right:0;
       flex-wrap:nowrap;
     }
   }
   
   @media (max-height:520px){
     .memo-index-panel{
       max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 24px - env(safe-area-inset-bottom, 0px));
     }
   }
   
   @media (max-height:480px){
     .memo-index-panel{
       max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 24px - env(safe-area-inset-bottom, 0px));
     }
   }
   .memo-index-head,
   .memo-index-footer{
     flex-shrink:0;
   }
   .memo-index-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     margin-bottom:24px;
   }
   .memo-index-head .btn-popup-close{
     position:static !important;
     top:auto !important;
     right:auto !important;
     flex-shrink:0;
   }
   .memo-index-title{
     margin:0;
     flex:1;
     min-width:0;
     font-size:17px;
     font-weight:800;
     color:#153a58;
   }
   .memo-index-filters{
     display:flex;
     flex-direction:column;
     gap:12px;
   }
   .memo-index-filter-actions{
     display:flex;
     flex-wrap:wrap;
     gap:12px;
     align-items:center;
     margin-right:24px;
   }
   .memo-index-range-display{
     margin:0;
     min-height:18px;
     padding-top:8px;
     padding-bottom:8px;
     font-size:13px;
     color:#4a6c89;
   }
   .memo-index-query-row{
     display:grid;
     grid-template-columns:1fr 1fr;
     gap:8px;
     align-items:center;
   }
   .memo-index-query-row .memo-index-select,
   .memo-index-query-row .memo-index-search{
     grid-column:1 / -1;
     width:100%;
     box-sizing:border-box;
   }
   .memo-index-select,
   .memo-index-recent,
   .memo-index-search{
     height:36px;
     border:1px solid #cfdeec;
     border-radius:10px;
     padding:0 10px;
     font-size:14px;
     color:#17344b;
   }
   .memo-index-filters .btn-primary,
   .memo-index-filters .btn-secondary{
     height:36px;
     min-width:72px;
     border-radius:10px;
     font-size:13px;
     padding:0 12px;
   }
   .memo-index-query-row .btn-primary,
   .memo-index-query-row .btn-secondary{
     width:100%;
     min-width:0;
   }
   .memo-index-status{
     margin:0;
     font-size:13px;
     font-weight:600;
     color:#4a6c89;
   }
   .memo-index-list{
     list-style:none;
     margin:0;
     padding:0;
     flex:none;
     min-height:120px;
     overflow-y:visible;
     border:1px solid #e4ebf3;
     border-radius:12px;
   }
   .memo-index-empty{
     margin:0;
     padding:20px 14px;
     color:#547089;
     text-align:center;
     font-weight:600;
   }
   .memo-index-item{
     width:100%;
     border:none;
     border-bottom:1px solid rgba(241, 245, 249, 0.5);
     background:#fff;
     text-align:left;
     padding:12px 14px;
     cursor:pointer;
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   .memo-index-item-row{
     display:grid;
     grid-template-columns:minmax(0, 1fr) auto;
     align-items:stretch;
     gap:8px;
   }
   .memo-index-list li:last-child .memo-index-item{
     border-bottom:none;
   }
   .memo-index-item:hover,
   .memo-index-item:focus-visible{
     background:#f9fafb;
   }
   .memo-index-item:focus-visible{
     outline:2px solid rgba(23,52,75,0.28);
     outline-offset:-2px;
   }
   .memo-index-ref{
     font-size:14px;
     font-weight:800;
     color:#143a59;
   }
   .memo-index-preview{
     margin:0;
     font-size:14px;
     line-height:1.55;
     color:#294862;
   }
   .memo-index-updated{
     font-size:11px;
     color:#94a3b8;
     line-height:1.4;
   }
   .memo-index-created{
     font-size:11px;
     color:#94a3b8;
     line-height:1.4;
   }
   .memo-index-meta{
     display:flex;
     flex-wrap:wrap;
     gap:10px;
   }
   .memo-index-footer{
     display:flex;
     justify-content:flex-end;
     align-items:center;
     gap:8px;
     flex-wrap:wrap;
    }
   .memo-index-more{
     min-width:96px;
   }
   .memo-index-clear-all{
     min-width:132px;
   }
   .memo-index-delete{
     align-self:center;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     width:36px;
     min-width:36px;
     height:36px;
     border:none;
     border-radius:999px;
     background:transparent;
     color:#b42318;
     cursor:pointer;
     transition:background .18s ease, color .18s ease, opacity .18s ease;
     opacity:.72;
   }
   .memo-index-delete:hover,
   .memo-index-delete:focus-visible{
     background:rgba(254, 226, 226, 0.72);
     color:#991b1b;
     opacity:1;
   }
   .memo-index-delete:focus-visible{
     outline:2px solid rgba(185, 28, 28, 0.22);
     outline-offset:2px;
   }
   .memo-index-delete svg{
     width:16px;
     height:16px;
     pointer-events:none;
   }
   .memo-index-list{
     scrollbar-width:thin;
     scrollbar-color:#cbd5e1 transparent;
   }
   .memo-index-list::-webkit-scrollbar{
     width:8px;
   }
   .memo-index-list::-webkit-scrollbar-track{
     background:transparent;
   }
   .memo-index-list::-webkit-scrollbar-thumb{
     background:#cbd5e1;
     border-radius:999px;
   }
   .memo-index-list::-webkit-scrollbar-thumb:hover{
     background:#94a3b8;
   }
   
   @media (max-width:480px){
     .memo-index-filter-actions{
       display:grid;
       grid-template-columns:1fr 1fr;
       gap:8px;
       margin-right:0;
     }
     body.page-bible .history-filter-actions{
       display:grid !important;
       grid-template-columns:1fr 1fr !important;
       gap:8px !important;
     }
   }
   
   @media (max-width:640px){
     .memo-index-panel{
       max-height:88vh;
       padding:12px 20px;
     }
     .memo-index-filters .btn-primary,
     .memo-index-filters .btn-secondary{
       height:34px;
     }
   }
   
   .verse-text .note-inline{
     color:#204f8c;
     font-weight:500;
   }
   .note-inline{
     position:relative;
     display:inline-block;
   }
   .note-trigger-visual{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     width:18px;
     height:18px;
     min-width:16px;
     border:1px solid rgba(220,38,38,0.9);
     border-radius:4px;
     background:linear-gradient(145deg, #fff5f5 0%, #ffe4e4 100%);
     color:#b91c1c;
     font-weight:700;
     padding:0;
     margin:0 6px 0 4px;
     transform:translateY(3px);
     cursor:pointer;
     box-shadow:0 2px 6px rgba(190,18,60,0.2);
     transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
     vertical-align:baseline;
   }
   .note-trigger-visual:hover{
     background:linear-gradient(145deg, #ffecec 0%, #ffd3d3 100%);
     color:#991b1b;
     transform:translateY(-1px);
     box-shadow:0 4px 10px rgba(190,18,60,0.28);
   }
   .note-inline.open .note-trigger-visual{
     background:linear-gradient(145deg, #fee2e2 0%, #fca5a5 100%);
     color:#7f1d1d;
     box-shadow:0 5px 12px rgba(190,18,60,0.32);
   }
   .note-trigger-visual:focus-visible{
     outline:2px solid rgba(248,113,113,0.85);
     outline-offset:1px;
   }
   .note-superscript{
     font-size:0.68em;
     vertical-align:super;
     line-height:0;
   }
   .note-popover{
     position:absolute;
     top:calc(100% + 14px);
     left:50%;
     transform:translate(calc(-50% + var(--note-popover-shift, 0px)), 0);
     min-width:200px;
     max-width:min(280px, calc(100vw - 48px));
     background:#ffffff;
     border:1px solid #d6e4f5;
     border-radius:12px;
     padding:16px 18px;
     font-size:13px;
     color:#1f3d55;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.1);
     opacity:0;
     visibility:hidden;
     z-index:40;
     transition:opacity .18s, transform .18s, visibility .18s;
   }
   .note-popover-text{
     margin:0;
     line-height:1.6;
     word-break:keep-all;
   }
   .note-popover::before{
     content:"";
     position:absolute;
     top:-12px;
     left:var(--note-popover-arrow, 50%);
     transform:translateX(-50%);
     border-width:0 10px 12px 10px;
     border-style:solid;
     border-color:transparent transparent #ffffff transparent;
     filter:drop-shadow(0 -2px 2px rgba(15,62,102,0.08));
   }
   .note-inline.open .note-popover{
     opacity:1;
     visibility:visible;
     transform:translate(calc(-50% + var(--note-popover-shift, 0px)), 0);
   }
   .note-inline.open .note-popover[data-align="start"]{
     left:0;
     right:auto;
     transform:translate(var(--note-popover-shift, 0px), 0);
   }
   .note-inline.open .note-popover[data-align="end"]{
     left:auto;
     right:0;
     transform:translate(var(--note-popover-shift, 0px), 0);
   }
   
   .note-context-inline .note-context-trigger,
   .note-context-trigger{
     background:none;
     color:#0f3e66;
     border-radius:0;
     padding:0;
     font-family:inherit;
     font-size:1em;
     font-weight:700;
     line-height:inherit;
     display:inline;
     text-align:left;
     white-space:normal;
     vertical-align:baseline;
     box-shadow:none;
     border:none;
     text-decoration:underline;
     text-decoration-style:solid;
     text-decoration-thickness:1px;
     text-underline-offset:2px;
     text-decoration-skip-ink:none;
   }
   .note-context-inline .note-context-trigger:hover,
   .note-context-inline .note-context-trigger:focus-visible,
   .note-context-trigger:hover,
   .note-context-trigger:focus-visible{
     background:none;
     color:#0a2f4b;
     transform:none;
     box-shadow:none;
     outline:none;
   }
   .note-context-inline.open .note-context-trigger{
     color:#0a2f4b;
   }
   .note-context-inline .note-context-trigger:focus-visible,
   .note-context-trigger:focus-visible{
     outline:2px solid rgba(15,62,102,0.55);
     outline-offset:2px;
   }
   .note-context-trigger{
     cursor:pointer;
   }
  .context-note-popover{
     background:var(--surface-bg, #ffffff);
     color:#1f3d55;
     border:1px solid #dbe5ef;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.1);
     width:min(92vw, 450px);
     max-width:min(500px, 100vw);
     min-width:260px;
    border-radius:10px;
    padding:1.25rem;
     display:flex;
     flex-direction:column;
     box-sizing:border-box;
     overflow:hidden;
   }
   .context-note-popover::before{
     border-color:transparent transparent var(--surface-bg, #ffffff) transparent;
     filter:drop-shadow(0 -2px 2px rgba(15,62,102,0.08));
   }
   .context-note-popover-header{
     display:flex;
     flex-direction:row;
     align-items:center;
     justify-content:space-between;
     gap:10px;
     min-height:44px;
     margin:0 0 .9rem;
     padding-bottom:.9rem;
     border-bottom:1px solid color-mix(in srgb, currentColor 10%, transparent);
     flex-shrink:0;
     flex-wrap:nowrap;
   }
   .context-note-popover-title{
     margin:0;
     font-size:1.5rem;
     font-weight:700;
     color:inherit;
     letter-spacing:0.02em;
     line-height:1.25;
     flex:1 1 auto;
     min-width:0;
   }
   .context-note-popover-content{
     flex:1 1 auto;
     overflow:hidden;
     min-height:0;
   }
   .context-note-popover-content > * + *{
     margin-top:1rem;
   }
   .context-note-popover-bottom{
     flex-shrink:0;
     margin-top:1rem;
     padding:1rem;
     background:rgba(255, 255, 255, 0.05);
     border-radius:12px;
     box-sizing:border-box;
   }
   body.page-bible .context-note-popover-bottom{
     background:color-mix(in srgb, currentColor 6%, transparent);
   }
   .context-note-head{
     display:flex;
     align-items:center;
     gap:10px;
     margin:0 0 10px;
     padding-bottom:8px;
     border-bottom:1px solid #e6edf7;
   }
   .context-note-clicked{
     margin:0;
     font-size:24px;
     font-weight:700;
     color:#1f3d55;
     letter-spacing:0.02em;
     line-height:1.25;
   }
   .context-note-badge{
     display:inline-flex;
     align-items:center;
     padding:2px 8px;
     background:#eef4fb;
     color:#0f3e66;
     border:1px solid #d3e2f2;
     border-radius:999px;
     font-size:12px;
     font-weight:700;
     letter-spacing:0.01em;
   }
   .context-note-marker{
     font-size:13px;
     color:#3f6786;
     letter-spacing:0.02em;
     font-weight:700;
   }
   .note-popover-example,
   .context-note-popover .note-popover-example{
     margin:6px 0 0;
     color:#415b70;
     font-style:italic;
   }
   .context-note-refs{
     margin-top:0;
     border-top:none;
     padding-top:0;
   }
   .context-note-synonyms{
    margin-top:1.1rem;
    border-top:none;
    padding-top:0;
   }
   .context-note-synonyms-title{
     margin:0 0 7px;
     font-size:1em;
     font-weight:700;
     color:inherit;
     letter-spacing:0;
     border-bottom:none;
   }
  .context-note-synonyms-list{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:flex-start;
  }
  .context-note-synonym-chip{
    display:inline-flex;
    align-items:center;
    padding:4px 12px;
    border-radius:16px;
    border:none;
    background:#f0f0f0;
    color:#333333;
    font-size:0.85rem;
    font-weight:500;
    box-shadow:none;
  }
  body.page-bible .context-note-synonyms .synonym-chip{
    display:inline-block;
    background:#f0f0f0 !important;
    border-radius:16px !important;
    padding:4px 12px !important;
    margin:4px !important;
    font-size:0.85rem !important;
    border:none !important;
    color:#333333 !important;
  }
   .context-note-refs-title{
     margin:0 0 7px;
     font-size:12px;
     font-weight:700;
     color:#4b6377;
     letter-spacing:0.02em;
     border-bottom:none;
   }
   .context-note-ref-view-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
    min-height:44px;
     min-width:48px;
    padding:0 20px;
    margin-top:16px;
    border:1px solid var(--tab-point-soft);
    border-radius:999px;
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
    color:var(--tab-point, var(--nav));
    font-size:14px;
    font-weight:700;
     cursor:pointer;
     transition:background .15s ease, border-color .15s ease, color .15s ease;
   }
   .context-note-ref-view-btn:hover,
   .context-note-ref-view-btn:focus-visible{
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%);
    border-color:var(--tab-point-soft);
   }
   .context-note-refs-list{
     display:flex;
     flex-direction:column;
     gap:14px;
     margin:0;
     padding:0;
   }
   .context-note-ref-link{
     display:block;
     width:100%;
     text-align:left;
     cursor:pointer;
     color:#27445c;
     background:transparent;
     border:1px solid #dde6ef;
     border-radius:8px;
     padding:12px 14px;
     min-height:48px;
     box-sizing:border-box;
     font-size:13px;
     text-decoration:none;
     transition:background .15s ease, border-color .15s ease, color .15s ease;
   }
   .context-note-ref-link:hover,
   .context-note-ref-link:focus-visible{
     background:#f5f9fd;
   }
  .context-note-more-btn{
    margin-top:8px;
    padding:6px 16px;
    border-radius:999px;
    border:1px solid color-mix(in srgb, var(--tab-point-soft, #d2e0ef) 80%, transparent);
    background:var(--surface-bg, #ffffff);
    color:var(--tab-point, #245379);
    font-size:12px;
    font-weight:700;
    cursor:pointer;
    box-sizing:border-box;
  }
   .context-note-more-btn:hover,
   .context-note-more-btn:focus-visible{
     background:#eef4fb;
     border-color:#bcd1e6;
   }
   
   .related-card{
     display:flex;
     flex-direction:column;
     gap:14px;
   }
  .related-head{
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  .related-title{
    margin:0;
    font-size:20px;
    color:#0f3e66;
    display:inline-block;
  }
  .related-description{
    --term-desc-lead-color:#2b4156;
    --term-desc-label-bg:rgba(15, 62, 102, 0.08);
    --term-desc-label-text:#1f4f78;
    margin:0;
    padding:16px 0 20px;  /* padding:12px 0 16px; */
    font-size:14px;
    line-height:1.65;
    color:#3e4f60;
    font-family:var(--reader-content-font, inherit);
    width:100%;
    display:block;
    white-space:normal;
  }
  .related-description > *{
    margin:0;
  }
  .related-description .term-desc-lead,
  .related-description .term-desc-body,
  .related-description .term-desc-section-body{
    margin:0;
    white-space:pre-line;
    overflow-wrap:anywhere;
  }
  .related-description .term-desc-lead{
    color:var(--term-desc-lead-color);
    font-weight:600;
    letter-spacing:-0.01em;
  }
  .related-description .term-desc-body,
  .related-description .term-desc-section-body{
    line-height:1.65;
  }
  .related-description .term-desc-section{
    display:block;
    width:100%;
  }
  .related-description .term-desc-lead + .term-desc-section{
    margin-top:6px;
  }
  .related-description .term-desc-body + .term-desc-section{
    margin-top:8px;
  }
  .related-description .term-desc-section + .term-desc-section{
    margin-top:6px;
  }
  .related-description .term-desc-section-label{
    display:block;
    margin:0 0 1px;
    padding:0;
    border:none;
    border-radius:0;
    background:none;
    color:#143f63;
    font-size:1em;
    font-weight:800;
    letter-spacing:0;
    line-height:inherit;
  }
  .related-description .term-desc-section-label::after{
    content:none;
  }
  .related-description .term-desc-section-body{
    display:block;
    margin:0;
  }
  .related-subtitle{
    margin:0;
    font-size:13px;
    color:#5b6f82;
  }
   .related-subtitle strong{
     color:#1c415f;
     font-weight:800;
   }
   .related-layout{
     display:grid;
     grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
     gap:14px;
   }
   .related-list-wrap{
     border:1px solid #e4ebf3;
     border-radius:12px;
     background:#fbfdff;
     padding:10px;
   }
   .related-filters{
     display:flex;
     gap:6px;
     margin-bottom:8px;
     flex-wrap:wrap;
   }
   .related-filter{
     border:1px solid #d3e0ed;
     background:#fff;
     color:#4a6c89;
     border-radius:999px;
     padding:4px 10px;
     font-size:12px;
     font-weight:700;
     cursor:pointer;
   }
   .related-filter.active{
     background:#eef4fb;
     border-color:#bfd5e8;
     color:#0f3e66;
   }
   .related-list{
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   .related-empty-message{
     width:100%;
     padding:var(--space-md, 24px) var(--space-sm, 16px);
     text-align:center;
     font-size:15px;
     line-height:1.5;
     color:var(--muted, #5b6f82);
   }
   body.page-bible #tab-related .related-card.has-no-refs .related-list-wrap{
     grid-column:1 / -1;
     max-width:100%;
   }
   body.page-bible #tab-related .related-card.has-no-refs .related-layout{
     grid-template-columns:minmax(0, 1fr);
   }
   body.page-bible #tab-related .related-card.has-no-refs .related-empty-message{
     margin:0 auto;
     max-width:360px;
   }
   body.page-bible #tab-related .related-reader[hidden]{
     display:none !important;
   }
   .related-card.has-no-refs .related-reader,
   .related-card.has-no-refs .related-reader-nav{
     display:none !important;
   }
   .related-empty{
     margin:0;
     color:#6b7280;
     font-size:13px;
   }
   .related-ref-item{
     width:100%;
     text-align:left;
     border:1px solid var(--accent-border);
     border-radius:10px;
     background:var(--surface-bg);
     color:var(--ink);
     padding:8px 10px;
     font-size:13px;
     cursor:pointer;
   }
   .related-ref-item:hover,
   .related-ref-item:focus-visible{
     background:var(--accent-bg);
     border-color:var(--accent-border);
     color:var(--nav);
   }
   .related-ref-item.active{
     background:var(--accent-bg);
     border-color:var(--accent-border);
     color:var(--nav);
     font-weight:700;
   }
   .related-reader{
     min-width:0;
     display:flex;
     flex-direction:column;
     background:var(--reader-card-bg, var(--surface-bg));
     border-radius:12px;
     border:1px solid var(--reader-card-border, var(--line));
   }
   .related-reader-nav{
     margin-top:12px;
   }
   .related-current{
     margin:0 0 6px;
     font-size:15px;
     font-weight:700;
     color:#335a77;
     line-height:1.45;
   }
   @media (max-width: 768px){
     .related-layout{
       grid-template-columns: 1fr;
     }
   }
   
   .context-term{
     position:relative;
     display:inline-flex;
     align-items:center;
   }
   .context-trigger{
     border:none;
     background:linear-gradient(120deg, #ecf7ff 0%, #e1f3ff 100%);
     color:#0f3e66;
     font-weight:600;
     padding:2px 6px;
     border-radius:10px;
     box-shadow:0 2px 6px rgba(12,74,110,0.18);
     cursor:pointer;
     line-height:1.2;
     text-decoration:none;
     transition:transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
   }
   .context-trigger:hover,
   .context-trigger:focus-visible{
     background:linear-gradient(120deg, #d8edff 0%, #c7e6ff 100%);
     color:#0b3657;
     transform:translateY(-1px);
     box-shadow:0 4px 10px rgba(12,74,110,0.24);
     outline:none;
   }
   .context-trigger:focus-visible{
     outline:2px solid rgba(59,130,246,0.7);
     outline-offset:2px;
   }
   .context-term.open .context-trigger{
     background:linear-gradient(120deg, #cfe6ff 0%, #b7dbff 100%);
     box-shadow:0 6px 16px rgba(12,74,110,0.28);
   }
   .context-popover{
     position:absolute;
     top:calc(100% + 12px);
     left:50%;
     transform:translate(calc(-50% + var(--note-popover-shift, 0px)), 0);
     min-width:220px;
     max-width:min(360px, calc(100vw - 40px));
     background:#ffffff;
     border:1px solid #cfe3ff;
     border-radius:12px;
     padding:20px 24px;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.1);
     font-size:13px;
     color:#0f172a;
     opacity:0;
     visibility:hidden;
     z-index:45;
     transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
   }
   .context-popover::before{
     content:"";
     position:absolute;
     top:-10px;
     left:var(--note-popover-arrow, 50%);
     transform:translateX(-50%);
     border-width:0 10px 10px 10px;
     border-style:solid;
     border-color:transparent transparent #ffffff transparent;
     filter:drop-shadow(0 -2px 2px rgba(12,74,110,0.06));
   }
   .context-term.open .context-popover{
     opacity:1;
     visibility:visible;
     transform:translate(calc(-50% + var(--note-popover-shift, 0px)), 2px);
   }
   body.page-bible.popover-open::before{
     content:"";
     position:fixed;
     inset:0;
     background:rgba(0,0,0,0.2);
     backdrop-filter:blur(4px);
     -webkit-backdrop-filter:blur(4px);
     pointer-events:none;
     z-index:30;
   }
   body.page-bible.popover-open{
     overflow:hidden;
   }
   html.popover-open{
     overflow:hidden;
   }
  @media (max-width:768px){
     body.page-bible.memo-dialog-open{
       overflow:hidden;
       -webkit-overflow-scrolling:auto;
     }
     html.memo-dialog-open{
       overflow:hidden;
     }
     body.page-bible.popover-open{
       overflow:auto;
       -webkit-overflow-scrolling:touch;
     }
     html.popover-open{
       overflow:auto;
     }
   }
  .note-popover[data-mobile-sheet="true"],
  .context-popover[data-mobile-sheet="true"]{
     width:auto;
     max-width:none !important;
     border-radius:16px 16px 12px 12px;
     max-height:min(78svh, calc(100dvh - 24px));
     overflow:auto;
     overscroll-behavior:contain;
     padding-bottom:calc(16px + env(safe-area-inset-bottom, 0px));
   }
   .note-popover[data-mobile-sheet="true"]::before,
   .context-popover[data-mobile-sheet="true"]::before{
     display:none;
   }
   .context-popover-head{
     display:flex;
     align-items:center;
     gap:8px;
     margin-bottom:14px;
   }
   .context-popover-head strong{
     font-size:24px;
     font-weight:700;
     color:#0f3e66;
     line-height:1.25;
   }
   .context-popover-tags{
     display:flex;
     flex-wrap:wrap;
     gap:4px;
   }
   .context-popover-tag{
     display:inline-flex;
     align-items:center;
     padding:2px 6px;
     background:#e8f2ff;
     color:#0b3657;
     border-radius:8px;
     font-size:11px;
     line-height:1.2;
   }
   .context-popover-desc{
     margin:0 0 6px;
     line-height:1.5;
   }
   .context-popover-example{
     margin:0;
     color:#1e293b;
     font-style:italic;
   }
   @media (max-width:640px){
     .bible-reader-content{
       max-height:none;
       overflow:visible;
     }
     .bible-reader-compare{
       max-height:none;
       overflow:visible;
     }
     .verse-line{
       padding-bottom:12px;
       border-bottom:none;
       align-items:flex-start;
     }
     .verse-number{ font-size:14px; min-width:28px; }
     .verse-number-btn{
       min-width:28px;
       font-size:14px;
     }
     .verse-number-btn::after{
       inset:-10px -8px -10px -12px;
     }
     .chapter-memo-btn{
       --memo-btn-size:30px;
     }
     .chapter-memo-icon{
       width:18px;
       height:18px;
     }
     .reader-nav{ flex-wrap:nowrap; gap:8px; }
     .reader-nav .btn-pill{ flex:1; }
     .font-control input[type="range"]{ width:100%; }
   }
   
   @media (min-width:768px){
     .note-popover-text{
       overflow-wrap:anywhere;
     }
   }
   
   /* =========================
      Search (Tab 2)
      ========================= */
   .search-card{
     display:flex;
     flex-direction:column;
     gap:22px;
     width:100%;
     max-width:var(--content-max-w);
     box-sizing:border-box;
     align-self:stretch;
   }
   .search-form,
   .search-status,
   .search-section,
   .search-results{
     width:100%;
     box-sizing:border-box;
   }
   .search-form{ display:flex; flex-direction:column; gap:18px; }
   .search-form > .field{ width:100%; }
   .search-book-help{
     margin:0;
     padding:0;
     border:1px solid var(--reader-card-border);
     border-radius:var(--radius);
     background:var(--reader-panel-bg);
     color:var(--reader-text);
   }
   .search-book-help-summary{
     cursor:pointer;
     list-style:none;
     padding:12px 14px;
     font-weight:600;
     color:var(--reader-text);
   }
   .search-book-help-summary::-webkit-details-marker{ display:none; }
   .search-book-help-body{
     padding:0 14px 14px;
     font-size:0.92em;
     line-height:1.55;
     border-top:1px solid var(--reader-card-border);
   }
   .search-book-help-body ul{
     margin:8px 0 0;
     padding-left:1.2em;
   }
   .search-book-help-body code{
     font-size:0.9em;
     background:color-mix(in srgb, var(--reader-card-bg) 70%, var(--tab-point-soft) 30%);
     padding:1px 6px;
     border-radius:4px;
   }
   .search-autocomplete{
     margin-top:6px;
     position:relative;
     z-index:10;
   }
   .search-autocomplete-list{
     margin:0;
     padding:6px 0;
     list-style:none;
     border:1px solid var(--reader-card-border);
     border-radius:var(--radius);
     background:var(--reader-panel-bg, var(--surface-bg));
     box-shadow:var(--shadow-md);
     max-height:260px;
     overflow:auto;
     font-size:13px;
   }
   .search-autocomplete-item{
     display:flex;
     justify-content:space-between;
     align-items:center;
     gap:8px;
     padding:6px 12px;
     cursor:pointer;
   }
   .search-autocomplete-item:hover,
   .search-autocomplete-item:focus-visible{
     background:color-mix(in srgb, var(--reader-card-bg) 70%, var(--tab-point-highlight) 30%);
   }
   .search-autocomplete-name{
     font-weight:600;
     color:var(--reader-text);
   }
   .search-autocomplete-meta{
     font-size:12px;
     color:var(--label-color);
     white-space:nowrap;
   }
  /* Dark mode: keep secondary text legible on reader dark surfaces */
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .search-autocomplete-meta{
    color:var(--reader-muted);
  }
   .search-grid{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:16px;
     align-items:flex-end;
   }
   .advanced-grid{
     margin-top:10px;
   }
   .search-grid .field{
     width:100%;
   }
   .search-grid .field:nth-child(odd){ justify-self:stretch; }
   .search-grid .field:nth-child(even){ justify-self:stretch; }
   .search-grid .field{ min-width:0; }
   /* 입력 컨트롤이 칸 안에서 넘치지 않도록 */
   .search-grid select,
   .search-grid input[type="number"],
   .search-grid input[type="text"]{
     width:100%;
     min-width:0;
     box-sizing:border-box;
   }
   
   .search-range-grid{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:14px;
     align-items:stretch;
   }
   .range-field{
     display:flex;
     flex-direction:column;
     gap:10px;
     padding:12px 14px;
     background:#f7fbff;
     border:1px solid #dfe9ff;
     border-radius:12px;
     box-shadow:inset 0 0 0 1px rgba(255,255,255,0.7);
   }
   .range-field-head{
     display:flex;
     justify-content:space-between;
     align-items:center;
     gap:12px;
   }
   .range-checkbox{
     display:inline-flex;
     align-items:center;
     gap:6px;
     font-size:14px;
     color:#334155;
   }
   .range-checkbox input[type="checkbox"]{
     width:16px;
     height:16px;
     margin:0;
     accent-color:#2563eb;
   }
   .range-control{
     display:flex;
     align-items:center;
     gap:12px;
   }
   .range-control input[type="range"]{
     flex:1 1 auto;
   }
   .range-field.is-disabled{
     opacity:0.65;
   }
   .range-field.is-disabled input[type="range"]{
     pointer-events:none;
   }
   .range-value{
     min-width:52px;
     font-weight:700;
     color:#0a2540;
     text-align:right;
   }
   .advanced-toggle{
     display:flex;
     justify-content:flex-start;
   }
   .advanced-toggle button{
     display:inline-flex;
     align-items:center;
     gap:8px;
     padding:8px 14px;
     border-radius:10px;
     border:1px solid #cdd7e6;
     background:#fff;
     color:#0a2540;
     font-weight:700;
     cursor:pointer;
     transition:background .2s, border-color .2s;
   }
   .advanced-toggle button:hover{
     background:#f2f6ff;
     border-color:#b6c6e5;
   }
   .advanced-options{
     padding:12px 14px 6px;
     border:1px solid #dfe5ef;
     border-radius:12px;
     background:#fbfcfe;
     box-shadow:inset 0 0 0 1px rgba(255,255,255,0.8);
   }
   
   /* 두 칸 전체를 써야 하는 요소 */
   .field-checkbox,
   .search-actions{
     grid-column:1 / -1;
   }
   
   
   @media (max-width:640px){
     .search-grid{
       grid-template-columns:1fr;
     }
     .search-range-grid{
       grid-template-columns:1fr;
     }
   }
   .field-caption{
     font-size:13px;
     color:#4a6c89;
     margin-top:6px;
     line-height:1.5;
   }
   .field-caption strong{
     color:#0a2540;
   }
   .caption-term{
     color:#0b63ce;
     font-weight:600;
   }
   .field-warning{
     margin:-6px 0 10px;
     padding:9px 12px;
     border-radius:8px;
     background:#fff7f7;
     color:#dc2626;
     font-size:13px;
     font-weight:600;
     border:1px solid rgba(248,113,113,0.35);
   }
   .chat-submit{
     align-self:flex-start;
     margin-top:4px;
   }
   
   .field-checkbox{
     grid-column: 1 / -1;
     display: grid;
     grid-template-columns: auto 1fr;
     /* align-items: start; */
     align-items: center;
     column-gap: 8px;
     width: 100%;
     padding: 6px 10px;
     border: 1px solid #d5e2ff;
     border-radius: 8px;
     background: #f5f8ff;
     box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
     white-space: normal;
     word-break: keep-all;
     overflow-wrap: break-word;
   }
   
   .field-checkbox input[type="checkbox"]{
     width: 18px;
     height: 18px;
     min-width: 18px;
     margin: 0;
     accent-color: #2563eb;
     align-self: center;
     flex: 0 0 18px;  
   }
   
   .field-checkbox span{
     font-size: 14px;
     font-weight: normal;
     /* color: #0a2540; */
     color: #475569;
     line-height: 1.55;
   }
   
   .search-grid .field-checkbox{
     width: 100%;
     justify-self: stretch;
   }
   
   .field-checkbox .cb-em{
     color: var(--label-color) !important;   /* 우선순위 충돌 방지 */
     font-weight: normal;
   }

  /* 검색 모드 (단어/문장) */
  .search-mode-field{
    grid-column: 1 / -1;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--surface-bg) 90%, var(--accent-bg) 10%);
  }
  .search-mode-field .field-label{
    display: block;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
  }
  .search-mode-option{
    display: grid;
    grid-template-columns: 20px 1fr;
    grid-template-areas:
      "radio title"
      "radio desc";
    column-gap: 10px;
    row-gap: 2px;
    padding: 10px 10px;
    border-radius: 10px;
    min-height: 48px;
    cursor: pointer;
    user-select: none;
  }
  .search-mode-option:hover{
    background: color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 86%, var(--tab-point-highlight) 14%);
  }
  .search-mode-option input[type="radio"]{
    grid-area: radio;
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--tab-point);
    align-self: start;
    justify-self: start;
  }
  .search-mode-title{
    grid-area: title;
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.3;
  }
  .search-mode-desc{
    grid-area: desc;
    font-size: 13px;
    color: var(--label-color);
    line-height: 1.4;
  }
  .search-mode-field .search-mode-option + .search-mode-option{
    margin-top: 1px;
  }

  .search-mode-option input[type="radio"]:checked ~ .search-mode-title{
    color: var(--tab-point);
  }
  .search-mode-option input[type="radio"]:checked ~ .search-mode-desc{
    color: color-mix(in srgb, var(--tab-point) 60%, var(--label-color) 40%);
  }

  body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-mode-field{
    background: var(--app-dark-surface) !important;
    border-color: var(--app-dark-border) !important;
  }
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-mode-title{
    color: var(--app-dark-ink, var(--surface-bg));
  }
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-mode-desc{
    color: color-mix(in srgb, var(--app-dark-ink, var(--surface-bg)) 76%, var(--app-dark-border) 24%);
  }
   
   .form-hint{
     font-size:13px;
     color:#4a6c89;
     background:#eef4fb;
     border:1px dashed #b7c8d9;
     padding:10px 12px;
     border-radius:10px;
   }
   .form-hint code{
     font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;
     background:#fff;
     padding:2px 4px;
     border-radius:6px;
   }
   .search-actions{
     display:flex;
     gap:10px;
     flex-wrap:nowrap;
   }
   .search-actions .btn-primary,
   .search-actions .btn-secondary{
     flex:1 1 0;
     min-width:0;
   }
   .btn-primary,
   .btn-secondary{
     border-radius:var(--radius-pill);
     padding:10px 18px;
     font-weight:700;
     font-size:15px;
     cursor:pointer;
     transition:background .18s, color .18s, transform .18s;
   }
   .btn-primary{
     background:var(--tab-point);
     border:1px solid var(--tab-point);
     color:#fff;
   }
   .btn-primary:hover{
     background:color-mix(in srgb, var(--tab-point) 84%, #000 16%);
   }
   .btn-primary:active{ transform:translateY(1px); }
   .btn-secondary{
     background:#fff;
     border:1px solid #cbd5e1;
     color:#4a6c89;
   }
   .btn-secondary:hover{
     background:color-mix(in srgb, var(--surface-bg) 80%, var(--tab-point-highlight) 20%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible :is(#tab-search, #tab-history) .btn-primary{
     background:var(--tab-point);
     border-color:var(--tab-point);
     color:var(--surface-bg);
   }
   body.page-bible :is(#tab-search, #tab-history) .btn-primary:hover,
   body.page-bible :is(#tab-search, #tab-history) .btn-primary:focus-visible{
     background:color-mix(in srgb, var(--tab-point) 84%, #000 16%);
     border-color:color-mix(in srgb, var(--tab-point) 84%, #000 16%);
     color:var(--surface-bg);
   }
   body.page-bible :is(#tab-search, #tab-history) .btn-primary:active{
     background:color-mix(in srgb, var(--tab-point) 72%, #000 28%);
     border-color:color-mix(in srgb, var(--tab-point) 72%, #000 28%);
     color:var(--surface-bg);
   }
   body.page-bible :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ){
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     border-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
     color:var(--reader-text, var(--tab-point, var(--nav)));
   }
   body.page-bible :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):hover,
   body.page-bible :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):focus-visible{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ){
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):focus-visible{
     background:color-mix(in srgb, var(--reader-card-bg) 76%, var(--tab-point-highlight) 24%);
     border-color:var(--tab-point-soft);
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     #tab-search .btn-secondary,
     #tab-history .btn-secondary:not(.history-clear-btn):not(.history-day-window-chip),
     #tab-history .history-cal-label-btn,
     #tab-history .history-cal-nav-btn
   ):active{
     background:color-mix(in srgb, var(--reader-card-bg) 68%, var(--tab-point-highlight) 32%);
     border-color:var(--tab-point-soft);
     color:var(--reader-text);
   }
   .search-status{
     font-size:14px;
     font-weight:600;
     color:#104d87;
   }
   .search-section h2{
     margin:0 0 10px;
     font-size:18px;
     font-weight:800;
     color:#0f3e66;
   }
   .search-results{
     list-style:none;
     margin:0;
     padding:0;
     display:flex;
     flex-direction:column;
     gap:18px;
   }
   .search-item{
     padding:18px;
     border:1px solid #d9e5f3;
     border-radius:12px;
     background:#f9fcff;
     box-shadow:0 4px 12px rgba(15,62,102,0.04);
   }
   .search-item[data-clickable="reader"],
   .search-item[data-clickable="related"]{
     cursor:pointer;
     transition:background .18s, transform .18s, box-shadow .18s;
   }
   .search-item[data-clickable="reader"]:hover,
   .search-item[data-clickable="related"]:hover{
     background:#eef6ff;
     transform:translateY(-1px);
     box-shadow:0 8px 24px rgba(15,62,102,0.12);
   }
   .search-item[data-clickable="reader"]:focus,
   .search-item[data-clickable="related"]:focus{
     outline:2px solid #94bfff;
     outline-offset:3px;
   }
   .search-item.hymn{
     background:#fffaf5;
     border-color:#f7d8b3;
     box-shadow:0 4px 12px rgba(208,138,54,0.12);
   }
   .search-item.hymn .search-hymn-link{
     display:block;
     text-decoration:none;
     text-decoration-line:none;
     -webkit-text-decoration-line:none;
     text-decoration-color:transparent;
     color:inherit;
   }
   .search-item.hymn .search-hymn-link:focus-visible{
     outline:2px solid rgba(251,146,60,0.8);
     outline-offset:4px;
     border-radius:10px;
   }
   .search-item.empty{
     text-align:center;
     color:#6b7280;
     font-weight:600;
     background:#fff;
   }
   .search-ref{
     margin:0 0 6px;
     font-weight:800;
     color:#0f3e66;
     display:flex;
     align-items:center;
     gap:8px;
     flex-wrap:wrap;
   }
   .search-ref-text{
     display:inline-flex;
     align-items:center;
   }
   .search-version-badge{
     display:inline-flex;
     align-items:center;
     padding:2px 9px;
     font-size:12px;
     font-weight:700;
     border-radius:999px;
     background:#e9f2ff;
     color:#1a3e68;
     border:1px solid rgba(52,116,189,0.22);
   }
   .search-text{
     margin:0;
     color:#1f3d55;
     line-height:1.7;
   }
   .search-meta{
     margin:10px 0 0;
     font-size:13px;
     color:#52677d;
   }
   .search-text mark{
     background:#ffedc2;
     border-radius:6px;
     padding:0 3px;
   }
   .term-context-list{
     list-style:none;
     padding:0;
     margin:0 0 12px;
     display:flex;
     flex-direction:column;
     gap:14px;
   }
   .term-context-item{
     border:1px solid #d9e5f3;
     border-radius:12px;
     padding:14px;
     background:#ffffff;
     box-shadow:0 3px 10px rgba(15,62,102,0.04);
   }
   .term-context-item.clickable{
     cursor:pointer;
     transition:background-color .15s ease, border-color .15s ease, color .15s ease;
   }
   .term-context-item.clickable:hover,
   .term-context-item.clickable:focus-visible{
     background:#eef4fb;
     border-color:#c3d8ec;
     color:#0f3e66;
     box-shadow:none;
     outline:none;
   }
   .term-context-head{
     display:flex;
     flex-wrap:wrap;
     align-items:center;
     gap:8px;
     margin-bottom:6px;
     color:#0f3e66;
   }
   .term-context-head strong{
     font-size:16px;
   }
   .term-context-tags{
     display:flex;
     flex-wrap:wrap;
     gap:4px;
   }
   .term-context-tag{
     display:inline-flex;
     align-items:center;
     padding:2px 8px;
     border-radius:999px;
     background:#eef4ff;
     color:#1d3a5f;
     font-size:12px;
     font-weight:600;
   }
  .term-context-desc{
     margin:0 0 6px;
     font-weight:600;
     color:#1d3553;
   }
   .term-context-desc,
   .context-note-popover-content .note-popover-text{
     --term-desc-lead-color:currentColor;
     --term-desc-label-bg:rgba(15, 62, 102, 0.08);
     --term-desc-label-text:#1f4f78;
     white-space:normal;
   }
   .term-context-desc > *,
   .context-note-popover-content .note-popover-text > *{
     margin:0;
   }
   .term-context-desc .term-desc-lead,
   .term-context-desc .term-desc-body,
   .term-context-desc .term-desc-section-body,
   .context-note-popover-content .note-popover-text .term-desc-lead,
   .context-note-popover-content .note-popover-text .term-desc-body,
   .context-note-popover-content .note-popover-text .term-desc-section-body{
     white-space:pre-line;
     overflow-wrap:anywhere;
     line-height:1.65;
   }
   .term-context-desc .term-desc-lead,
   .context-note-popover-content .note-popover-text .term-desc-lead{
     color:var(--term-desc-lead-color);
     font-weight:600;
   }
   .term-context-desc .term-desc-section,
   .context-note-popover-content .note-popover-text .term-desc-section{
     display:block;
     width:100%;
   }
   .term-context-desc .term-desc-lead + .term-desc-section,
   .context-note-popover-content .note-popover-text .term-desc-lead + .term-desc-section{
     margin-top:12px;
   }
   .term-context-desc .term-desc-body + .term-desc-section{
     margin-top:8px;
   }
   .term-context-desc .term-desc-section + .term-desc-section,
   .context-note-popover-content .note-popover-text .term-desc-section + .term-desc-section{
     margin-top:8px;
   }
   .term-context-desc .term-desc-section-label,
   .context-note-popover-content .note-popover-text .term-desc-section-label{
     display:inline;
     padding:0;
     border:none;
     border-radius:0;
     background:none;
     color:inherit;
     font-size:1em;
     font-weight:700;
     line-height:inherit;
   }
   .term-context-desc .term-desc-section-label::after,
   .context-note-popover-content .note-popover-text .term-desc-section-label::after{
     content:" ";
   }
   .term-context-desc .term-desc-section-body,
   .context-note-popover-content .note-popover-text .term-desc-section-body{
     display:inline;
   }
   .term-context-example{
     margin:0 0 6px;
     font-style:italic;
     color:#4a6c89;
   }
   .term-context-alias{
     margin:0;
     font-size:13px;
     color:#5c6c7d;
   }
   
   @media (max-width:640px){
     .search-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
     .search-actions{
       flex-direction:row;
       flex-wrap:nowrap;
     }
   }
   
   /* =========================
      Chat (Tab 3)
      ========================= */
   .chat-card textarea{
     border:1px solid #cbd5f5;
     background:#fdfefe;
     box-shadow:0 4px 12px rgba(15,62,102,0.04);
   }
   .chat-card textarea:focus{
     outline:none;
     border-color:#94bfff;
     box-shadow:0 0 0 3px rgba(148,191,255,0.35);
   }
   .chat-section .chat-answer{
     border:1px solid #d9e5f3;
     border-radius:12px;
     padding:18px;
     background:#f9fcff;
     min-height:80px;
     color:#1f3d55;
     line-height:1.7;
     font-size:15px;
     box-shadow:0 4px 12px rgba(15,62,102,0.04);
   }
   .chat-answer p{
     margin:0 0 12px;
   }
   .chat-answer p:last-child{
     margin-bottom:0;
   }
   .chat-answer.empty{
     display:flex;
     align-items:center;
     justify-content:center;
     text-align:center;
     color:#6b7280;
     background:#fff;
   }
   .chat-citations{
     list-style:none;
     padding:0;
     margin:0;
     display:flex;
     flex-direction:column;
     gap:12px;
   }
   .chat-citation{
     border-left:3px solid #94bfff;
     border-radius:10px;
     padding:10px 14px;
     background:#f5f9ff;
     color:#1f3d55;
     box-shadow:0 3px 10px rgba(15,62,102,0.05);
   }
   .chat-citation[data-clickable="reader"]{
     cursor:pointer;
     transition:background .18s, transform .18s, box-shadow .18s;
   }
   .chat-citation[data-clickable="reader"]:hover{
     background:#eef6ff;
     transform:translateY(-1px);
     box-shadow:0 6px 18px rgba(15,62,102,0.12);
   }
   .chat-citation strong{
     display:block;
     font-size:14px;
     color:#0f3e66;
     margin:0 0 6px;
   }
   .chat-citation p{
     margin:0;
     line-height:1.6;
     color:#1d3553;
   }
   .chat-citation p mark{
     background:#ffedc2;
     border-radius:4px;
     padding:0 3px;
   }
   
   .chapter-fixed-title {
     font-weight: 800;
     font-size: 1.00em;
     color: #0f3e66;
     margin: 8px 0 12px 4px;
     text-align: left;
     border-bottom: 0;
     padding-bottom: 0;
     display:flex;
     align-items:center;
     gap:14px;
     flex-wrap:wrap;
   }
   .chapter-fixed-label{
     display:inline-flex;
     align-items:center;
   }
   @media (max-width:640px){
     .chapter-fixed-title{
       position:sticky;
       top:0;
       background:#fff;
       z-index:6;
       /* padding-top:6px;*/
     }
   }
   
   .reader-meta{
     margin:6px 0 18px;
   }
   .reader-meta.is-empty{
     display:none;
   }
   .chapter-version-label{
     margin:0 0 6px;
     font-weight:700;
     color:#5a6d82;
     letter-spacing:-0.01em;
   }
   .chapter-fixed-title.is-empty{
     display:none;
   }
   .reader-my-memos-btn{
     border:1px solid #d5deea;
     background:#f8fafc;
     color:#33526c;
     border-radius:10px;
     min-width:44px;
     height:44px;
     padding:0 10px;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     gap:6px;
     font-size:11px;
     font-weight:700;
     letter-spacing:-0.01em;
     cursor:pointer;
     white-space:nowrap;
     transition:background .18s ease, border-color .18s ease, color .18s ease, transform .12s ease;
   }
   .reader-my-memos-icon{
     width:16px;
     height:16px;
     stroke:currentColor;
     fill:none;
     stroke-width:2;
     stroke-linecap:round;
     stroke-linejoin:round;
   }
   .reader-my-memos-btn:hover,
   .reader-my-memos-btn:focus-visible{
     background:#eef2f7;
     border-color:#9fb5ca;
     color:#17344b;
   }
   .reader-my-memos-btn:focus-visible{
     outline:2px solid rgba(23,52,75,0.28);
     outline-offset:2px;
   }
   .reader-my-memos-btn:active{
     transform:translateY(1px);
   }
   
   @media (max-width:640px){
     .field-chapter-row{
       gap:6px;
     }
     .reader-my-memos-btn{
       width:44px;
       padding:0;
     }
     .reader-my-memos-btn-text{
       display:none;
     }
   }
   .section-heading{
     margin:18px 0 8px;
     padding:4px 12px;
     border-left:4px solid #d6e4f5;
     background:#f9fbff;
     border-radius:4px;
   }
   .section-heading-compact{
     margin:12px 0 4px;
     padding:4px 10px;
   }
   .section-heading-text{
     margin:0;
     font-weight:700;
     color:#0f3e66;
   }
   .section-heading-subtitle{
     margin:4px 0 0;
     font-size:0.95em;
     color:#395872;
   }
   .compare-pair .section-heading{
     border-left-width:3px;
   }
   
.voice-input-group{
  display:flex;
  gap:0.5rem;
  align-items:center;
}
.search-clear-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  padding:0;
  border:1px solid #d4d4d8;
  border-radius:999px;
  background:#fff;
  color:#6b7280;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  transition:background 0.2s ease,border-color 0.2s ease,color 0.2s ease;
}
.search-clear-btn:hover,
.search-clear-btn:focus-visible{
  border-color:var(--tab-point);
  color:var(--tab-point);
  background:color-mix(in srgb, #fff 85%, var(--tab-point) 15%);
}
.voice-input-group input{
  flex:1;
}
.voice-btn{
  min-width:2.75rem;
     min-height:2.75rem;
     border-radius:999px;
     border:1px solid #d4d4d8;
     background:#fff;
     font-size:1.1rem;
     line-height:1;
     cursor:pointer;
     transition:background 0.2s ease,border-color 0.2s ease,color 0.2s ease;
   }
   .voice-btn-icon{
     display:block;
     width:1.5rem;
     height:1.5rem;
     object-fit:contain;
     pointer-events:none;
     margin:0 auto;
   }
   .voice-btn.is-recording{
     background:#fff3f1;
     color:#b91c1c;
     border-color:#fb923c;
     box-shadow:0 0 0 2px rgba(249,147,60,.2);
   }
   .voice-btn:disabled{
     opacity:.4;
     cursor:not-allowed;
   }
   .voice-status{
     font-size:.85rem;
     color:#4c4c4c;
     margin:.25rem 0 0;
   }
   
   /* =========================
      Renewed Header / Home / Footer
      ========================= */
   .topbar{
     position:sticky;
     top:0;
     z-index:120;
     background:transparent;
     border-bottom:0;
     transition:background .22s ease, box-shadow .22s ease, border-color .22s ease;
   }
   
   .topbar.is-scrolled{
     background:rgba(255, 255, 255, 0.96);
     border-bottom:1px solid #e1e7ef;
     box-shadow:0 8px 18px rgba(15, 25, 38, 0.06);
     backdrop-filter:blur(8px);
   }
   
   .topbar .wrap{
     max-width:var(--content-max-w);
     margin:0 auto;
     padding:20px 16px;
     min-height:72px;
     display:flex;
     align-items:center;
     justify-content:space-between;
     flex-wrap:nowrap;
     gap:18px;
   }
   
   .brand img{
     height:38px;
     width:auto;
     display:block;
   }
   
   .nav-toggle{
     margin-left:auto;
     display:none;
     width:28px;
     height:28px;
     border:0;
     padding:0;
     background:transparent;
     align-items:center;
     justify-content:center;
     flex-direction:column;
     gap:4px;
     cursor:pointer;
   }
   
   .nav-toggle span{
     width:20px;
     height:2px;
     background:#1f2937;
     border-radius:2px;
     transition:transform .3s ease, opacity .2s ease;
   }
   
   .topbar.menu-open .nav-toggle span:nth-child(1){
     transform:translateY(6px) rotate(45deg);
   }
   
   .topbar.menu-open .nav-toggle span:nth-child(2){
     opacity:0;
   }
   
   .topbar.menu-open .nav-toggle span:nth-child(3){
     transform:translateY(-6px) rotate(-45deg);
   }
   
   .nav-shell{
     margin-left:auto;
     display:flex;
     align-items:center;
     gap:14px;
   }
   
   .nav-main{
     display:flex;
     align-items:center;
     gap:18px;
   }
   
   .nav-main a{
     text-decoration:none;
     color:#334155;
     font-size:16px;
     font-weight:700;
     letter-spacing:0;
     line-height:1.2;
     white-space:nowrap;
     background:transparent;
     border-radius:0;
     box-shadow:none;
     border:0;
     padding:0;
     transition:color .18s ease, opacity .18s ease;
     opacity:.78;
   }
   
   .nav-main a:hover{
     color:#0f2741;
     background:transparent;
     opacity:1;
   }
   
   .nav-main a.active{
     color:#0f3e66;
     font-weight:800;
     position:relative;
     background:transparent;
     box-shadow:none;
     opacity:1;
   }
   
   .nav-main a.active::after{
     content:"";
     position:absolute;
     left:0;
     right:0;
     bottom:-9px;
     height:3px;
     border-radius:999px;
     background:#0f3e66;
   }
   
   .auth-slot{
     display:flex;
     align-items:center;
     gap:12px;
     order:0;
     margin-left:0;
   }
   
   .auth-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     border:0;
     border-radius:0;
     background:transparent;
     color:#1f2937;
     text-decoration:none;
     font-size:16px;
     font-weight:700;
     line-height:1.2;
     padding:0;
     min-height:0;
   }
   
   .auth-btn:hover{
     color:#0f2741;
     background:transparent;
   }
   
   .auth-login{
     color:#1f2937;
     padding:7px 14px;
     border:1px solid #d5deea;
     border-radius:999px;
     background:#fff;
   }
   
   .auth-logout{
     padding:7px 14px;
     border:1px solid #d5deea;
     border-radius:999px;
     background:#fff;
     cursor:pointer;
   }
   
   .home-main{
     margin:0;
   }
   
   .home-hero{
     position:relative;
     padding:56px 0 72px;
     background:
       radial-gradient(900px 420px at 14% -16%, rgba(248, 236, 212, 0.22) 0%, rgba(248, 236, 212, 0) 78%),
       linear-gradient(180deg, #f8fafc 0%, #edf3f9 58%, #ffffff 100%);
   }
   
   .home-hero-inner{
     position:relative;
     z-index:1;
     display:block;
   }
   
   .home-hero-copy h1{
     margin:12px 0 0;
     font-size:clamp(34px, 5vw, 56px);
     line-height:1.1;
     letter-spacing:-0.03em;
     color:#102a43;
   }
   
   .home-kicker{
     margin:0;
     color:#1d4e89;
     font-weight:800;
     font-size:13px;
     letter-spacing:0.08em;
     text-transform:uppercase;
   }
   
   .home-hero-text{
     margin:18px 0 0;
     color:#2c4458;
     font-size:17px;
     line-height:1.75;
     max-width:66ch;
   }
   
   .btn-hero{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     text-decoration:none;
     min-height:46px;
     border-radius:12px;
     padding:0 18px;
     font-size:14px;
     font-weight:800;
     letter-spacing:-0.01em;
     transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
   }
   
   .btn-hero:hover{
     transform:translateY(-1px);
   }
   
   .btn-hero-primary{
     color:#fff;
     background:#173a6a;
     border:1px solid #173a6a;
     box-shadow:0 10px 24px rgba(23, 58, 106, 0.24);
   }
   
   .btn-hero-primary:hover{
     background:#102b4f;
   }
   
   .btn-hero-secondary{
     color:#173a6a;
     background:#fff;
     border:1px solid #c8d3e2;
   }
   
   .btn-hero-secondary:hover{
     background:#f3f7fc;
   }
   
   .auth-gate-card{
     margin:0;
     width:100%;
     max-width:430px;
     background:#fff;
     border:1px solid #d8e0ea;
     border-radius:16px;
     box-shadow:0 14px 30px rgba(14, 29, 46, 0.11);
     padding:24px;
   }
   
   .auth-gate-logo{
     width:48px;
     height:48px;
     display:block;
     margin:0 auto 10px;
     border-radius:12px;
   }
   
   .auth-gate-card h2{
     margin:0;
     text-align:center;
     color:#172b44;
     font-size:30px;
     line-height:1.2;
     letter-spacing:-0.02em;
   }
   
   .auth-gate-desc{
     margin:8px 0 0;
     text-align:center;
     color:#678096;
     font-size:13px;
   }
   
   .auth-gate-status{
     margin:20px 0 0;
     color:#2e465a;
     text-align:center;
     font-size:14px;
     line-height:1.5;
   }
   
   .auth-gate-actions{
     margin-top:12px;
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   
   .social-login-btn{
     display:flex;
     align-items:center;
     justify-content:center;
     min-height:54px;
     border-radius:12px;
     text-decoration:none;
   }
   
   .google-login-btn{
     gap:12px;
     border:1px solid #d6dbe3;
     background:#fff;
     color:#1f2937;
     font-size:15px;
     font-weight:700;
     letter-spacing:0;
     border-radius:10px;
   }
   
   .google-login-icon{
     display:block;
     width:24px;
     height:24px;
     object-fit:contain;
     flex:0 0 auto;
   }
   
   .google-login-text{
     font-size:15px;
     font-weight:700;
     color:#1f2937;
     line-height:1;
   }
   
   .image-login-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     min-height:48px;
     border-radius:12px;
     border:1px solid #d4deea;
     background:#fff;
     text-decoration:none;
     color:#1c2d3f;
     font-weight:700;
     overflow:hidden;
   }
   
   .image-login-btn img{
     display:block;
     width:100%;
     max-width:260px;
     height:auto;
   }
   
   .image-login-kakao{
     border-color:#f3d367;
     background:#fee500;
   }
   
   .image-login-fallback{
     padding:0 14px;
   }
   
   .auth-main-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     text-decoration:none;
     border-radius:10px;
     border:1px solid #c8d3e2;
     color:#173a6a;
     background:#fff;
     font-size:13px;
     font-weight:700;
     padding:10px 14px;
   }
   
   .auth-main-logout{
     cursor:pointer;
   }
   
   .auth-gate-legal{
     margin:14px 0 0;
     color:#7a8da0;
     font-size:12px;
     line-height:1.45;
     text-align:center;
   }
   
   .login-modal{
     position:fixed;
     inset:0;
     z-index:220;
     display:flex;
     align-items:center;
     justify-content:center;
     padding:20px;
   }
   
   .login-modal[hidden]{
     display:none;
   }
   
   .login-modal-backdrop{
     position:absolute;
     inset:0;
     border:0;
     background:rgba(8, 15, 26, 0.42);
     cursor:pointer;
   }
   
   .login-modal .auth-gate-card{
     position:relative;
     z-index:1;
     max-width:357px;
     min-height:430px;
     display:flex;
     flex-direction:column;
     padding:38px 34px 24px;
     border-radius:20px;
   }
   
   .login-modal-close{
     position:absolute;
     top:8px;
     right:10px;
     width:30px;
     height:30px;
     border:0;
     background:transparent;
     color:#5f7284;
     font-size:28px;
     line-height:1;
     cursor:pointer;
   }
   
   body.login-modal-open{
     overflow:hidden;
   }
   
   .login-modal .auth-gate-logo{
     width:54px;
     height:54px;
     margin:0 auto 18px;
   }
   
   .login-modal .auth-gate-card h2{
     font-size:22px;
     line-height:1.25;
   }
   
   .login-modal .auth-gate-actions{
     margin-top:38px;
     gap:14px;
     align-items:center;
   }
   
   .login-modal .social-login-btn{
     min-height:44px;
   }
   
   .login-modal .image-login-btn{
     min-height:39px;
   }
   
   .login-modal .auth-gate-actions > .social-login-btn,
   .login-modal .auth-gate-actions > .image-login-btn{
     width:83%;
   }
   
   .login-modal .auth-gate-actions > .image-login-btn img{
     width:100%;
     max-width:none;
   }
   
   .login-modal .auth-gate-legal{
     margin-top:auto;
     padding-top:28px;
     padding-bottom:0;
   }
   
   img[src$="bottom.png"]{
     display:none !important;
   }
   
   .home-section{
     margin:0 auto;
     padding-top:86px;
     padding-bottom:12px;
   }
   
   .home-main .section-heading{
     margin:0 0 24px;
     padding:0;
     border:0;
     background:none;
   }
   
   .section-kicker{
     margin:0;
     color:#2a5a92;
     font-size:12px;
     font-weight:800;
     letter-spacing:0.09em;
     text-transform:uppercase;
   }
   
   .home-main .section-heading h2{
     margin:8px 0 0;
     color:#102a43;
     font-size:clamp(28px, 4vw, 38px);
     line-height:1.15;
     letter-spacing:-0.02em;
   }
   
   .about-grid{
     display:grid;
     grid-template-columns:minmax(0, 1.25fr) minmax(280px, 0.9fr);
     gap:22px;
   }
   
   .about-copy,
   .about-panel-card,
   .worship-card,
   .ministry-card,
   .location-copy,
   .location-map{
     border:1px solid #dde4ee;
     background:#fff;
     border-radius:18px;
     box-shadow:0 12px 24px rgba(11, 28, 44, 0.07);
   }
   
   .about-copy{
     padding:28px;
   }
   
   .about-copy h3,
   .location-copy h3{
     margin:0;
     font-size:26px;
     color:#122c45;
     letter-spacing:-0.02em;
   }
   
   .about-copy p{
     margin:14px 0 0;
     color:#3b5367;
     font-size:15px;
     line-height:1.78;
   }
   
   .about-panel{
     display:grid;
     gap:14px;
   }
   
   .about-panel-card{
     padding:20px;
   }
   
   .about-panel-card h4{
     margin:0;
     color:#173a6a;
     font-size:18px;
   }
   
   .about-panel-card p,
   .about-panel-card li{
     margin-top:10px;
     color:#3a5369;
     line-height:1.65;
   }
   
   .about-panel-card ul{
     margin:6px 0 0;
     padding-left:18px;
   }
   
   .home-worship{
     margin-top:12px;
     padding:6px 0 18px;
     background:linear-gradient(180deg, #fdfbf8 0%, #fffdfa 45%, #fff 100%);
     border-top:1px solid #f6efe3;
     border-bottom:1px solid #f6efe3;
   }
   
   .worship-grid{
     display:grid;
     grid-template-columns:repeat(3, minmax(0, 1fr));
     gap:14px;
   }
   
   .worship-card{
     padding:22px;
   }
   
   .worship-card h3{
     margin:0;
     color:#143352;
     font-size:20px;
     letter-spacing:-0.01em;
   }
   
   .worship-time{
     margin:12px 0 0;
     color:#1b4f84;
     font-size:30px;
     font-weight:800;
     letter-spacing:-0.03em;
   }
   
   .worship-place{
     margin:6px 0 0;
     color:#4b6578;
     font-weight:600;
   }
   
   .ministry-grid{
     display:grid;
     grid-template-columns:repeat(3, minmax(0, 1fr));
     gap:14px;
   }
   
   .ministry-card{
     padding:20px;
   }
   
   .ministry-card h3{
     margin:0;
     font-size:20px;
     color:#133454;
   }
   
   .ministry-card p{
     margin:12px 0 0;
     color:#3f5a70;
     line-height:1.7;
     font-size:14px;
   }
   
   .location-grid{
     display:grid;
     grid-template-columns:minmax(260px, 0.8fr) minmax(0, 1.2fr);
     gap:14px;
   }
   
   .location-copy{
     padding:24px;
   }
   
   .location-address{
     margin:14px 0 0;
     color:#2f4a61;
     font-weight:700;
     line-height:1.6;
   }
   
   .location-copy dl{
     margin:18px 0;
     display:grid;
     grid-template-columns:56px minmax(0, 1fr);
     row-gap:10px;
     column-gap:10px;
   }
   
   .location-copy dt{
     color:#173a6a;
     font-weight:800;
   }
   
   .location-copy dd{
     margin:0;
     color:#3f5a70;
   }
   
   .location-map{
     overflow:hidden;
   }
   
   .location-map iframe{
     width:100%;
     min-height:100%;
     height:360px;
     border:0;
     display:block;
   }
   
   .site-footer{
     margin-top:44px;
     background:#111924;
     color:#ced7e2;
     border-top:1px solid rgba(255, 255, 255, 0.08);
   }
   .site-footer a{
     color:#e8eff8;
     margin-left:12px;
     text-underline-offset:2px;
   }
   .site-footer a:hover{
     color:#ffffff;
   }
   
   .youtube-section{
     padding-top:70px;
   }
   
   .youtube-card{
     background:#fff;
     border:1px solid #dde4ee;
     border-radius:14px;
     box-shadow:0 10px 20px rgba(11, 28, 44, 0.06);
     padding:24px;
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     flex-wrap:wrap;
   }
   
   .youtube-handle{
     margin:0;
     font-size:20px;
     font-weight:800;
     color:#1f3b5a;
     letter-spacing:-0.01em;
   }
   
   .youtube-link-btn{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     text-decoration:none;
     min-height:38px;
     padding:0 14px;
     border-radius:8px;
     border:1px solid #d23c3c;
     background:#fff;
     color:#b42323;
     font-size:14px;
     font-weight:700;
   }
   
   .youtube-link-btn:hover{
     background:#fff5f5;
   }
   
   [data-reveal]{
     opacity:0;
     transform:translateY(16px);
     transition:opacity .45s ease, transform .45s ease;
   }
   
   [data-reveal].is-visible{
     opacity:1;
     transform:translateY(0);
   }
   
   .footer-bottom{
     border-top:0;
     padding:18px 16px 22px;
     text-align:center;
     color:#95a6b9;
   }
   
  @media (max-width: 820px){
     .topbar .wrap{
       min-height:76px;
       padding:20px 16px;
       flex-wrap:nowrap;
       row-gap:0;
     }
   
     .brand img{
       height:32px;
     }
   
     .nav-toggle{
       display:inline-flex;
     }
   
     .nav-shell{
       position:absolute;
       top:100%;
       left:0;
       right:0;
       z-index:40;
       border-top:1px solid var(--line);
       border-radius:0;
       background:var(--surface-bg);
       box-shadow:0 14px 24px rgba(15, 23, 42, 0.12);
       padding:8px 24px 14px;
       display:flex;
       flex-direction:column;
       gap:10px;
       opacity:0;
       transform:translateY(-10px);
       max-height:0;
       overflow:hidden;
       pointer-events:none;
       transition:all .3s ease-in-out;
     }
   
     .topbar.menu-open .nav-shell{
       opacity:1;
       transform:translateY(0);
       max-height:calc(100vh - 76px);
       overflow-y:auto;
       pointer-events:auto;
     }
   
     .nav-main{
       width:100%;
       flex-direction:column;
       align-items:stretch;
       gap:0;
     }
   
     .nav-main a{
       flex:none;
       display:block;
       background:transparent;
       box-shadow:none;
       border-radius:0;
       border-bottom:1px solid #e5e7eb;
       text-align:left;
       padding:14px 0;
       font-size:16px;
       color:#1f2937;
       opacity:1;
     }
   
     .nav-main a.active{
       color:#0f3e66;
       font-weight:800;
       padding-left:4px;
       background:#f3f7fc;
       border-radius:8px;
     }
   
     .nav-main a.active::after{
       content:none;
     }
   
     .auth-slot{
       width:100%;
       justify-content:flex-start;
       margin-top:0;
       padding-top:0;
     }
   
     .auth-btn{
       width:auto;
       padding:0;
       min-height:0;
       border:0;
       border-radius:0;
       font-size:16px;
     }
   
     .auth-login,
     .auth-logout{
       padding:7px 12px;
       border:1px solid #d5deea;
       border-radius:999px;
       background:#fff;
       font-size:14px;
     }
   
     .auth-slot .auth-login,
     .auth-slot .auth-logout{
       display:block;
       width:100%;
       padding:14px 0;
       border:0;
       border-radius:0;
       background:transparent;
       color:#1f2937;
       font-size:16px;
       font-weight:700;
       line-height:1.2;
       text-align:left;
       border-bottom:1px solid #e5e7eb;
       cursor:pointer;
     }
   
     .home-hero{
       padding-top:34px;
     }
   
     .home-hero-copy h1{
       font-size:clamp(33px, 11vw, 46px);
     }
   
     .auth-gate-card{
       max-width:100%;
     }
   
     .login-modal{
       padding:14px;
     }
   
     .login-modal .auth-gate-card{
       min-height:380px;
       padding:26px 18px 20px;
     }
   
     .login-modal .auth-gate-card h2{
       font-size:20px;
     }
   
     .login-modal .auth-gate-actions{
       margin-top:30px;
       align-items:center;
     }
   
     .login-modal .auth-gate-actions > .social-login-btn,
     .login-modal .auth-gate-actions > .image-login-btn{
       width:90%;
     }
   
     .login-modal .auth-gate-legal{
       margin-top:auto;
       padding-top:18px;
     }
   
     .youtube-card{
       padding:18px;
     }
   
     .youtube-handle{
       font-size:18px;
     }
   
     .about-grid,
     .worship-grid,
     .ministry-grid,
     .location-grid{
       grid-template-columns:1fr;
     }
   
     .home-section{
       padding-top:64px;
     }
   
     .site-footer{
       margin-top:34px;
     }
   
   }
   
   @media (prefers-reduced-motion: reduce){
     [data-reveal]{
       opacity:1;
       transform:none;
       transition:none;
     }
   }
   
   body.kakao-external-mode{
     overflow:hidden;
   }
   
   .kakao-external-gate{
     position:fixed;
     inset:0;
     z-index:2400;
     display:flex;
     align-items:center;
     justify-content:center;
     padding:20px;
     background:rgba(5, 20, 35, 0.92);
   }
   
   .kakao-external-card{
     width:min(460px, 100%);
     background:#ffffff;
     border:1px solid #d7e4f2;
     border-radius:16px;
     box-shadow:0 22px 45px rgba(4, 17, 30, 0.35);
     padding:22px 18px;
     display:flex;
     flex-direction:column;
     gap:12px;
   }
   
   .kakao-external-card h2{
     margin:0;
     color:#11344f;
     font-size:22px;
     line-height:1.35;
   }
   
   .kakao-external-card p{
     margin:0;
     color:#2a4e67;
     line-height:1.65;
   }
   
   .kakao-external-actions{
     margin-top:6px;
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   
   .kakao-external-actions .auth-main-btn{
     width:100%;
   }
   
   .kakao-external-status{
     min-height:22px;
     font-size:13px;
     color:#527085;
   }
   
   /* =========================
      Bible Reader UI Refresh
      ========================= */
   body.page-bible{
     --reader-bg:#f7fbff;
     --reader-card-bg:#ffffff;
     --reader-card-border:#dbe7f3;
     --reader-panel-bg:#f9fbff;
     --reader-content-font:"Noto Serif KR", "Nanum Myeongjo", "Times New Roman", serif;
     --reader-text:#123248;
     --reader-muted:#5a6d82;
     --reader-verse-number:#0f3e66;
     --reader-hover:#f8fafc;
     --reader-track:#d9e2ec;
     --reader-track-fill:var(--app-point-soft);
     --reader-thumb-border:#cbd5e1;
     --reader-thumb-shadow:0 2px 8px rgba(15,62,102,0.2);
     --reader-theme-btn-bg:#f8fafc;
     --reader-theme-btn-border:#d1dce8;
     --reader-theme-btn-ink:#26435a;
     --reader-theme-btn-hover:#eef3f8;
     --reader-theme-btn-hover-border:#9fb5ca;
     --memo-indicator:var(--app-point-soft);
     --memo-verse-gutter:var(--app-point-soft);
   }
   
   body.page-bible.reader-dark-mode{
     --reader-bg:#1A202C;
     --reader-card-bg:#202d3d;
     --reader-card-border:#334960;
     --reader-panel-bg:#1c2736;
     --reader-text:#E2E8F0;
     --reader-muted:#9fb0c3;
     --reader-verse-number:#f1f5f9;
     --reader-hover:#243247;
     --reader-track:#44576b;
     --reader-track-fill:#D1A054;
     --reader-thumb-border:#7a91a8;
     --reader-thumb-shadow:0 2px 10px rgba(0,0,0,0.45);
     --reader-theme-btn-bg:#273447;
     --reader-theme-btn-border:#405569;
     --reader-theme-btn-ink:#e2e8f0;
     --reader-theme-btn-hover:#304256;
     --reader-theme-btn-hover-border:#5c738a;
     --memo-verse-gutter:#D1A054;
   }
   
   body.page-bible.reader-dark-mode{
     background-color:var(--reader-bg);
     color:var(--reader-text);
   }
   body.page-bible .reader-controls-row{
     align-items:center;
   }
   body.page-bible .compare-wrap{
     align-items:center;
   }
   body.page-bible .compare-wrap input[type="checkbox"]{
     transform:none;
   }
   body.page-bible .tab-reader-tools{
     align-items:center;
   }
   body.page-bible .pair-side{
     line-height:var(--reader-line-height, 1.7);
   }
   body.page-bible .pair-side .verse-text{
     line-height:inherit;
   }
   body.page-bible .section-heading{
     margin:16px 0 8px;
     padding:2px 0 2px 10px;
     border-left:4px solid #9fbad5;
     border-radius:0;
     background:transparent;
   }
   body.page-bible .section-heading-text{
     font-size:1.03rem;
     font-weight:800;
     color:#244663;
   }
   body.page-bible .section-heading-subtitle{
     color:#5a7289;
   }
   body.page-bible .context-trigger,
   body.page-bible .note-context-trigger{
     background:transparent;
     color:var(--app-point);
     border:none;
     border-radius:0;
     padding:0 1px;
     box-shadow:none;
     text-decoration:none;
     font-weight:600;
   }
   body.page-bible .context-trigger:hover,
   body.page-bible .context-trigger:focus-visible,
   body.page-bible .note-context-trigger:hover,
   body.page-bible .note-context-trigger:focus-visible{
     background:var(--app-point-highlight);
     color:var(--app-point);
     border-bottom-color:var(--app-point-soft);
     transform:none;
     box-shadow:none;
   }
   body.page-bible.reader-dark-mode .topbar{
     background:rgba(26,32,44,0.9);
     border-bottom:1px solid #344a61;
   }
   body.page-bible.reader-dark-mode .topbar.is-scrolled{
     background:rgba(26,32,44,0.96);
     border-bottom-color:#465c72;
     box-shadow:0 10px 22px rgba(0,0,0,0.28);
   }
   body.page-bible.reader-dark-mode .nav-toggle span{
     background:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .nav-main a{
     color:#e2e8f0;
     opacity:0.92;
   }
   body.page-bible.reader-dark-mode .nav-main a:hover{
     color:#ffffff;
     opacity:1;
   }
   body.page-bible.reader-dark-mode .nav-main a.active{
     color:#ffffff;
   }
   body.page-bible.reader-dark-mode .nav-main a.active::after{
     background:#D1A054;
   }
   body.page-bible.reader-dark-mode .auth-btn{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .auth-login{
     background:#29415a;
     border-color:#5b7490;
     color:#ffffff;
   }
   body.page-bible.reader-dark-mode .auth-logout{
     background:transparent;
     border-color:#5b7490;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .auth-btn:hover{
     color:#ffffff;
   }
   body.page-bible.reader-dark-mode .page-title .h1{
     color:#d8e5f2;
   }
   body.page-bible.reader-dark-mode .tab-toolbar{
     border-bottom-color:#344a61;
   }
   body.page-bible.reader-dark-mode .tab{
     color:#a8bbcf;
   }
   body.page-bible.reader-dark-mode .tab:hover{
     color:#e2e8f0;
     border-bottom-color:color-mix(in srgb, var(--app-point-soft) 60%, transparent);
   }
   body.page-bible.reader-dark-mode .tab.active{
     color:#e2e8f0;
     border-bottom-color:var(--app-point);
   }
   body.page-bible.reader-dark-mode .card.bible-reader{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     box-shadow:0 18px 34px rgba(0,0,0,0.3);
   }
   body.page-bible .bible-reader-content{
     background:var(--reader-panel-bg);
     border-color:var(--reader-card-border);
   }
   body.page-bible #readerContent,
   body.page-bible #readerCompare,
   body.page-bible #relatedReaderContent{
     font-family:var(--reader-content-font);
   }
   body.page-bible #relatedReaderContent{
     font-size:var(--reader-font-size, 16px);
     line-height:var(--reader-line-height, 1.7);
     max-height:none;
     overflow:visible;
     overflow-x:hidden;
     overscroll-behavior:auto;
     max-width:100%;
     width:100%;
     box-sizing:border-box;
   }
   body.page-bible #relatedReaderContent,
   body.page-bible #relatedReaderContent .chapter-header,
   body.page-bible #relatedReaderContent .chapter-title-main,
   body.page-bible #relatedReaderContent .chapter-subtitle,
   body.page-bible #relatedReaderContent .chapter-note-strip,
   body.page-bible #relatedReaderContent .verse-line,
   body.page-bible #relatedReaderContent .verse-text,
   body.page-bible #relatedReaderContent .verse-title,
   body.page-bible #relatedReaderContent .note-inline,
   body.page-bible #relatedReaderContent .note-trigger-visual{
     max-width:100%;
     min-width:0;
     box-sizing:border-box;
   }
   body.page-bible #tab-search .search-text,
   body.page-bible #tab-search .search-meta,
   body.page-bible #tab-search .term-context-desc,
   body.page-bible #tab-search .term-context-example,
   body.page-bible #tab-search .term-context-alias{
     font-family:var(--reader-content-font);
     font-size:calc(var(--reader-font-size, 16px) * 0.92);
     line-height:var(--reader-line-height, 1.7);
   }
   body.page-bible #tab-search .search-ref{
     font-family:var(--reader-content-font);
     font-size:calc(var(--reader-font-size, 16px) * 0.9);
   }
   body.page-bible .reader-status,
   body.page-bible .chapter-version-label{
     color:var(--reader-muted);
   }
   body.page-bible .chapter-fixed-title{
     color:var(--reader-verse-number);
   }
   body.page-bible.reader-dark-mode .chapter-fixed-title{
     color:var(--reader-text);
   }
   body.page-bible.reader-dark-mode .chapter-title-main,
   body.page-bible.reader-dark-mode .chapter-subtitle,
   body.page-bible.reader-dark-mode .verse-title{
     color:#dbe7f3;
   }
   body.page-bible .verse-line{
     color:var(--reader-text);
   }
   body.page-bible .verse-number{
     color:var(--reader-verse-number);
   }
   body.page-bible .verse-line.has-memo:hover{
     background:var(--reader-hover);
   }
   body.page-bible.reader-dark-mode .verse-line.is-highlight,
   body.page-bible.reader-dark-mode .verse-line.has-memo.is-highlight:hover{
     background:#5f4a2c;
     box-shadow:0 6px 16px rgba(0,0,0,0.35);
   }
   body.page-bible.reader-dark-mode .verse-line.is-multiline .verse-text,
   body.page-bible.reader-dark-mode .pair-side.is-multiline .verse-text{
     border-left-color:rgba(226,232,240,0.28);
   }
   body.page-bible.reader-dark-mode .reader-nav .btn-pill{
     background:#243447;
     border-color:#3f566d;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .reader-nav .btn-pill:not(:disabled):hover{
     background:#37506a;
     border-color:#4c6681;
   }
   body.page-bible.reader-dark-mode .field-label,
   body.page-bible.reader-dark-mode .compare-wrap,
   body.page-bible.reader-dark-mode .tab-reader-tools{
     color:#c5d7ea;
   }
   body.page-bible.reader-dark-mode .field select,
   body.page-bible.reader-dark-mode .field input,
   body.page-bible.reader-dark-mode .field textarea{
     background:#243447;
     border-color:#425a71;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .field select:focus,
   body.page-bible.reader-dark-mode .field input:focus,
   body.page-bible.reader-dark-mode .field textarea:focus{
     outline:none;
     border-color:#7ea2c5;
     box-shadow:0 0 0 2px rgba(126,162,197,0.22);
   }
   body.page-bible.reader-dark-mode .compare-wrap input[type="checkbox"]{
     accent-color:#D1A054;
   }
   body.page-bible.reader-dark-mode .compare-head{
     background:#27384b;
     border-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-label{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .compare-pairs{
     border-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-pair{
     border-bottom-color:rgba(226,232,240,0.12);
   }
   body.page-bible.reader-dark-mode .pair-side{
     border-right-color:rgba(226,232,240,0.12);
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .pair-side:first-child{
     background:#1f2f41;
   }
   body.page-bible.reader-dark-mode .pair-side:last-child{
     background:#243447;
   }
   body.page-bible.reader-dark-mode .pair-side .verse-number{
     color:#f1f5f9;
   }
   body.page-bible.reader-dark-mode .note-popover,
   body.page-bible.reader-dark-mode .context-note-popover{
     background:#313d4f;
     border-color:#4b6279;
     color:#e2e8f0;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.08);
   }
   body.page-bible.reader-dark-mode .note-popover::before,
   body.page-bible.reader-dark-mode .context-note-popover::before{
     background:#2a3444;
   }
   body.page-bible.reader-dark-mode .context-popover{
     background:#313d4f;
     border-color:#4b6279;
     color:#e2e8f0;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.08);
   }
   body.page-bible.reader-dark-mode .context-popover::before{
     border-color:transparent transparent #2a3444 transparent;
   }
   body.page-bible.reader-dark-mode .context-popover-head strong{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .context-note-head{
     border-bottom-color:#445a71;
   }
   body.page-bible.reader-dark-mode .context-note-clicked{
     color:#c6d7e9;
   }
   body.page-bible.reader-dark-mode .context-note-badge{
     background:#2f435a;
     border-color:#5a7590;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .context-note-marker{
     color:#c6d7e9;
   }
   body.page-bible.reader-dark-mode .context-note-refs-title,
   body.page-bible.reader-dark-mode .context-note-synonyms-title{
     color:#d8e4f1;
   }
   body.page-bible.reader-dark-mode .context-note-synonym-chip{
    background:rgba(255, 255, 255, 0.10);
    border:none;
    color:#ffffff;
   }
   body.page-bible.reader-dark-mode .context-note-ref-view-btn{
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .context-note-ref-view-btn:hover,
   body.page-bible.reader-dark-mode .context-note-ref-view-btn:focus-visible{
     background:var(--tab-point-highlight);
     border-color:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .context-note-ref-link{
     background:transparent;
     border-color:#3d546b;
     color:#d3e0ed;
   }
   body.page-bible.reader-dark-mode .context-note-ref-link:hover,
   body.page-bible.reader-dark-mode .context-note-ref-link:focus-visible{
     background:#2a3c52;
   }
   body.page-bible.reader-dark-mode .context-note-more-btn{
     background:#1f3a5a;
     border-color:#5b7490;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .context-note-more-btn:hover,
   body.page-bible.reader-dark-mode .context-note-more-btn:focus-visible{
     background:#284869;
     border-color:#7190ae;
   }
   body.page-bible.reader-dark-mode .section-heading-text{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .section-heading{
     border-left-color:#7ea2c5;
   }
   body.page-bible.reader-dark-mode .section-heading-subtitle{
     color:#b7c7d7;
   }
   body.page-bible.reader-dark-mode .context-trigger,
   body.page-bible.reader-dark-mode .note-context-trigger{
     color:#D9B57A;
   }
   body.page-bible.reader-dark-mode .context-trigger:hover,
   body.page-bible.reader-dark-mode .context-trigger:focus-visible,
   body.page-bible.reader-dark-mode .note-context-trigger:hover,
   body.page-bible.reader-dark-mode .note-context-trigger:focus-visible{
     background:rgba(246,135,179,0.14);
     color:#E7C995;
   }
   body.page-bible.reader-dark-mode .memo-modal-panel,
   body.page-bible.reader-dark-mode .memo-index-panel{
     background:#2a3444;
     border-color:#4b6279;
     color:#e2e8f0;
     box-shadow:0 24px 48px rgba(0,0,0,0.4);
   }
   body.page-bible.reader-dark-mode .memo-modal-title,
   body.page-bible.reader-dark-mode .memo-index-title,
   body.page-bible.reader-dark-mode .memo-index-status,
   body.page-bible.reader-dark-mode .memo-index-ref,
   body.page-bible.reader-dark-mode .memo-index-preview{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .memo-modal-meta{
     color:#a8bed2;
   }
   body.page-bible.reader-dark-mode .btn-popup-close,
   body.page-bible.reader-dark-mode .btn-popup-close{
     background:#243447;
     border-color:#5b7490;
     color:#d6e3ef;
   }
   body.page-bible.reader-dark-mode .btn-popup-close:hover,
   body.page-bible.reader-dark-mode .btn-popup-close:hover{
     background:#304256;
   }
   body.page-bible.reader-dark-mode .memo-modal-input,
   body.page-bible.reader-dark-mode .memo-index-select,
   body.page-bible.reader-dark-mode .memo-index-recent,
   body.page-bible.reader-dark-mode .memo-index-search{
     background:#243447;
     border-color:#425a71;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .memo-modal-actions .btn-primary,
   body.page-bible.reader-dark-mode .memo-index-filters .btn-primary{
     background:#1f3a5a;
     border-color:#5b7490;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .memo-modal-actions .btn-primary:hover,
   body.page-bible.reader-dark-mode .memo-index-filters .btn-primary:hover{
     background:#284869;
     border-color:#7190ae;
   }
   body.page-bible.reader-dark-mode .memo-modal-actions .btn-secondary,
   body.page-bible.reader-dark-mode .memo-index-filters .btn-secondary,
   body.page-bible.reader-dark-mode .memo-index-more{
     background:#243447;
     border-color:#5b7490;
     color:#d6e3ef;
   }
   body.page-bible.reader-dark-mode .memo-modal-actions .btn-secondary:hover,
   body.page-bible.reader-dark-mode .memo-index-filters .btn-secondary:hover,
   body.page-bible.reader-dark-mode .memo-index-more:hover{
     background:#304256;
   }
   body.page-bible.reader-dark-mode .memo-index-list{
     border-color:#425a71;
   }
   body.page-bible.reader-dark-mode .memo-index-item{
     background:#243447;
     border-bottom-color:#385067;
   }
   body.page-bible.reader-dark-mode .memo-index-item:hover,
   body.page-bible.reader-dark-mode .memo-index-item:focus-visible{
     background:#304256;
   }
   body.page-bible.reader-dark-mode .memo-index-updated{
     color:#a8bed2;
   }
   body.page-bible.reader-dark-mode .memo-index-created{
     color:#a8bed2;
   }
   body.page-bible .related-current{
     margin:0 0 8px;
     padding:8px 10px;
     border:1px solid #d8e4f0;
     border-radius:10px;
     background:#f4f8ff;
     color:#204768;
     font-size:16px;
     font-weight:800;
   }
   body.page-bible.reader-dark-mode .related-card{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     box-shadow:0 18px 34px rgba(0,0,0,0.28);
   }
  body.page-bible.reader-dark-mode .related-title,
  body.page-bible.reader-dark-mode .related-subtitle strong{
    color:#d7e5f2;
  }
  body.page-bible.reader-dark-mode .related-description{
    color:#b7c5d6;
  }
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-related .related-description{
    --term-desc-lead-color:var(--reader-text, #d7e5f2);
    --term-desc-label-bg:color-mix(in srgb, var(--reader-panel-bg, #243447) 70%, var(--tab-point-highlight) 30%);
    --term-desc-label-text:color-mix(in srgb, var(--reader-text, #d7e5f2) 86%, white 14%);
  }
  body.page-bible.reader-dark-mode .related-subtitle{
    color:#9fb0c3;
  }
   body.page-bible.reader-dark-mode .related-list-wrap{
     background:#243447;
     border-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .related-filter{
     background:#202d3d;
     border-color:#475f76;
     color:#c5d7ea;
   }
   body.page-bible.reader-dark-mode .related-filter.active{
     background:#2f435a;
     border-color:#5a7590;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .related-ref-item{
     background:#1f2f41;
     border-color:#3d546b;
     color:#d3e0ed;
   }
   body.page-bible.reader-dark-mode .related-ref-item:hover,
   body.page-bible.reader-dark-mode .related-ref-item:focus-visible{
     background:#2a3c52;
     border-color:#637f9a;
     color:#f1f5f9;
   }
   body.page-bible.reader-dark-mode .related-ref-item.active{
     background:#2f435a;
     border-color:#6a88a5;
     color:#f1f5f9;
   }
   body.page-bible.reader-dark-mode .related-current{
     background:#223244;
     border-color:#425a71;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .search-card{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     box-shadow:0 18px 34px rgba(0,0,0,0.28);
   }
   body.page-bible.reader-dark-mode .search-status{
     color:#c5d7ea;
   }
   body.page-bible.reader-dark-mode .search-section h2{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .search-item{
     background:#1f2f41;
     border-color:#3d546b;
     box-shadow:none;
   }
   body.page-bible.reader-dark-mode .search-item[data-clickable="reader"]:hover,
   body.page-bible.reader-dark-mode .search-item[data-clickable="related"]:hover{
     background:#2b3f56;
     box-shadow:0 10px 20px rgba(0,0,0,0.24);
   }
   body.page-bible.reader-dark-mode .search-ref,
   body.page-bible.reader-dark-mode .search-text{
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .search-meta{
     color:#a9bdd1;
   }
   body.page-bible.reader-dark-mode .search-version-badge{
     background:#2b4159;
     border-color:#4f6b87;
     color:#d7e6f4;
   }
   body.page-bible.reader-dark-mode .search-text mark,
   body.page-bible.reader-dark-mode .chat-citation p mark{
     background:#7f5a17;
     color:#fff3d4;
   }
   body.page-bible.reader-dark-mode .term-context-item{
     background:#1f2f41;
     border-color:#3d546b;
     box-shadow:none;
   }
   body.page-bible.reader-dark-mode .term-context-item.clickable:hover,
   body.page-bible.reader-dark-mode .term-context-item.clickable:focus-visible{
     background:#2a3c52;
     border-color:#637f9a;
     color:#f1f5f9;
   }
   body.page-bible.reader-dark-mode .term-context-head,
   body.page-bible.reader-dark-mode .term-context-desc{
     --term-desc-label-bg:rgba(226, 232, 240, 0.12);
     --term-desc-label-text:#dbeafe;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .term-context-example,
   body.page-bible.reader-dark-mode .term-context-alias{
     color:#a9bdd1;
   }
   body.page-bible.reader-dark-mode .term-context-tag{
     background:#30465f;
     color:#dce9f7;
   }
   body.page-bible.reader-dark-mode .range-field{
     background:#223244;
     border-color:#40586f;
     box-shadow:none;
   }
   body.page-bible.reader-dark-mode .range-checkbox,
   body.page-bible.reader-dark-mode .range-value{
     color:#d3e0ed;
   }
   body.page-bible.reader-dark-mode .field-checkbox{
     background:#223244;
     border-color:#40586f;
     box-shadow:none;
   }
   body.page-bible.reader-dark-mode .field-checkbox span{
     color:#c5d7ea;
   }
   body.page-bible.reader-dark-mode .field-checkbox .cb-em{
     color:#dce9f7 !important;
   }
   body.page-bible .voice-btn{
     background:#f8fbff;
     border-color:#cbd8e8;
   }
   body.page-bible .voice-btn:hover{
     background:#eef4fb;
     border-color:#9fb5ca;
   }
body.page-bible.reader-dark-mode .voice-btn{
  background:#243447;
  border-color:#415971;
}
body.page-bible:is(.reader-dark-mode, .app-dark-mode) .search-clear-btn{
  border-color:#40586f;
  background:#223244;
  color:var(--reader-muted);
}
body.page-bible:is(.reader-dark-mode, .app-dark-mode) .search-clear-btn:hover,
body.page-bible:is(.reader-dark-mode, .app-dark-mode) .search-clear-btn:focus-visible{
  border-color:#5c738a;
  color:#e2e8f0;
  background:#2a3c52;
}
body.page-bible.reader-dark-mode .voice-btn-icon{
  filter:brightness(1.2) saturate(0.9);
}
   body.page-bible .field-chapter-row{
     gap:10px;
   }
   body.page-bible .reader-my-memos-btn{
     width:42px;
     height:42px;
     min-width:42px;
     padding:0;
     border-radius:999px;
     border:1px solid transparent;
     background:transparent;
     color:#5d738a;
     gap:0;
   }
   body.page-bible .reader-my-memos-btn:hover,
   body.page-bible .reader-my-memos-btn:focus-visible{
     background:#edf2f7;
     border-color:#d5deea;
     color:#17344b;
   }
   body.page-bible .reader-my-memos-icon{
     width:18px;
     height:18px;
   }
   body.page-bible.reader-dark-mode .reader-my-memos-btn{
     color:#c5d7ea;
   }
   body.page-bible.reader-dark-mode .reader-my-memos-btn:hover,
   body.page-bible.reader-dark-mode .reader-my-memos-btn:focus-visible{
     background:#2d3f54;
     border-color:#4b6279;
     color:#e2e8f0;
   }
   
   body.page-bible .reader-font-select{
     height:38px;
     min-width:106px;
     border:1px solid #cfdeec;
     border-radius:999px;
     padding:0 11px;
     background:#fff;
     color:#17344b;
     font-size:12px;
     font-weight:700;
   }
   body.page-bible .reader-font-select:focus{
     outline:none;
     border-color:#8fb0cf;
     box-shadow:0 0 0 2px rgba(143,176,207,0.2);
   }
   body.page-bible.reader-dark-mode .reader-font-select{
     background:#243447;
     border-color:#415971;
     color:#e2e8f0;
   }
   body.page-bible.reader-dark-mode .reader-font-select:focus{
     border-color:#7ea2c5;
     box-shadow:0 0 0 2px rgba(126,162,197,0.22);
   }
   body.page-bible .font-size-icon{
     line-height:1;
     color:var(--reader-muted);
     user-select:none;
     font-weight:700;
   }
   body.page-bible .font-size-icon-sm{
     font-size:12px;
   }
   body.page-bible .font-size-icon-lg{
     font-size:16px;
   }
   body.page-bible #fontSizeControl{
     --font-slider-progress:40%;
     -webkit-appearance:none;
     appearance:none;
     flex:1 1 auto;
     min-width:120px;
     height:6px;
     border-radius:999px;
     border:none;
     cursor:pointer;
     background:
       linear-gradient(
         to right,
         var(--reader-track-fill) 0,
         var(--reader-track-fill) var(--font-slider-progress),
         var(--reader-track) var(--font-slider-progress),
         var(--reader-track) 100%
       );
   }
   body.page-bible #fontSizeControl::-webkit-slider-runnable-track{
     height:6px;
     border-radius:999px;
     background:transparent;
   }
   body.page-bible #fontSizeControl::-webkit-slider-thumb{
     -webkit-appearance:none;
     appearance:none;
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
     margin-top:-6px;
   }
   body.page-bible #fontSizeControl::-moz-range-track{
     height:6px;
     border-radius:999px;
     background:var(--reader-track);
   }
   body.page-bible #fontSizeControl::-moz-range-progress{
     height:6px;
     border-radius:999px;
     background:var(--reader-track-fill);
   }
   body.page-bible #fontSizeControl::-moz-range-thumb{
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
   }
   body.page-bible #fontSizeValue{
     min-width:38px;
     font-size:12px;
     color:#4f677f;
     text-align:right;
   }
   body.page-bible .search-range-slider{
     --search-slider-progress:0%;
     -webkit-appearance:none;
     appearance:none;
     flex:1 1 auto;
     min-width:110px;
     height:6px;
     border-radius:999px;
     border:none;
     cursor:pointer;
     background:
       linear-gradient(
         to right,
         var(--reader-track-fill) 0,
         var(--reader-track-fill) var(--search-slider-progress),
         var(--reader-track) var(--search-slider-progress),
         var(--reader-track) 100%
       );
   }
   body.page-bible .search-range-slider::-webkit-slider-runnable-track{
     height:6px;
     border-radius:999px;
     background:transparent;
   }
   body.page-bible .search-range-slider::-webkit-slider-thumb{
     -webkit-appearance:none;
     appearance:none;
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
     margin-top:-6px;
   }
   body.page-bible .search-range-slider::-moz-range-track{
     height:6px;
     border-radius:999px;
     background:var(--reader-track);
   }
   body.page-bible .search-range-slider::-moz-range-progress{
     height:6px;
     border-radius:999px;
     background:var(--reader-track-fill);
   }
   body.page-bible .search-range-slider::-moz-range-thumb{
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
   }
   body.page-bible .range-field.is-disabled .search-range-slider{
     opacity:0.5;
   }
   
   body.page-bible .reader-theme-toggle{
     width:44px;
     min-width:44px;
     height:44px;
     border-radius:50%;
     border:1px solid var(--reader-theme-btn-border);
     background:var(--reader-theme-btn-bg);
     color:var(--reader-theme-btn-ink);
     display:inline-flex;
     align-items:center;
     justify-content:center;
     gap:0;
     padding:0;
     cursor:pointer;
     transition:background .18s ease, border-color .18s ease, color .18s ease;
   }
   body.page-bible .reader-theme-toggle:hover,
   body.page-bible .reader-theme-toggle:focus-visible{
     background:var(--reader-theme-btn-hover);
     border-color:var(--reader-theme-btn-hover-border);
   }
   body.page-bible .reader-theme-toggle:focus-visible{
     outline:2px solid rgba(15,62,102,0.28);
     outline-offset:2px;
   }
   body.page-bible .reader-theme-icon{
     width:22px;
     height:22px;
     stroke:currentColor;
     fill:none;
     stroke-width:1.9;
     stroke-linecap:round;
     stroke-linejoin:round;
   }
   body.page-bible .reader-theme-icon-sun{
     display:none;
   }
   body.page-bible.reader-dark-mode .reader-theme-icon-moon{
     display:none;
   }
   body.page-bible.reader-dark-mode .reader-theme-icon-sun{
     display:block;
   }
   body.page-bible.reader-dark-mode .reader-theme-toggle:focus-visible{
     outline:2px solid rgba(246,135,179,0.52);
   }
   
   @media (max-width:640px){
     body.page-bible .field-chapter-row{
       gap:8px;
     }
     body.page-bible .reader-controls-row{
       align-items:center;
       row-gap:10px;
     }
     body.page-bible .reader-font-select{
       min-width:96px;
       width:100%;
     }
     body.page-bible .reader-theme-toggle{
       width:40px;
       min-width:40px;
       height:40px;
     }
     body.page-bible #fontSizeValue{
       display:inline-block;
       min-width:34px;
       font-size:11px;
     }
   }
   @media (max-width:820px){
     body.page-bible .topbar .wrap{
       min-height:74px;
       padding:16px 14px;
     }
     body.page-bible .nav-toggle{
       width:34px;
       height:34px;
     }
     body.page-bible .nav-toggle span{
       width:22px;
       height:2.4px;
     }
     body.page-bible .nav-shell{
       padding:10px 18px 18px;
       gap:12px;
     }
     body.page-bible .nav-main a{
       padding:15px 2px;
       min-height:50px;
       display:flex;
       align-items:center;
     }
     body.page-bible .auth-slot .auth-login,
     body.page-bible .auth-slot .auth-logout{
       padding:15px 2px;
       min-height:50px;
       display:flex;
       align-items:center;
     }
     body.page-bible.reader-dark-mode .nav-shell{
       background:var(--app-dark-surface);
       border-top:1px solid var(--app-dark-border);
       box-shadow:0 18px 32px rgba(0,0,0,0.36);
     }
     body.page-bible.reader-dark-mode .nav-main a{
       color:#e2e8f0;
       border-bottom-color:#3d546b;
     }
     body.page-bible.reader-dark-mode .nav-main a.active{
       background:#2b3f56;
       color:#ffffff;
     }
     body.page-bible.reader-dark-mode .auth-slot .auth-login,
     body.page-bible.reader-dark-mode .auth-slot .auth-logout{
       color:#e2e8f0;
       border-bottom-color:#3d546b;
     }
   }
   
   /* =========================
      Bible Toolbar + Typography polish
      ========================= */
   body.page-bible .tab-toolbar{
     gap:6px;
     align-items:center;
   }
   body.page-bible .tab{
     white-space:nowrap;
   }
   body.page-bible .tab-reader-tools{
     display:flex;
     align-items:center;
     gap:7px;
     min-width:0;
   }
   body.page-bible .tab-reader-tools[hidden]{
     display:none !important;
   }
   body.page-bible .tab-font-control{
     width:clamp(114px, 19vw, 190px);
     min-width:114px;
     gap:5px;
   }
   body.page-bible .tab-reader-select{
     min-width:104px;
   }
   body.page-bible #fontSizeValue{
     color:#45617a;
   }
   body.page-bible.reader-dark-mode #fontSizeValue{
     color:#bfd2e4;
   }
   
   @media (max-width:860px){
     body.page-bible .tab-toolbar{
       flex-wrap:wrap;
       row-gap:6px;
     }
     body.page-bible .tab-toolbar .tab-list{
       width:100%;
       flex:1 1 100%;
     }
     body.page-bible .tab-reader-tools{
       width:100%;
       justify-content:flex-end;
       flex-wrap:nowrap;
     }
   }
   
   @media (max-width:720px){
     body.page-bible .tab{
       padding:8px 9px;
       font-size:14px;
     }
     body.page-bible .tab-reader-tools{
       gap:5px;
     }
     body.page-bible .reader-font-select{
       min-width:92px;
       height:36px;
     }
     body.page-bible .tab-font-control{
       min-width:98px;
       width:min(44vw, 170px);
     }
     body.page-bible #fontSizeValue{
       display:none;
     }
   }
   
   @media (max-width:560px){
     body.page-bible .tab-reader-tools{
       justify-content:flex-start;
     }
     body.page-bible .tab-font-control{
       min-width:88px;
       width:min(45vw, 150px);
     }
     body.page-bible .font-size-icon{
       display:none;
     }
     body.page-bible #fontSizeControl{
       min-width:76px;
     }
     body.page-bible .reader-theme-toggle{
       width:38px;
       min-width:38px;
       height:38px;
     }
   }
   
   /* Related/Search typography: follow reader font + size */
   body.page-bible #tab-related .related-subtitle,
   body.page-bible #tab-related .related-current,
   body.page-bible #tab-related .verse-text,
   body.page-bible #tab-search .search-ref,
   body.page-bible #tab-search .search-ref-text,
   body.page-bible #tab-search .search-text,
   body.page-bible #tab-search .search-meta,
   body.page-bible #tab-search .term-context-head,
   body.page-bible #tab-search .term-context-desc,
   body.page-bible #tab-search .term-context-example,
   body.page-bible #tab-search .term-context-alias{
     font-family:var(--reader-content-font);
   }
   body.page-bible #tab-related .related-subtitle{
     font-size:clamp(13px, calc(var(--reader-font-size, 16px) * 0.92), 17px);
     line-height:1.55;
   }
   body.page-bible #tab-search .search-ref{
     font-size:calc(var(--reader-font-size, 16px) * 0.9);
     line-height:var(--reader-line-height, 1.7);
   }
   body.page-bible #tab-search .term-context-head strong{
     font-size:20px;
     font-weight:800;
     line-height:1.1;
     letter-spacing:-0.02em;
     color:var(--tab-point);
   }
   body.page-bible #tab-search .term-context-tag{
     font-family:var(--reader-content-font);
   }
   body.page-bible #tab-search .term-context-desc,
   body.page-bible #tab-search .term-context-example,
   body.page-bible #tab-search .term-context-alias{
     font-size:calc(var(--reader-font-size, 16px) * 0.9);
     line-height:var(--reader-line-height, 1.7);
   }

   body.page-bible #tab-search .term-context-desc .context-note-desc-summary{
     margin:0 0 24px;
     padding:0;
   }

   body.page-bible #tab-search .term-context-desc .context-note-desc-summary .term-desc-lead{
     margin:0;
     color:color-mix(in srgb, currentColor 92%, #0b2235 8%);
     font-size:calc(16px + var(--bible-popover-font-size-delta, 0px));
     font-weight:700;
     letter-spacing:-0.005em;
     line-height:1.8;
   }

   body.page-bible #tab-search .term-context-desc .context-note-desc-sections{
     display:flex;
     flex-direction:column;
     gap:12px;
   }

   body.page-bible #tab-search .term-context-desc .term-desc-section + .term-desc-section{
     margin-top:3px;
     padding-top:0;
   }

   body.page-bible #tab-search .term-context-desc .term-desc-section-label{
     display:block;
     margin:4px 0 4px;
     color:#143f63;
     font-size:12px;
     font-weight:600;
     letter-spacing:0.01em;
     line-height:1.35;
   }

   body.page-bible #tab-search .term-context-desc .term-desc-section-body{
     display:block;
     margin:0;
     line-height:1.75;
   }

   body.page-bible #tab-search .term-context-item .context-note-synonyms{
     margin-top:16px;
   }

   body.page-bible #tab-search .term-context-item .context-note-synonyms-title{
     display:block;
     margin:0 0 7px;
     color:color-mix(in srgb, currentColor 74%, transparent);
     font-size:13px;
     font-weight:600;
     letter-spacing:0.01em;
     line-height:1.45;
   }
   
   /* Context note popup readability + related-tab-like buttons in dark mode */
   body.page-bible .context-note-head{
     border-bottom-color:#d7e4f1;
   }
   body.page-bible .context-note-badge{
     background:#ecf3fb;
     border-color:#c7dbef;
     color:#18466d;
   }
   body.page-bible .context-note-refs-title,
   body.page-bible .context-note-synonyms-title{
     color:#2b4f6e;
   }
   
   body.page-bible.reader-dark-mode .context-note-head{
     border-bottom-color:#4a6178;
   }
   body.page-bible.reader-dark-mode .context-note-badge{
     background:#2f435a;
     border-color:#5a7590;
     color:#eff5fb;
   }
   body.page-bible.reader-dark-mode .context-note-refs-title,
   body.page-bible.reader-dark-mode .context-note-synonyms-title{
     color:#e5eff9;
   }
   body.page-bible.reader-dark-mode .context-note-ref-link{
     background:transparent;
     border-color:#3d546b;
     color:#e1edf8;
   }
   body.page-bible.reader-dark-mode .context-note-ref-link:hover,
   body.page-bible.reader-dark-mode .context-note-ref-link:focus-visible{
     background:#2f435a;
   }
   
   body.page-bible.reader-dark-mode .related-filters{
     background:#1f2f41;
     border:1px solid #3d546b;
     border-radius:10px;
     padding:6px;
   }
   body.page-bible.reader-dark-mode .related-filter{
     background:transparent;
     border-color:#4f6b87;
     color:#cddff0;
   }
   body.page-bible.reader-dark-mode .related-filter.active{
     background:#2f435a;
     border-color:#6a88a5;
     color:#f1f5f9;
   }
   
   /* =========================
      Global Theme Toggle + App Dark Mode
      ========================= */
   .global-theme-toggle{
     width:42px;
     min-width:42px;
     height:42px;
     border-radius:50%;
     border:1px solid #d1dce8;
     background:#ffffff;
     color:#26435a;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     gap:0;
     padding:0;
     cursor:pointer;
     transition:background .18s ease, border-color .18s ease, color .18s ease;
   }
   .global-theme-toggle:hover,
   .global-theme-toggle:focus-visible{
     background:#eef3f8;
     border-color:#9fb5ca;
   }
   .global-theme-toggle:focus-visible{
     outline:2px solid rgba(15,62,102,0.28);
     outline-offset:2px;
   }
   .global-theme-icon{
     width:21px;
     height:21px;
     stroke:currentColor;
     fill:none;
     stroke-width:1.9;
     stroke-linecap:round;
     stroke-linejoin:round;
   }
   .global-theme-icon-sun{
     display:none;
   }
   .global-theme-toggle.is-dark .global-theme-icon-moon{
     display:none;
   }
   .global-theme-toggle.is-dark .global-theme-icon-sun{
     display:block;
   }
   .global-theme-label{
     display:none;
   }
   
   body.app-dark-mode{
     background:var(--app-dark-bg);
     color:var(--app-dark-text);
   }
   body.app-dark-mode:not(.page-bible){
     --bg:var(--app-dark-bg);
     --ink:var(--app-dark-text);
     --line:var(--app-dark-border);
     --muted:var(--app-dark-muted);
   }
   body.app-dark-mode .topbar{
     background:rgba(26,32,44,0.9);
     border-bottom:1px solid #344a61;
   }
   body.app-dark-mode .topbar.is-scrolled{
     background:rgba(26,32,44,0.96);
     border-bottom-color:#465c72;
     box-shadow:0 10px 22px rgba(0,0,0,0.28);
   }
   body.app-dark-mode .nav-toggle span{
     background:#e2e8f0;
   }
   body.app-dark-mode .nav-main a{
     color:#d4e0ec;
     opacity:.92;
   }
   body.app-dark-mode .nav-main a:hover{
     color:#ffffff;
   }
   body.app-dark-mode .nav-main a.active{
     color:#ffffff;
   }
   body.app-dark-mode .nav-main a.active::after{
     background:#D1A054;
   }
   body.app-dark-mode .auth-btn{
     color:#e2e8f0;
   }
   body.app-dark-mode .auth-login,
   body.app-dark-mode .auth-logout{
     background:transparent;
     border-color:#5b7490;
     color:#e2e8f0;
   }
   body.app-dark-mode .auth-btn:hover{
     color:#ffffff;
   }
   body.app-dark-mode .global-theme-toggle{
     background:#273447;
     border-color:#405569;
     color:#e2e8f0;
   }
   body.app-dark-mode .global-theme-toggle:hover,
   body.app-dark-mode .global-theme-toggle:focus-visible{
     background:#304256;
     border-color:#5c738a;
   }
   body.app-dark-mode .global-theme-toggle:focus-visible{
     outline:2px solid var(--app-point-soft);
   }
   body.app-dark-mode:not(.page-bible) .page-title .h1,
   body.app-dark-mode:not(.page-bible) .home-hero-copy h1,
   body.app-dark-mode:not(.page-bible) .home-main .section-heading h2,
   body.app-dark-mode:not(.page-bible) .about-copy h3,
   body.app-dark-mode:not(.page-bible) .location-copy h3,
   body.app-dark-mode:not(.page-bible) .worship-card h3,
   body.app-dark-mode:not(.page-bible) .ministry-card h3,
   body.app-dark-mode:not(.page-bible) .youtube-handle{
     color:#e2e8f0;
   }
   body.app-dark-mode:not(.page-bible) .home-kicker,
   body.app-dark-mode:not(.page-bible) .section-kicker{
     color:var(--app-point);
   }
   body.app-dark-mode:not(.page-bible) .home-hero-text,
   body.app-dark-mode:not(.page-bible) .about-copy p,
   body.app-dark-mode:not(.page-bible) .about-panel-card p,
   body.app-dark-mode:not(.page-bible) .about-panel-card li,
   body.app-dark-mode:not(.page-bible) .ministry-card p,
   body.app-dark-mode:not(.page-bible) .location-address,
   body.app-dark-mode:not(.page-bible) .location-copy dd,
   body.app-dark-mode:not(.page-bible) .auth-gate-desc,
   body.app-dark-mode:not(.page-bible) .auth-gate-status{
     color:#b7c7d7;
   }
   body.app-dark-mode .login-modal .auth-gate-card h2{
     color:#e2e8f0;
   }
   body.app-dark-mode .login-modal .auth-gate-legal{
     color:#9fb4c8;
   }
   body.app-dark-mode .login-modal .login-modal-close{
     color:#9fb4c8;
   }
   body.app-dark-mode .login-modal .login-modal-close:hover,
   body.app-dark-mode .login-modal .login-modal-close:focus-visible{
     color:#f8fafc;
   }
   body.app-dark-mode:not(.page-bible) .card,
   body.app-dark-mode:not(.page-bible) .auth-gate-card,
   body.app-dark-mode:not(.page-bible) .about-copy,
   body.app-dark-mode:not(.page-bible) .about-panel-card,
   body.app-dark-mode:not(.page-bible) .worship-card,
   body.app-dark-mode:not(.page-bible) .ministry-card,
   body.app-dark-mode:not(.page-bible) .location-copy,
   body.app-dark-mode:not(.page-bible) .location-map,
   body.app-dark-mode:not(.page-bible) .youtube-card{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     box-shadow:0 14px 28px rgba(0,0,0,0.28);
   }
   body.app-dark-mode:not(.page-bible) .field input,
   body.app-dark-mode:not(.page-bible) .field select,
   body.app-dark-mode:not(.page-bible) .field textarea{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode:not(.page-bible) .field input:focus,
   body.app-dark-mode:not(.page-bible) .field select:focus,
   body.app-dark-mode:not(.page-bible) .field textarea:focus{
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 2px color-mix(in srgb, var(--tab-point-soft) 28%, transparent);
   }
   body.app-dark-mode .field input[type="file"]::file-selector-button{
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--app-dark-bg) 12%);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .field input[type="file"]::file-selector-button:hover,
   body.app-dark-mode .field input[type="file"]::file-selector-button:focus-visible{
     background:color-mix(in srgb, var(--app-dark-surface) 76%, var(--tab-point-highlight) 24%);
     border-color:var(--tab-point-soft);
     color:var(--app-dark-text);
   }
   body.app-dark-mode:not(.page-bible) .site-footer{
     background:var(--app-dark-surface);
     color:#c7d6e6;
   }
   body.app-dark-mode:not(.page-bible) .site-footer a{
     color:#e6eef8;
   }
   
   /* Bible toolbar / memo button polishing */
   body.page-bible .tab-toolbar{
     gap:4px;
   }
   body.page-bible .tab-reader-tools{
     gap:6px;
   }
   body.page-bible .reader-my-memos-btn{
     width:46px;
     height:46px;
     min-width:46px;
     border:1px solid var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-muted);
   }
   body.page-bible .reader-my-memos-btn:hover,
   body.page-bible .reader-my-memos-btn:focus-visible{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
     color:var(--reader-text);
   }
   body.page-bible .reader-my-memos-icon{
     width:22px;
     height:22px;
   }
   body.page-bible.reader-dark-mode .reader-my-memos-btn{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   
   @media (max-width:820px){
     .global-theme-toggle{
       width:100%;
       min-width:0;
       height:auto;
       min-height:0;
       border:0;
       border-radius:0;
       background:transparent;
       color:var(--ink);
       justify-content:flex-start;
       padding:14px 0;
       border-bottom:1px solid var(--line);
     }
     .global-theme-icon{
       display:none;
     }
     .global-theme-label{
       display:inline;
       font-size:16px;
       font-weight:700;
       line-height:1.2;
     }
     body.app-dark-mode .nav-shell{
       background:var(--app-dark-surface);
       border-top:1px solid var(--app-dark-border);
       box-shadow:0 18px 32px rgba(0,0,0,0.36);
     }
     body.app-dark-mode .nav-main a{
       color:var(--app-dark-text);
       border-bottom-color:var(--app-dark-border);
     }
     body.app-dark-mode .nav-main a.active{
       background:#2b3f56;
       color:#ffffff;
     }
     body.app-dark-mode .auth-slot .auth-login,
     body.app-dark-mode .auth-slot .auth-logout{
       color:#e2e8f0;
       border-bottom-color:#3d546b;
     }
     body.app-dark-mode .global-theme-toggle{
       color:#e2e8f0;
       border-bottom-color:#3d546b;
     }
   }
   
   /* =========================
      2026-03 UI Fine Tuning (14/15/16/17)
      ========================= */
   
   /* 14.png: reader font controls under tabs, left-aligned, fixed size */
   body.page-bible .tab-toolbar{
     display:flex;
     flex-direction:column;
     align-items:flex-start;
     gap:8px;
   }
   body.page-bible .page-title{
     text-align:center;
   }
   body.page-bible .tab-toolbar .tab-list{
     width:100%;
     flex:0 0 auto;
   }
   body.page-bible .tab-reader-tools{
     width:auto;
     justify-content:flex-start;
     align-items:center;
     gap:8px;
     margin:0;
     overflow-x:auto;
     max-width:100%;
     flex-wrap:nowrap;
   }
   body.page-bible .tab-reader-select{
     width:132px;
     min-width:132px;
     max-width:132px;
   }
   body.page-bible .tab-font-control{
     width:224px;
     min-width:224px;
     max-width:224px;
   }
   body.page-bible #fontSizeControl{
     min-width:124px;
   }
   @media (max-width:560px){
     body.page-bible .tab-reader-select{
       width:132px;
       min-width:132px;
       max-width:132px;
     }
     body.page-bible .tab-font-control{
       width:224px;
       min-width:224px;
       max-width:224px;
     }
   }
   
   /* 15.png: keep chapter header strip style consistent on narrow screens */
   @media (max-width:640px){
     body.page-bible .chapter-fixed-title{
       background:var(--reader-panel-bg);
     }
     body.page-bible.reader-dark-mode .chapter-fixed-title{
       background:#223244;
     }
   }
   
   /* 16.png: compare mode dark-theme leakage fix */
   body.page-bible.reader-dark-mode .bible-reader.compare-active .bible-reader-compare{
     background:transparent;
   }
   body.page-bible.reader-dark-mode .compare-head{
     background:#27384b;
     border-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-pairs{
     background:#1e2d3e;
     border-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-chapter-title{
     background:#233447;
     color:#e2e8f0;
     border-bottom-color:rgba(226,232,240,0.2);
   }
   body.page-bible.reader-dark-mode .compare-titles{
     background:#223244 !important;
     border-bottom-color:#3d546b !important;
   }
   body.page-bible.reader-dark-mode .compare-titles .pair-side{
     border-right-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-heading-row{
     background:#223244;
     border-bottom-color:#3d546b;
   }
   body.page-bible.reader-dark-mode .compare-notes{
     background:#223244;
     border-bottom-color:rgba(226,232,240,0.16);
   }
   body.page-bible.reader-dark-mode .pair-side:first-child{
     background:#1f2f41;
     border-left-color:#7ea2c5;
   }
   body.page-bible.reader-dark-mode .pair-side:last-child{
     background:#243447;
     border-left-color:#5c738a;
   }
   body.page-bible.reader-dark-mode .pair-side.is-highlight{
     background:#5f4a2c;
     box-shadow:0 6px 16px rgba(0,0,0,0.35);
   }
   
   /* 17.png: bulletin/dream cards + hymn readability in dark mode */
   body.app-dark-mode .section.date-filter .filter-row label{
     background:#243447;
     border-color:#3d546b;
     box-shadow:none;
   }
   body.app-dark-mode .filter-row span{
     color:#c9d9ea;
   }
   body.app-dark-mode .filter-row select{
     color:#e2e8f0;
   }
   
   body.app-dark-mode .month-card{
     background:#202d3d;
     border-color:#3d546b;
     box-shadow:0 12px 24px rgba(0,0,0,0.26);
   }
   body.app-dark-mode .month-title,
   body.app-dark-mode .dream-date{
     color:#e2e8f0;
   }
   body.app-dark-mode .dream-note{
     color:#b7c7d7;
   }
   body.app-dark-mode .songlist{
     color:#d0deec;
   }
   body.app-dark-mode .special-link{
     color:#dce9f7;
     background:#273b52;
     border-color:#4b6279;
   }
   body.app-dark-mode .special-link:hover{
     background:#2f435a;
   }
   body.app-dark-mode .week-buttons .btn,
   body.app-dark-mode .chip{
     color:#d6e5f4;
     background:#243447;
     border-color:#4b6279;
   }
   body.app-dark-mode .week-buttons .btn:hover,
   body.app-dark-mode .chip:hover{
     background:#2f435a;
     color:#f5f8fc;
     border-color:#6a88a5;
   }
   
   body.app-dark-mode .hymn-search-input{
     background:#243447;
     border-color:#415971;
     color:#e2e8f0;
     box-shadow:none;
   }
   body.app-dark-mode .hymn-search-status{
     color:#c5d7ea;
   }
   body.app-dark-mode .hymn-search-option{
     background:#243447;
     border-color:#415971;
     color:#dbe8f5;
   }
   body.app-dark-mode .hymn-result{
     background:#1f2f41;
     border-color:#3d546b;
     color:#dce9f7;
   }
   body.app-dark-mode .hymn-result:hover{
     background:#2a3c52;
     border-color:#637f9a;
   }
   body.app-dark-mode .hymn-result.is-active{
     background:#2f435a;
     color:#f5f8fc;
     border-color:#6a88a5;
   }
   body.app-dark-mode .hymn-viewer-title{
     color:#e8f1fb;
   }
   body.app-dark-mode .hymn-viewer-lyrics{
     color:#d0deec;
   }
   body.app-dark-mode .hymn-viewer-placeholder{
     color:#afc2d6;
   }
   body.app-dark-mode .hymn-viewer img{
     background:#233447;
     border-color:#425a71;
     box-shadow:0 16px 30px rgba(0,0,0,0.35);
   }
   
   /* =========================
      2026-03 Follow-up Fixes
      ========================= */
   
   /* Prevent dark-mode flash before include.js finishes. */
   html.app-dark-mode{
     background:var(--app-dark-bg);
     color-scheme:dark;
   }
   html.app-dark-mode body{
     background:var(--app-dark-bg);
     color:var(--app-dark-text);
   }
   
   /* Hamburger menu: text only for theme item (no leading icon). */
   @media (max-width:820px){
     .topbar .global-theme-toggle{
       gap:0;
     }
     .topbar .global-theme-toggle .global-theme-icon{
       display:none !important;
     }
     body.app-dark-mode .topbar .nav-shell,
     body.app-dark-mode .topbar.menu-open .nav-shell{
       background:var(--app-dark-surface);
       border-top-color:var(--app-dark-border);
       box-shadow:0 18px 32px rgba(0,0,0,0.36);
     }
     body.app-dark-mode .topbar .nav-main a{
       color:var(--app-dark-text);
       border-bottom-color:var(--app-dark-border);
     }
     body.app-dark-mode .topbar .nav-main a.active{
       background:rgba(255,255,255,0.08);
       color:var(--app-dark-text);
     }
   }
   
   /* 18.png #1: keep tab title/font UI stable while resizing */
   body.page-bible .tab{
     font-size:16px;
     padding:10px 14px;
   }
   body.page-bible .tab-toolbar{
     width:100%;
     min-width:0;
   }
   body.page-bible .tab-toolbar .tab-list{
     width:100%;
     min-width:0;
     flex-wrap:nowrap;
     overflow-x:auto;
   }
   body.page-bible .tab-reader-tools{
     width:100%;
     min-width:0;
     max-width:100%;
     overflow-x:hidden;
     flex-wrap:nowrap;
   }
   body.page-bible .font-size-icon{
     display:inline-flex !important;
     align-items:center;
   }
   body.page-bible #fontSizeValue{
     display:inline-block !important;
   }
   
   /* 18.png #2: chapter select height matches other selects */
   body.page-bible .reader-controls .select-controls{
     display:grid;
     grid-template-columns:minmax(124px, 1fr) minmax(260px, 1.65fr) minmax(186px, 1.25fr);
     align-items:center;
     gap:10px;
   }
   body.page-bible .reader-controls .select-controls .field{
     min-width:0;
     gap:0;
   }
   body.page-bible .reader-controls .select-controls .field > .field-label,
   body.page-bible .reader-controls .select-controls .field-chapter-wrap > .field-label{
     display:none;
   }
   body.page-bible .reader-controls .select-controls .field-book,
   body.page-bible .reader-controls .select-controls .field-chapter-wrap{
     min-width:0;
   }
   body.page-bible .select-controls .field select{
     height:44px;
   }
   body.page-bible #bibleVersion,
   body.page-bible #bibleBook,
   body.page-bible #bibleChapter{
     height:44px;
   }
   body.page-bible .field-chapter-row{
     align-items:center;
     gap:6px;
   }
   body.page-bible .reader-my-memos-btn{
     height:44px;
     min-width:44px;
     width:44px;
   }
   @media (max-width:720px){
     body.page-bible .reader-controls .select-controls{
       grid-template-columns:1fr 1.05fr 1fr;
       align-items:center;
       gap:8px;
     }
     body.page-bible .reader-controls .select-controls .field-version{
       max-width:none;
     }
     body.page-bible .reader-controls .select-controls .field-chapter-wrap{
       min-width:0;
     }
     body.page-bible #bibleVersion,
     body.page-bible #bibleBook,
     body.page-bible #bibleChapter{
       height:38px;
       font-size:12.5px;
       padding:0 8px;
     }
     body.page-bible .field-chapter-row{
       gap:5px;
     }
     body.page-bible .reader-my-memos-btn{
       width:36px;
       min-width:36px;
       height:36px;
     }
   }
   @media (max-width:420px){
     body.page-bible .reader-controls .select-controls{
       grid-template-columns:0.95fr 1.1fr 0.95fr;
       gap:6px;
     }
     body.page-bible #bibleVersion,
     body.page-bible #bibleBook,
     body.page-bible #bibleChapter{
       height:36px;
       font-size:12px;
       padding:0 7px;
     }
     body.page-bible .reader-my-memos-btn{
       width:34px;
       min-width:34px;
       height:34px;
     }
   }
   @media (max-width:360px){
     body.page-bible .reader-controls .select-controls{
       grid-template-columns:0.9fr 1.15fr 0.95fr;
       gap:5px;
     }
     body.page-bible #bibleVersion,
     body.page-bible #bibleBook,
     body.page-bible #bibleChapter{
       font-size:11.5px;
       padding:0 6px;
     }
   }
   
   /* =========================
      2026-03 Theme + Parallel Refactor
      ========================= */
   
   /* Dark-mode accent: muted gold (replace high-chroma pink usage). */
   body.page-bible.reader-dark-mode{
     --reader-point:var(--app-point);
     --reader-point-soft:var(--app-point-soft);
     --reader-track-fill:var(--app-point-soft);
     --memo-verse-gutter:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .nav-main a.active::after{
     background:var(--app-point);
   }
   body.page-bible.reader-dark-mode .tab:hover{
     border-bottom-color:color-mix(in srgb, var(--app-point-soft) 60%, transparent);
   }
   body.page-bible.reader-dark-mode .tab.active{
     border-bottom-color:var(--app-point);
   }
   body.page-bible.reader-dark-mode .compare-wrap input[type="checkbox"]{
     accent-color:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .reader-theme-toggle:focus-visible{
     outline:2px solid color-mix(in srgb, var(--app-point-soft) 70%, transparent);
   }
   body.page-bible.reader-dark-mode .context-trigger,
   body.page-bible.reader-dark-mode .note-context-trigger{
     color:#D9B57A;
     background:rgba(209,160,84,0.1);
   }
   body.page-bible.reader-dark-mode .context-trigger:hover,
   body.page-bible.reader-dark-mode .context-trigger:focus-visible,
   body.page-bible.reader-dark-mode .note-context-trigger:hover,
   body.page-bible.reader-dark-mode .note-context-trigger:focus-visible{
     background:rgba(209,160,84,0.16);
     color:#E7C995;
   }
   body.page-bible.reader-dark-mode .search-text mark,
   body.page-bible.reader-dark-mode .chat-citation p mark{
     background:rgba(209,160,84,0.16);
     color:inherit;
     border-radius:4px;
   }
   
   /* Parallel view: reduce vertical barrier, align as row-cards, unified hover. */
   body.page-bible #readerCompare,
   body.page-bible #readerCompare .compare-pairs,
   body.page-bible #readerCompare .pair-side,
   body.page-bible #readerCompare .verse-text{
     font-family:var(--reader-content-font);
   }
   body.page-bible .compare-head{
     position:sticky;
     top:0;
     z-index:14;
   }
   body.page-bible .compare-verse-row{
     border:1px solid rgba(15,62,102,0.08);
     border-radius:10px;
     margin:4px 0;
     transition:background .18s ease, border-color .18s ease;
   }
   body.page-bible .compare-verse-row .pair-side{
     border-right-color:transparent;
   }
   body.page-bible.reader-dark-mode .compare-verse-row{
     border-color:#2D3748;
   }
   body.page-bible.reader-dark-mode .compare-verse-row .pair-side{
     border-right-color:#2D3748;
   }
   body.page-bible.reader-dark-mode .compare-head{
     border-color:#2D3748;
     box-shadow:0 1px 0 #2D3748;
   }
   
   /* Compare memo indicator: slim 2px vertical bar on both columns. */
   body.page-bible .pair-side.has-memo{
     position:relative;
     padding-left:12px;
   }
   body.page-bible .pair-side.has-memo::before{
     content:"";
     position:absolute;
     left:3px;
     top:6px;
     bottom:6px;
     width:2px;
     border-radius:999px;
     background:var(--memo-verse-gutter);
   }
   
   /* =========================
      Theme Options Modal + Dynamic Dark Theme Vars
      ========================= */
   :root{
     --app-dark-bg:#1A202C;
     --app-dark-surface:#202D3D;
     --app-dark-border:#344A61;
     --app-dark-text:#E2E8F0;
     --app-dark-muted:#9FB0C3;
     --app-point:#D1A054;
     --app-point-soft:#B69158;
     --app-point-underline:#D9B57A;
     --app-point-highlight:rgba(209,160,84,0.16);
   }
   
   body.theme-options-open{
     overflow:hidden;
   }
   
   .theme-options-modal{
     position:fixed;
     inset:0;
     z-index:2400;
     display:flex;
     align-items:center;
     justify-content:center;
     padding:20px;
     background:rgba(15,23,42,0.42);
     backdrop-filter:blur(2px);
   }
   .theme-options-modal[hidden]{
     display:none !important;
   }
  .theme-options-panel{
    box-sizing:border-box;
    width:min(660px, 100%);
    max-height:min(86vh, 720px);
    overflow:auto;
    background:#ffffff;
    border:1px solid #d9e3ee;
    border-radius:16px;
    box-shadow:0 28px 56px rgba(2,12,27,0.26);
    padding:18px 18px 16px;
    position:relative;
  }
   .theme-options-head{
     margin-bottom:10px;
   }
   .theme-options-title{
     font-size:18px;
     font-weight:800;
     color:#0f3e66;
   }
  .theme-options-close{
    border:1px solid #ced9e5;
    background:#f8fbff;
    color:#33536d;
    border-radius:10px;
    padding:0;
    font-size:20px;
    font-weight:700;
    position:absolute;
    top:10px;
    right:10px;
    margin:0;
    flex:0 0 auto;
  }
   .theme-options-close:hover,
   .theme-options-close:focus-visible{
     background:#edf3fa;
     border-color:#b9cbde;
   }
   .theme-options-section{
     margin-top:12px;
   }
   .theme-options-section.is-disabled{
     opacity:.52;
   }
   .theme-options-label{
     margin:0 0 8px;
     font-size:13px;
     font-weight:800;
     color:#3f5d76;
   }
   .mobile-shortcut-section,
   .mobile-theme-section-label{
     display:none;
   }
   @media (max-width: 960px){
     .mobile-shortcut-section{
       display:block;
       padding-bottom:16px;
       border-bottom:1px solid #d3deea;
     }
     .mobile-theme-section-label{
       display:block;
       margin-top:18px;
     }
   }
   .mobile-shortcut-status,
   .mobile-shortcut-instructions{
     margin:8px 0;
     font-size:14px;
     line-height:1.5;
   }
   .mobile-shortcut-status:empty,
   .mobile-shortcut-instructions:empty{
     display:none;
   }
   .mobile-shortcut-button{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     min-height:44px;
     padding:9px 14px;
     border:1px solid var(--app-point);
     border-radius:10px;
     background:var(--app-point);
     color:#fff;
     font:inherit;
     font-weight:700;
     text-decoration:none;
     cursor:pointer;
   }
   .mobile-shortcut-button[hidden]{
     display:none;
   }
   .mobile-shortcut-button:focus-visible{
     outline:2px solid var(--app-point);
     outline-offset:2px;
   }
   .mobile-shortcut-button:disabled{
     opacity:.6;
     cursor:wait;
   }
   body.app-dark-mode .mobile-shortcut-section{
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode .mobile-shortcut-button{
     color:#172335;
   }
   .theme-options-row{
     display:flex;
     flex-wrap:wrap;
     gap:8px;
   }
   .theme-option-chip{
     border:1px solid #d3deea;
     background:#ffffff;
     color:#29465f;
     border-radius:999px;
     padding:7px 12px;
     min-height:34px;
     display:inline-flex;
     align-items:center;
     gap:8px;
     font-size:13px;
     font-weight:700;
     cursor:pointer;
     transition:background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
   }
   .theme-option-chip:hover,
   .theme-option-chip:focus-visible{
     background:#f4f8fd;
     border-color:#b8cadc;
   }
   .theme-option-chip.is-active{
     border-color:var(--app-point-soft);
     color:#1f3447;
     box-shadow:0 0 0 2px var(--app-point-highlight);
   }
   .theme-option-chip:disabled{
     opacity:.55;
     cursor:not-allowed;
     box-shadow:none !important;
   }
   .theme-option-swatch{
     width:14px;
     height:14px;
     border-radius:999px;
     border:1px solid rgba(15,23,42,0.16);
     flex:none;
   }
   .theme-option-text{
     line-height:1;
   }
   
   body.app-dark-mode{
     background:var(--app-dark-bg);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .topbar{
     background:var(--app-dark-bg);
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode .topbar.is-scrolled{
     background:var(--app-dark-bg);
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode .nav-main a{
     color:var(--app-dark-text);
   }
   body.app-dark-mode .nav-main a.active::after{
     background:var(--app-point);
   }
   body.app-dark-mode .global-theme-toggle:focus-visible{
     outline:2px solid var(--app-point-soft);
   }
   body.app-dark-mode .theme-options-panel{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .theme-options-title{
     color:var(--app-dark-text);
   }
   body.app-dark-mode .theme-options-label{
     color:var(--app-dark-muted);
   }
   body.app-dark-mode .theme-options-close{
     background:#273447;
     border-color:#465b70;
     color:var(--app-dark-text);
   }
   body.app-dark-mode .theme-options-close:hover,
   body.app-dark-mode .theme-options-close:focus-visible{
     background:#304256;
     border-color:#5d7287;
   }
   body.app-dark-mode .theme-option-chip{
     background:#263547;
     border-color:#425a71;
     color:var(--app-dark-text);
   }
   body.app-dark-mode .theme-option-chip:hover,
   body.app-dark-mode .theme-option-chip:focus-visible{
     background:#2f4257;
     border-color:#5c738a;
   }
   body.app-dark-mode .theme-option-chip.is-active{
     border-color:var(--app-point-soft);
     box-shadow:0 0 0 2px var(--app-point-highlight);
   }
   body.app-dark-mode .theme-option-chip:disabled{
     opacity:.45;
   }
   body.app-dark-mode .theme-option-swatch{
     border-color:rgba(226,232,240,0.35);
   }
   
   body.page-bible .compare-verse-row.has-memo{
     border-color:var(--memo-verse-gutter);
   }
   body.page-bible.reader-dark-mode{
     --reader-bg:var(--app-dark-bg);
     --reader-card-bg:var(--app-dark-surface);
     --reader-card-border:var(--app-dark-border);
     --reader-panel-bg:var(--app-dark-surface);
     --reader-text:var(--app-dark-text);
     --reader-muted:var(--app-dark-muted);
     --reader-point:var(--app-point);
     --reader-point-soft:var(--app-point-soft);
     --reader-track-fill:var(--app-point-soft);
     --memo-verse-gutter:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .topbar{
     background:var(--app-dark-bg);
     border-bottom-color:var(--app-dark-border);
   }
   body.page-bible.reader-dark-mode .topbar.is-scrolled{
     background:var(--app-dark-bg);
     border-bottom-color:var(--app-dark-border);
   }
   body.page-bible.reader-dark-mode .context-trigger,
   body.page-bible.reader-dark-mode .note-context-trigger{
     color:var(--app-point-underline);
     background:transparent;
   }
   body.page-bible.reader-dark-mode .context-trigger:hover,
   body.page-bible.reader-dark-mode .context-trigger:focus-visible,
   body.page-bible.reader-dark-mode .note-context-trigger:hover,
   body.page-bible.reader-dark-mode .note-context-trigger:focus-visible{
     background:var(--app-point-highlight);
     color:var(--app-point-underline);
   }
   body.page-bible.reader-dark-mode .search-text mark,
   body.page-bible.reader-dark-mode .chat-citation p mark{
     background:var(--app-point-highlight);
   }
   /* Show point-color change in light mode as well. */
   body:not(.app-dark-mode) .nav-main a.active::after{
     background:var(--app-point-soft);
   }
   body.page-bible:not(.reader-dark-mode) .tab.active{
     color:var(--tab-point);
     border-bottom-color:var(--app-point-soft);
   }
   body.page-bible:not(.reader-dark-mode) .compare-wrap input[type="checkbox"]{
     accent-color:var(--app-point-soft);
   }
   
   /* =========================
      2026-03 Hymn/Admin Dark-Theme Fixes
      ========================= */
   .hymn-search .voice-btn{
     min-width:46px;
     min-height:46px;
     border-radius:12px;
     border:1.5px solid color-mix(in srgb, var(--tab-point-soft) 40%, var(--line) 60%);
     background:color-mix(in srgb, var(--surface-bg) 90%, var(--tab-point-highlight) 10%);
     color:var(--tab-point);
     box-shadow:0 6px 18px color-mix(in srgb, var(--tab-point) 20%, transparent);
   }
   .hymn-search .voice-btn:hover,
   .hymn-search .voice-btn:focus-visible{
     background:color-mix(in srgb, var(--surface-bg) 72%, var(--tab-point-highlight) 28%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   .hymn-search .voice-btn:focus-visible{
     outline:2px solid color-mix(in srgb, var(--tab-point-soft) 58%, transparent);
     outline-offset:2px;
   }
   .hymn-search .voice-btn .voice-btn-icon-svg{
     width:20px;
     height:20px;
     display:block;
     stroke:currentColor;
     fill:none;
     stroke-width:2;
     stroke-linecap:round;
     stroke-linejoin:round;
     margin:0 auto;
   }
   body.app-dark-mode .hymn-search-option{
     background:#243447;
     border-color:#415971;
     color:#e2e8f0;
   }
   body.app-dark-mode .hymn-search-option span{
     color:#e2e8f0;
   }
   body.app-dark-mode .hymn-search-option input{
     accent-color:var(--app-point-soft);
   }
   body.app-dark-mode .hymn-search-option input:checked + span{
     color:var(--app-point);
     font-weight:800;
   }
   body.app-dark-mode .hymn-search-option:hover{
     background:color-mix(in srgb, var(--app-dark-surface) 74%, var(--app-point-highlight) 26%);
     border-color:var(--app-point-soft);
   }
   body.app-dark-mode .hymn-search .voice-btn{
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--app-dark-bg) 12%);
     border-color:var(--app-dark-border);
     color:var(--app-point-soft);
     box-shadow:none;
   }
   body.app-dark-mode .hymn-search .voice-btn .voice-btn-icon-svg{
     stroke:var(--app-point-soft);
     stroke-width:2.3;
   }
   body.app-dark-mode .hymn-search .voice-btn:hover,
   body.app-dark-mode .hymn-search .voice-btn:focus-visible{
     background:color-mix(in srgb, var(--app-dark-surface) 76%, var(--app-point-highlight) 24%);
     border-color:var(--app-point-soft);
     color:var(--app-point-soft);
   }
   body.app-dark-mode .hymn-search .voice-btn:focus-visible{
     outline:2px solid var(--app-point-soft);
   }
   body.app-dark-mode .hymn-search .voice-btn.is-recording{
     background:rgba(209,160,84,0.14);
     border-color:var(--app-point-soft);
     color:var(--app-point);
   }
   
   body.app-dark-mode.admin-page .admin-card{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     box-shadow:0 16px 30px rgba(0,0,0,0.3);
   }
   body.app-dark-mode.admin-page .admin-status{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-table-wrap{
     border-color:var(--app-dark-border);
     background:var(--app-dark-surface);
   }
   body.app-dark-mode.admin-page .admin-table{
     background:var(--app-dark-surface);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-table th{
     background:var(--app-dark-surface);
     color:var(--app-dark-text);
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-table td{
     color:var(--app-dark-text);
     border-bottom-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-role-select{
     background:#243447;
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-table tbody tr:nth-child(even){
     background:rgba(59,88,114,0.14);
   }
   body.app-dark-mode.admin-page .admin-table tbody tr:hover{
     background:var(--app-point-highlight);
   }
   body.app-dark-mode.admin-page .admin-table .auth-btn,
   body.app-dark-mode.admin-page #adminRefreshBtn{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-table .auth-btn:hover,
   body.app-dark-mode.admin-page #adminRefreshBtn:hover{
     background:#2f435a;
     border-color:#6a88a5;
     color:#ffffff;
   }
   body.app-dark-mode.admin-page .admin-event-head h2,
   body.app-dark-mode.admin-page .admin-event-form h3,
   body.app-dark-mode.admin-page .admin-prompt-helper h3{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-note{
     color:var(--app-dark-muted);
   }
   body.app-dark-mode.admin-page .admin-event-item,
   body.app-dark-mode.admin-page .admin-event-form,
   body.app-dark-mode.admin-page .admin-prompt-helper{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-event-empty,
   body.app-dark-mode.admin-page .admin-prompt-list li{
     background:rgba(59,88,114,0.14);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-event-handle{
     background:rgba(59,88,114,0.18);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-event-date,
   body.app-dark-mode.admin-page .admin-event-tag{
     color:var(--app-point);
   }
   body.app-dark-mode.admin-page .admin-event-tag{
     background:rgba(209,160,84,0.14);
   }
   body.app-dark-mode.admin-page .admin-event-meta strong,
   body.app-dark-mode.admin-page .admin-event-meta p,
   body.app-dark-mode.admin-page .admin-event-empty,
   body.app-dark-mode.admin-page .admin-form-grid label,
   body.app-dark-mode.admin-page .admin-prompt-list code,
   body.app-dark-mode.admin-page .admin-prompt-text{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-search-toolbar label,
   body.app-dark-mode.admin-page .admin-search-metric span{
     color:var(--app-dark-muted);
   }
   body.app-dark-mode.admin-page .admin-search-toolbar select,
   body.app-dark-mode.admin-page .admin-search-metric,
   body.app-dark-mode.admin-page .admin-search-section .admin-table-wrap{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-search-metric strong,
   body.app-dark-mode.admin-page .admin-search-section-head h3{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-form-grid input,
   body.app-dark-mode.admin-page .admin-form-grid textarea{
     background:#243447;
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-dream-item,
   body.app-dark-mode.admin-page .admin-dream-form{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-dream-toolbar label,
   body.app-dark-mode.admin-page .admin-dream-visibility-control{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-dream-toolbar input,
   body.app-dark-mode.admin-page .admin-dream-form input[type="date"]{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
     color-scheme:dark;
   }
   body.app-dark-mode.admin-page .admin-dream-toolbar input::placeholder{
     color:var(--app-dark-muted);
   }
   body.app-dark-mode.admin-page .admin-dream-item:hover,
   body.app-dark-mode.admin-page .admin-dream-item:focus-visible,
   body.app-dark-mode.admin-page .admin-dream-item.active{
     background:rgba(59,88,114,0.18);
     border-color:#6a88a5;
   }
   body.app-dark-mode.admin-page .admin-dream-item-date,
   body.app-dark-mode.admin-page .admin-dream-block strong{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-dream-item-meta,
   body.app-dark-mode.admin-page .admin-dream-readonly,
   body.app-dark-mode.admin-page .admin-dream-block p,
   body.app-dark-mode.admin-page .admin-dream-bullets,
   body.app-dark-mode.admin-page .admin-dream-links,
   body.app-dark-mode.admin-page .admin-dream-links code,
   body.app-dark-mode.admin-page .admin-dream-empty{
     color:var(--app-dark-muted);
   }
   body.app-dark-mode.admin-page .admin-dream-empty{
     background:rgba(59,88,114,0.14);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode.admin-page .admin-dream-action-type{
     color:var(--app-point);
   }
   body.app-dark-mode.admin-page .admin-bulletin-row .admin-user-input{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-bulletin-readonly{
     background:#1f2937;
     color:var(--app-dark-muted);
   }
   
   /* =========================
      2026-03 Theme Consistency Hotfix
      ========================= */
   @media (max-width:820px){
     .global-theme-toggle .global-theme-label{
       color:var(--app-point-soft);
     }
     body.app-dark-mode .global-theme-toggle .global-theme-label{
       color:var(--app-point);
     }
   }
   
   body.app-dark-mode:not(.page-bible),
   body.app-dark-mode:not(.page-bible) main{
     background-color:var(--app-dark-bg);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .filter-row label{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode .filter-row span,
   body.app-dark-mode .filter-row select{
     color:var(--app-dark-text);
   }
   body.app-dark-mode select{
     color-scheme:dark;
   }
   body.app-dark-mode select option,
   body.app-dark-mode select optgroup{
     background:var(--app-dark-surface);
     color:var(--app-dark-text);
   }
   body.app-dark-mode .month-card,
   body.app-dark-mode .hymn-search-input,
   body.app-dark-mode .hymn-search-option,
   body.app-dark-mode .hymn-result,
   body.app-dark-mode .special-link,
   body.app-dark-mode .week-buttons .btn,
   body.app-dark-mode .chip{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode .hymn-result:hover,
   body.app-dark-mode .hymn-result.is-active,
   body.app-dark-mode .special-link:hover,
   body.app-dark-mode .week-buttons .btn:hover,
   body.app-dark-mode .chip:hover{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
   }
   
   body.page-bible.reader-dark-mode .field select,
   body.page-bible.reader-dark-mode .field input,
   body.page-bible.reader-dark-mode .field textarea,
   body.page-bible.reader-dark-mode .reader-font-select{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   body.page-bible.reader-dark-mode .chapter-fixed-title{
     background:var(--reader-panel-bg);
     color:var(--reader-text);
   }
   body.page-bible.reader-dark-mode .compare-head,
   body.page-bible.reader-dark-mode .compare-titles,
   body.page-bible.reader-dark-mode .compare-heading-row,
   body.page-bible.reader-dark-mode .compare-notes{
     background:var(--reader-card-bg) !important;
     border-color:var(--reader-card-border) !important;
   }
   body.page-bible.reader-dark-mode .compare-pairs,
   body.page-bible.reader-dark-mode .pair-side:first-child,
   body.page-bible.reader-dark-mode .pair-side:last-child{
     background:var(--reader-panel-bg);
     border-color:var(--reader-card-border);
   }
   body.page-bible.reader-dark-mode .pair-side:first-child,
   body.page-bible.reader-dark-mode .pair-side:last-child{
     border-left:none;
   }
   body.page-bible.reader-dark-mode .compare-verse-row.has-memo{
     border-color:#2D3748;
   }
   body.page-bible.reader-dark-mode .related-list-wrap,
   body.page-bible.reader-dark-mode .related-filters,
   body.page-bible.reader-dark-mode .related-current{
     background:var(--reader-panel-bg);
     border-color:var(--reader-card-border);
   }
   body.page-bible.reader-dark-mode .related-filter{
     border-color:var(--reader-card-border);
   }
   body.page-bible.reader-dark-mode .related-filter.active{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
   }
   body.page-bible.reader-dark-mode .related-ref-item{
     background:var(--reader-panel-bg);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   body.page-bible.reader-dark-mode .related-ref-item:hover,
   body.page-bible.reader-dark-mode .related-ref-item:focus-visible,
   body.page-bible.reader-dark-mode .related-ref-item.active{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
     color:var(--reader-text);
   }
   
   body.app-dark-mode .hymn-search .voice-btn .voice-btn-icon-svg{
     stroke:#f8fafc;
     stroke-width:2.4;
     filter:drop-shadow(0 1px 2px rgba(0,0,0,0.45));
   }
   
   /* =========================
      2026-03 Theme Propagation Hardening
      ========================= */
   body.app-dark-mode:not(.page-bible),
   body.app-dark-mode:not(.page-bible) main,
   body.app-dark-mode:not(.page-bible) .section{
     background:var(--app-dark-bg);
     color:var(--app-dark-text);
   }
   
   body.app-dark-mode .section.date-filter .filter-row label{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.app-dark-mode .filter-row select{
     background:var(--app-dark-surface);
     color:var(--app-dark-text);
     color-scheme:dark;
   }
   body.app-dark-mode .filter-row select option,
   body.app-dark-mode .filter-row select optgroup{
     background:var(--app-dark-surface) !important;
     color:var(--app-dark-text) !important;
   }
   
   body.page-bible .reader-my-memos-btn{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     color:var(--reader-muted);
   }
   body.page-bible .reader-my-memos-btn:hover,
   body.page-bible .reader-my-memos-btn:focus-visible{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
     color:var(--reader-text);
   }
   body.page-bible.reader-dark-mode .reader-my-memos-btn{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   
   body.app-dark-mode.admin-page,
   body.app-dark-mode.admin-page main,
   body.app-dark-mode.admin-page .section{
     background:var(--app-dark-bg);
   }
   body.app-dark-mode.admin-page .page-title .h1,
   body.app-dark-mode.admin-page .admin-status{
     color:var(--app-dark-text);
   }
   body.app-dark-mode.admin-page .admin-table th{
     background:rgba(255,255,255,0.03);
   }
   
   body:not(.app-dark-mode) .hymn-search-option input{
     accent-color:var(--app-point-soft);
   }
   body:not(.app-dark-mode) .hymn-search-option:hover{
     border-color:var(--app-point-soft);
   }
   body:not(.app-dark-mode) .hymn-search-option input:checked + span{
     color:var(--app-point-soft);
   }
   
   /* =========================
      2026-03 Bible Theme Finalization
      ========================= */
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .reader-nav .btn-pill,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-reader-nav .btn-pill{
     background:var(--app-dark-surface) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .reader-nav .btn-pill:not(:disabled):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-reader-nav .btn-pill:not(:disabled):hover{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .reader-nav .btn-pill:disabled,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-reader-nav .btn-pill:disabled{
     background:rgba(148,163,184,0.16) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-muted) !important;
   }
   
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .field-caption{
     color:var(--app-dark-muted) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .field-caption strong{
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .caption-term{
     color:var(--app-point-underline) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-status,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-section h2,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-ref,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-text,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-head,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-desc{
     --term-desc-label-bg:rgba(226, 232, 240, 0.12);
     --term-desc-label-text:#dbeafe;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-desc .term-desc-section-label,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-related .related-description .term-desc-section-label{
     color:#f3f8ff;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-meta,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-example,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-alias{
     color:var(--app-dark-muted) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-item,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-item,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .range-field,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .field-checkbox{
     background:var(--app-dark-surface) !important;
     border-color:var(--app-dark-border) !important;
     box-shadow:none !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-item[data-clickable="reader"]:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-item[data-clickable="related"]:hover{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-item.clickable:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .term-context-item.clickable:focus-visible{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-version-badge{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .search-text mark{
     background:var(--app-point-highlight) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .voice-btn{
     background:var(--app-dark-surface) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .voice-btn:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .voice-btn:focus-visible{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-search .voice-btn .voice-btn-icon{
     filter:brightness(0) saturate(100%) invert(90%) sepia(7%) saturate(293%) hue-rotate(175deg) brightness(97%) contrast(92%) !important;
   }
   
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-panel,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-panel,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover{
     background:#313d4f !important;
     background:color-mix(in srgb, var(--app-dark-surface) 86%, #ffffff 14%) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
     box-shadow:0 20px 40px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 255, 255, 0.08) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover::before,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover::before{
     border-color:transparent transparent #313d4f transparent !important;
     filter:none !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover::before{
     border-color:transparent transparent #313d4f transparent !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-status,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-ref,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-preview,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-head strong,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-refs-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-synonyms-title{
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-meta{
     color:var(--app-dark-muted) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .btn-popup-close,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .btn-popup-close,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-actions .btn-secondary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-filters .btn-secondary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-more,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-more-btn{
     background:var(--app-dark-surface) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-actions .btn-primary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-filters .btn-primary{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-input,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-select,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-recent,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-search{
     background:var(--app-dark-surface) !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-list{
     border-color:var(--app-dark-border) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-item{
     background:var(--app-dark-surface) !important;
     border-bottom-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-item:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-item:focus-visible{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-delete{
     background:transparent !important;
     color:#fecaca !important;
   }
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-delete:hover,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-delete:focus-visible{
     background:rgba(248, 113, 113, 0.16) !important;
     color:#fee2e2 !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-updated,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-created,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-clicked,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover-example,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover .note-popover-example,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-example{
     color:var(--app-dark-muted) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-head,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-refs,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-synonyms{
     border-color:var(--app-dark-border) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-badge,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-synonym-chip,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-tag{
     background:var(--app-point-highlight) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-synonym-chip{
    background:rgba(255, 255, 255, 0.10) !important;
    border:none !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-view-btn{
     border-color:var(--app-dark-border);
     background:var(--app-dark-surface);
     color:var(--app-point-soft);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-view-btn:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-view-btn:focus-visible{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link{
     background:transparent !important;
     border-color:var(--app-dark-border) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link:focus-visible{
     background:var(--app-point-highlight) !important;
   }
   
   /* Context note popup contrast tune (outline/dividers) */
   body.page-bible .context-note-popover{
     --context-note-surface:#ffffff;
     --context-note-outline:#cbd9e7;
     --context-note-divider:#dbe5ef;
     --context-note-link-outline:#d4e0eb;
     border-color:var(--context-note-outline);
     box-shadow:
       0 22px 44px rgba(0, 0, 0, 0.28),
       0 0 0 1px rgba(255, 255, 255, 0.14),
       inset 0 0 0 1px color-mix(in srgb, var(--context-note-outline) 40%, transparent);
   }
   body.page-bible .context-note-popover::before{
     border-color:transparent transparent var(--context-note-surface) transparent;
   }
   body.page-bible .context-note-head,
   body.page-bible .context-note-refs,
   body.page-bible .context-note-synonyms{
     border-color:var(--context-note-divider) !important;
   }
   body.page-bible .context-note-ref-link{
     border-color:var(--context-note-link-outline) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover{
     --context-note-surface:color-mix(in srgb, var(--app-dark-surface) 88%, #0b1220 12%);
     --context-note-outline:color-mix(in srgb, var(--app-dark-text) 34%, var(--app-dark-surface) 66%);
     --context-note-divider:color-mix(in srgb, var(--app-dark-text) 24%, var(--app-dark-surface) 76%);
     --context-note-link-outline:color-mix(in srgb, var(--app-dark-text) 30%, var(--app-dark-surface) 70%);
     background:var(--context-note-surface) !important;
     border-color:var(--context-note-outline) !important;
     box-shadow:
       0 24px 48px rgba(0, 0, 0, 0.5),
       0 0 0 1px color-mix(in srgb, var(--context-note-outline) 62%, transparent),
       inset 0 0 0 1px color-mix(in srgb, #ffffff 8%, transparent) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover::before{
     border-color:transparent transparent var(--context-note-surface) transparent !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link{
     background:color-mix(in srgb, var(--context-note-surface) 92%, #000000 8%) !important;
     border-color:var(--context-note-link-outline) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-link:focus-visible{
     background:color-mix(in srgb, var(--app-point-highlight) 64%, var(--context-note-surface) 36%) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-more-btn{
     border-color:var(--context-note-link-outline) !important;
   }
   
   body.app-dark-mode .site-footer{
     background:var(--app-dark-surface) !important;
     color:var(--app-dark-text) !important;
     border-top:1px solid var(--app-dark-border);
   }
   body.app-dark-mode .site-footer a{
     color:var(--app-point-soft) !important;
   }
   body.app-dark-mode .site-footer a:hover{
     color:var(--app-point-underline) !important;
   }
   body.app-dark-mode .footer-bottom{
     color:var(--app-dark-muted) !important;
   }
   
   /* =========================
      2026-03 Home/Bible Final Tweaks
      ========================= */
   body.app-dark-mode.home .home-hero{
     background:
       radial-gradient(860px 420px at 14% -16%, rgba(209,160,84,0.12) 0%, rgba(209,160,84,0) 76%),
       linear-gradient(180deg, var(--app-dark-bg) 0%, #131b27 100%);
   }
   body.app-dark-mode.home .home-worship{
     background:linear-gradient(180deg, #243244 0%, var(--app-dark-bg) 100%);
     border-top:1px solid var(--app-dark-border);
     border-bottom:1px solid var(--app-dark-border);
   }
   body.app-dark-mode.home .youtube-link-btn{
     background:var(--app-dark-surface);
     border-color:var(--app-point-soft);
     color:var(--app-point-soft);
   }
   body.app-dark-mode.home .youtube-link-btn:hover{
     background:var(--app-point-highlight);
     border-color:var(--app-point-underline);
     color:var(--app-point-underline);
   }
   
   body.page-bible .tab-toolbar{
     padding-bottom:10px;
   }
   body.page-bible .tab-reader-tools{
     margin-bottom:2px;
   }
   
   /* Related refs: horizontal book chips + accordion groups */
   body.page-bible .related-list{
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   body.page-bible .related-book-strip{
     display:flex;
     align-items:center;
     gap:6px;
     overflow-x:auto;
     padding:1px 1px 5px;
     scrollbar-width:thin;
   }
   body.page-bible .related-book-chip{
     border:1px solid #d3e0ed;
     background:#ffffff;
     color:#3d5f79;
     border-radius:999px;
     padding:5px 10px;
     font-size:12px;
     font-weight:700;
     white-space:nowrap;
     cursor:pointer;
   }
   body.page-bible .related-book-chip:hover,
   body.page-bible .related-book-chip:focus-visible{
     background:#eef4fb;
     border-color:#bfd5e8;
     color:#0f3e66;
   }
   body.page-bible .related-book-chip.active{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
     color:#0f3e66;
   }
   body.page-bible .related-accordion{
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   body.page-bible .related-acc-group{
     border:1px solid #dde7f1;
     border-radius:12px;
     background:#ffffff;
     overflow:hidden;
   }
   body.page-bible .related-acc-head{
     width:100%;
     border:none;
     background:#f8fbff;
     display:flex;
     align-items:center;
     gap:8px;
     padding:10px 12px;
     cursor:pointer;
     text-align:left;
   }
   body.page-bible .related-acc-title{
     flex:1;
     font-size:14px;
     font-weight:800;
     color:#123d61;
   }
   body.page-bible .related-acc-count{
     font-size:12px;
     color:#5d768c;
     font-weight:700;
   }
   body.page-bible .related-acc-caret{
     width:18px;
     text-align:center;
     color:#5d768c;
     font-size:12px;
   }
   body.page-bible .related-acc-panel{
     padding:8px;
     border-top:1px solid #ecf1f6;
     background:#fbfdff;
   }
   body.page-bible .related-acc-items{
     display:flex;
     flex-direction:column;
     gap:6px;
   }
   body.page-bible .related-ref-item.related-ref-item-compact{
     min-height:36px;
     height:36px;
     padding:0 10px;
     white-space:nowrap;
     overflow:hidden;
     text-overflow:ellipsis;
   }
   body.page-bible .related-acc-viewport{
     overflow:auto;
     border:1px solid #e5edf5;
     border-radius:10px;
     background:#ffffff;
   }
   body.page-bible .related-acc-track{
     position:relative;
   }
   body.page-bible .related-acc-window{
     position:absolute;
     left:0;
     right:0;
     top:0;
     display:flex;
     flex-direction:column;
     gap:6px;
     padding:0 6px;
     will-change:transform;
   }
   body.page-bible .related-acc-panel.is-virtual{
     padding:8px;
   }
   
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-book-chip{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-book-chip:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-book-chip:focus-visible{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-book-chip.active{
     background:var(--app-point-highlight);
     border-color:var(--app-point-soft);
     color:var(--app-dark-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-group{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-head{
     background:var(--app-dark-surface);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-title{
     color:var(--app-dark-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-count,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-caret{
     color:var(--app-dark-muted);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-panel{
     background:var(--app-dark-surface);
     border-top-color:var(--app-dark-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-acc-viewport{
     background:var(--app-dark-surface);
     border-color:var(--app-dark-border);
   }
   
   @media (max-width:768px){
     body.page-bible .related-layout{
       display:block;
     }
     body.page-bible .related-list-wrap{
       padding:12px;
     }
     body.page-bible .related-reader{
       display:none;
     }
     body.page-bible .related-reader.mobile-open{
       display:flex;
       position:fixed;
       inset:0;
       z-index:1400;
       background:var(--reader-card-bg, #ffffff);
       padding:calc(env(safe-area-inset-top, 0px) + 10px) 14px calc(env(safe-area-inset-bottom, 0px) + 16px);
       overflow:auto;
       align-items:stretch;
       align-content:flex-start;
       gap:0;
       -webkit-overflow-scrolling:touch;
       overflow-x:hidden;
     }
     body.page-bible .related-reader.mobile-open .related-topbar{
       position:sticky;
       top:0;
       z-index:4;
       display:grid;
       grid-template-columns:auto 1fr;
       gap:10px 12px;
       background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 92%, transparent);
       backdrop-filter:blur(12px);
       padding:2px 0 14px;
       margin:0 0 16px;
       align-items:start;
       border-bottom:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 78%, transparent);
     }
     body.page-bible .related-reader.mobile-open .related-mobile-close{
       display:inline-flex;
       grid-column:1;
       grid-row:1;
     }
     body.page-bible .related-reader.mobile-open .related-current{
       grid-column:1 / -1;
       grid-row:2;
       margin:0;
       padding:0 0 2px;
       border:none;
       background:transparent;
       font-size:18px;
       line-height:1.35;
     }
     body.page-bible .related-reader.mobile-open .related-toolbar-controls{
       grid-column:2;
       grid-row:1;
       justify-self:end;
       gap:8px;
       flex-wrap:nowrap;
     }
     body.page-bible .related-reader.mobile-open .related-verse-picker select{
       min-height:34px;
       padding:0 12px;
       border-radius:999px;
       background:var(--reader-panel-bg, #ffffff);
       color:var(--reader-text, var(--ink));
       border-color:var(--reader-card-border, var(--line));
     }
     body.page-bible .related-reader.mobile-open .related-chapter-memo-btn,
     body.page-bible .related-reader.mobile-open .related-my-memos-btn{
       --memo-btn-size:34px;
     }
     body.page-bible .related-reader.mobile-open .reader-status{
       margin-bottom:12px;
     }
     body.page-bible .related-reader.mobile-open .bible-reader-content{
       flex:0 0 auto;
       min-height:auto;
       overflow:visible;
       overflow-x:hidden;
       padding-right:0;
       margin-bottom:22px;
       width:100%;
       max-width:100%;
     }
     body.page-bible .related-reader.mobile-open .bible-reader-content > *{
       max-width:100%;
     }
     body.page-bible .related-reader.mobile-open .related-reader-nav{
       margin-top:0;
       padding:4px 0 8px;
       gap:10px;
       width:100%;
     }
     body.page-bible .related-reader.mobile-open .related-reader-nav .btn-pill{
       min-height:40px;
       padding:0 16px;
       font-size:14px;
       border-radius:999px;
     }
     body.page-bible .related-mobile-book-list{
       display:grid;
       grid-template-columns:repeat(2, minmax(0, 1fr));
       gap:8px;
     }
     body.page-bible .related-mobile-book-button{
       width:100%;
       min-height:48px;
       border:1px solid var(--reader-card-border, var(--line));
       border-radius:12px;
       background:var(--reader-panel-bg, #ffffff);
       color:var(--reader-text, var(--ink));
       display:flex;
       align-items:center;
       justify-content:space-between;
       gap:8px;
       padding:12px 14px;
       text-align:left;
       font:inherit;
       cursor:pointer;
     }
     body.page-bible .related-mobile-book-button.active{
       font-weight:800;
     }
     body.page-bible .related-mobile-book-name{
       font-weight:800;
     }
     body.page-bible .related-mobile-book-count{
       color:var(--reader-muted, var(--muted));
       font-size:12px;
       font-weight:700;
     }
     body.page-bible .related-mobile-sheet-backdrop{
       position:fixed;
       inset:0;
       z-index:1350;
       display:flex;
       align-items:flex-end;
       justify-content:stretch;
       padding:16px 10px calc(env(safe-area-inset-bottom, 0px) + 10px);
       background:rgba(0,0,0,0.34);
       overflow:hidden;
     }
     body.page-bible .related-mobile-sheet{
       width:100%;
       max-height:min(74vh, 680px);
       border:1px solid var(--reader-card-border, var(--line));
       border-radius:18px;
       background:var(--reader-card-bg, #ffffff);
       box-shadow:var(--shadow-lg, 0 20px 40px rgba(0,0,0,0.18));
       display:flex;
       flex-direction:column;
       overflow:auto;
       overflow-x:hidden;
       -webkit-overflow-scrolling:touch;
       box-sizing:border-box;
     }
     body.page-bible .related-mobile-sheet-head{
       display:flex;
       align-items:center;
       justify-content:space-between;
       gap:10px;
       padding:14px 16px 10px;
       border-bottom:1px solid var(--reader-card-border, var(--line));
       position:sticky;
       top:0;
       z-index:3;
       background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 92%, transparent);
       backdrop-filter:blur(10px);
     }
     body.page-bible .related-mobile-sheet-title{
       margin:0;
       font-size:16px;
       color:var(--reader-text, var(--ink));
     }
     body.page-bible .related-mobile-sheet-head .btn-popup-close{
       position:static;
       top:auto;
       right:auto;
     }
     body.page-bible .related-mobile-sheet-list{
       overflow:visible;
       padding:10px 10px 14px;
       display:flex;
       flex-direction:column;
       gap:8px;
       max-width:100%;
       box-sizing:border-box;
     }
   }
   
   /* =========================
      Confession Page
      ========================= */
   body.page-confession{
     --reader-bg:var(--main-bg);
     --reader-card-bg:var(--surface-bg);
     --reader-card-border:color-mix(in srgb, var(--line) 76%, var(--app-point-highlight) 24%);
     --reader-panel-bg:var(--surface-bg);
     --reader-border:color-mix(in srgb, var(--line) 76%, var(--app-point-highlight) 24%);
     --reader-text:var(--ink);
     --reader-muted:var(--muted);
     --reader-track:color-mix(in srgb, var(--line) 82%, var(--app-point-highlight) 18%);
     --reader-track-fill:var(--app-point-soft);
     --reader-thumb-border:color-mix(in srgb, var(--line) 70%, var(--app-point-soft) 30%);
     --reader-thumb-shadow:0 2px 8px rgba(15,62,102,0.2);
     --confession-reading-width:min(980px, 100%);
     background:var(--main-bg);
     color:var(--reader-text);
   }
   body.page-confession .tab-reader-select{
     width:132px;
     min-width:132px;
     max-width:132px;
   }
   body.page-confession .tab-font-control{
     width:224px;
     min-width:224px;
     max-width:224px;
   }
   .confession-reader{
     width:100%;
     max-width:var(--content-max-w);
     margin:0 auto 18px;
     padding:20px;
     background:var(--reader-panel-bg, var(--surface-bg));
     border-color:var(--reader-border, var(--line));
   }
   .confession-version-wrap{
     margin:6px 0 16px;
   }
   .confession-version-chips{
     display:flex;
     gap:8px;
     overflow-x:auto;
     /* padding-bottom:6px; */
     -webkit-overflow-scrolling:touch;
   }
   .confession-version-chip{
     border:1px solid color-mix(in srgb, var(--reader-card-border) 88%, transparent);
     border-radius:999px;
     background:transparent;
     color:var(--reader-muted);
     font-size:12px;
     font-weight:700;
     padding:6px 12px;
     white-space:nowrap;
     cursor:pointer;
     transition:background .18s ease, border-color .18s ease, color .18s ease;
   }
   .confession-version-chip.active{
     background:color-mix(in srgb, var(--tab-point-highlight) 75%, transparent);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   .confession-content{
     width:100%;
     line-height:2;
     text-align:center;
     font-size:var(--confession-font-size, 1.1rem);
     font-family:var(--reader-content-font, "Gowun Batang", serif);
     font-weight:400;
   }
   .confession-block{
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   .confession-title{
     margin:0 0 4px;
     color:var(--reader-text);
     font-size:1.5rem;
     font-weight:800;
     text-wrap:balance;
   }
   .confession-block.is-en .confession-title{
     font-size:clamp(1.28rem, 2.8vw, 1.46rem);
     letter-spacing:0.01em;
   }
   .confession-ordered{
     margin:0 auto;
     padding-left:1.8em;
     display:flex;
     flex-direction:column;
     gap:0;
     text-align:left;
     width:var(--confession-reading-width);
     max-width:100%;
     font-weight:400;
   }
   .confession-paragraphs{
     display:flex;
     flex-direction:column;
     width:var(--confession-reading-width);
     max-width:100%;
     margin:0 auto;
   }
   .confession-line{
     margin:0;
     padding:12px 0;
     font-weight:400;
     border-bottom:1px solid color-mix(in srgb, var(--reader-card-border) 72%, transparent);
   }
   .confession-block.is-en,
   .confession-block.is-en .confession-line{
     letter-spacing:0.01em;
   }
   .confession-gap{
     height:12px;
   }
   
   body.app-dark-mode.page-confession{
     --reader-bg:var(--app-dark-bg);
     --reader-card-bg:var(--app-dark-surface);
     --reader-card-border:var(--app-dark-border);
     --reader-panel-bg:var(--app-dark-surface);
     --reader-border:var(--app-dark-border);
     --reader-text:var(--app-dark-text);
     --reader-muted:var(--app-dark-muted);
     --reader-track:color-mix(in srgb, var(--app-dark-border) 74%, var(--app-dark-surface) 26%);
     --reader-track-fill:var(--app-point-soft);
     --reader-thumb-border:color-mix(in srgb, var(--app-dark-border) 76%, var(--app-point-soft) 24%);
     --reader-thumb-shadow:0 2px 10px rgba(0,0,0,0.45);
     background:var(--app-dark-bg);
     color:var(--reader-text);
   }
  body.app-dark-mode .confession-reader{
     background:var(--reader-panel-bg, var(--app-dark-surface));
     border-color:var(--reader-border, var(--app-dark-border));
   }
   body.app-dark-mode .confession-version-chip{
     border-color:#4b6278;
     color:#cfe0f1;
   }
   body.app-dark-mode .confession-version-chip.active{
     background:color-mix(in srgb, var(--app-point-highlight) 85%, transparent);
     border-color:var(--app-point-soft);
     color:var(--app-point-soft);
   }
   
   body.page-confession .reader-font-select{
     height:38px;
     min-width:106px;
     border:1px solid #cfdeec;
     border-radius:999px;
     padding:0 11px;
     background:#fff;
     color:#17344b;
     font-size:12px;
     font-weight:700;
   }
   body.page-confession .reader-font-select:focus{
     outline:none;
     border-color:#8fb0cf;
     box-shadow:0 0 0 2px rgba(143,176,207,0.2);
   }
   body.page-confession:is(.reader-dark-mode, .app-dark-mode) .reader-font-select{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   body.page-confession:is(.reader-dark-mode, .app-dark-mode) .reader-font-select:focus{
     border-color:#7ea2c5;
     box-shadow:0 0 0 2px rgba(126,162,197,0.22);
   }
   body.page-confession .font-size-icon{
     line-height:1;
     color:var(--reader-muted);
     user-select:none;
     font-weight:700;
   }
   body.page-confession .font-size-icon-sm{
     font-size:12px;
   }
   body.page-confession .font-size-icon-lg{
     font-size:16px;
   }
   body.page-confession #confessionFontSizeControl{
     --font-slider-progress:40%;
     -webkit-appearance:none;
     appearance:none;
     flex:1 1 auto;
     min-width:124px;
     height:6px;
     border-radius:999px;
     border:none;
     cursor:pointer;
     background:
       linear-gradient(
         to right,
         var(--reader-track-fill) 0,
         var(--reader-track-fill) var(--font-slider-progress),
         var(--reader-track) var(--font-slider-progress),
         var(--reader-track) 100%
       );
   }
   body.page-confession #confessionFontSizeControl::-webkit-slider-runnable-track{
     height:6px;
     border-radius:999px;
     background:transparent;
   }
   body.page-confession #confessionFontSizeControl::-webkit-slider-thumb{
     -webkit-appearance:none;
     appearance:none;
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
     margin-top:-6px;
   }
   body.page-confession #confessionFontSizeControl::-moz-range-track{
     height:6px;
     border-radius:999px;
     background:var(--reader-track);
   }
   body.page-confession #confessionFontSizeControl::-moz-range-progress{
     height:6px;
     border-radius:999px;
     background:var(--reader-track-fill);
   }
   body.page-confession #confessionFontSizeControl::-moz-range-thumb{
     width:18px;
     height:18px;
     border-radius:999px;
     border:1px solid var(--reader-thumb-border);
     background:#fff;
     box-shadow:var(--reader-thumb-shadow);
   }
   body.page-confession #confessionFontSizeValue{
     min-width:38px;
     font-size:12px;
     color:#45617a;
     text-align:right;
   }
   body.app-dark-mode.page-confession #confessionFontSizeValue{
     color:#bfd2e4;
   }
   body.page-confession .font-trigger-btn,
   body.page-bible .tab-reader-tools .font-trigger-btn{
     color:var(--reader-text, var(--ink, var(--muted)));
     background:transparent;
     border:none;
   }
   body.page-confession .font-expanded-panel,
   body.page-bible .tab-reader-tools .font-expanded-panel{
     background:var(--reader-card-bg, #ffffff);
     border-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 82%, transparent);
     color:var(--reader-text, #222222);
   }
   body.page-confession:is(.reader-dark-mode, .app-dark-mode) .font-trigger-btn,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .tab-reader-tools .font-trigger-btn{
     color:var(--reader-text, var(--app-dark-text));
     background:transparent;
     border:none;
   }
   body.page-confession:is(.reader-dark-mode, .app-dark-mode) .font-expanded-panel,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .tab-reader-tools .font-expanded-panel{
     background:#1e1e1e;
     border-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 92%, transparent);
     box-shadow:0 14px 30px rgba(0,0,0,0.35);
   }
   body.app-dark-mode .confession-line{
     border-bottom-color:rgba(160,190,220,0.25);
   }
   
   @media (max-width: 760px){
     .confession-reader{
       padding:16px;
     }
   }
   @media (max-width:720px){
     body.page-confession .tab-reader-tools{
       gap:5px;
       overflow:visible;
     }
     body.page-confession .reader-font-select{
       min-width:92px;
       height:36px;
     }
     body.page-confession .tab-font-control{
       min-width:98px;
       width:min(44vw, 170px);
     }
   }
   @media (max-width:560px){
     body.page-confession .tab-reader-select{
       width:124px;
       min-width:124px;
       max-width:124px;
     }
     body.page-confession .tab-font-control{
       min-width:156px;
       width:min(48vw, 172px);
       max-width:172px;
     }
     body.page-confession .tab-reader-tools{
       justify-content:flex-start;
     }
     body.page-confession #confessionFontSizeControl{
       min-width:68px;
     }
     body.page-confession #confessionFontSizeValue{
       min-width:30px;
       font-size:11px;
     }
   }
   @media (max-width:640px){
     .font-expanded-panel{
       left:0;
       top:calc(100% + 8px);
       width:min(360px, calc(100vw - 32px));
       max-width:min(360px, calc(100vw - 32px));
       border-radius:16px;
       transform:translate3d(0, -8px, 0);
       padding:8px 12px;
       align-items:stretch;
       flex-wrap:wrap;
       row-gap:8px;
     }
     .font-expanded-panel.active{
       transform:translate3d(0, 0, 0);
       max-width:min(360px, calc(100vw - 32px));
     }
     .font-expanded-panel .reader-font-select{
       flex:1 1 144px;
       min-width:144px;
     }
     .font-expanded-panel input[type="range"]{
       flex:1 1 112px;
       min-width:112px;
     }
   }
   @media (max-width:480px){
     .font-expanded-panel{
       width:min(347px, calc(100vw - 28px));
       max-width:min(347px, calc(100vw - 28px));
       border-radius:12px;
     }
     .font-expanded-panel.active{
       max-width:min(347px, calc(100vw - 28px));
     }
     .font-expanded-panel .font-control-divider{
       display:none;
     }
     .font-expanded-panel .reader-font-select{
       width:auto;
       min-width:126px;
       max-width:none;
       flex:1 1 126px;
     }
     .font-expanded-panel input[type="range"]{
       width:auto;
       min-width:92px;
       flex:1 1 92px;
     }
     .font-expanded-panel .font-size-icon{
       display:none;
     }
     .font-expanded-panel #fontSizeValue,
     .font-expanded-panel #confessionFontSizeValue{
       min-width:38px;
       text-align:right;
     }
   }
   
   /* =========================
      Bible Popup/Modal System
      ========================= */
   body.page-bible{
     --reader-popup-bg:var(--reader-card-bg);
     --reader-popup-text:var(--reader-text);
     --reader-popup-border:color-mix(in srgb, var(--reader-text) 24%, transparent);
     --reader-popup-overlay:rgba(7, 12, 20, 0.36);
     --reader-popup-chip-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-chip-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-action-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-text:var(--reader-text, var(--ink));
     --reader-popup-action-border:color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode){
     --reader-popup-bg:var(--reader-card-bg);
     --reader-popup-text:var(--reader-text);
     --reader-popup-border:color-mix(in srgb, var(--reader-text) 42%, transparent);
     --reader-popup-overlay:rgba(2, 6, 14, 0.46);
     --reader-popup-chip-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-chip-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-action-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-text:var(--reader-text, var(--ink));
     --reader-popup-action-border:color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
   }
   body.page-bible .memo-modal,
   body.page-bible .memo-index-modal{
     background:var(--reader-popup-overlay) !important;
     backdrop-filter:blur(5px) !important;
     -webkit-backdrop-filter:blur(5px) !important;
   }
   body.page-bible.popover-open::before{
     backdrop-filter:blur(5px);
     -webkit-backdrop-filter:blur(5px);
   }
   body.page-bible .memo-modal-panel,
   body.page-bible .memo-index-panel,
   body.page-bible .note-popover,
   body.page-bible .context-note-popover,
   body.page-bible .context-popover{
     background:var(--reader-popup-bg) !important;
     color:var(--reader-popup-text) !important;
     border-color:var(--reader-popup-border) !important;
   }
   body.page-bible .note-popover,
   body.page-bible .context-note-popover,
   body.page-bible .context-popover{
     border-width:1px !important;
     box-shadow:
       0 22px 44px rgba(0, 0, 0, 0.34),
       0 0 0 1px color-mix(in srgb, var(--reader-popup-border) 78%, transparent) !important;
     padding-right:44px;
   }
   body.page-bible .context-note-popover.popup-header-inline{
     padding:1.5rem !important;
     display:flex !important;
     flex-direction:column !important;
   }
  body.page-bible .context-note-popover-header{
    border-bottom-color:color-mix(in srgb, var(--reader-popup-text) 10%, transparent) !important;
    padding-bottom:1.25rem !important;
    margin-bottom:1.25rem !important;
  }
   body.page-bible .context-note-popover-title{
     color:var(--reader-popup-text) !important;
     font-size:0.5rem !important;
     font-weight:700 !important;
   }
   body.page-bible .context-note-popover-bottom .popup-font-control{
     margin:0;
   }
   body.page-bible .note-popover::before,
   body.page-bible .context-note-popover::before,
   body.page-bible .context-popover::before{
     border-color:transparent transparent var(--reader-popup-bg) transparent !important;
   }
   body.page-bible .memo-modal-title,
   body.page-bible .memo-index-title,
   body.page-bible .memo-index-status,
   body.page-bible .memo-index-ref,
   body.page-bible .memo-index-preview,
   body.page-bible .memo-modal-meta,
   body.page-bible .note-popover-text,
   body.page-bible .context-note-clicked,
   body.page-bible .context-note-popover-title,
   body.page-bible .context-popover-head strong,
   body.page-bible .context-popover-desc,
   body.page-bible .context-popover-example{
     color:var(--reader-popup-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover-content .note-popover-text{
     --term-desc-label-bg:rgba(226, 232, 240, 0.12);
     --term-desc-label-text:#dbeafe;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-label{
     color:#f3f8ff;
   }
   body.page-bible .context-note-head,
   body.page-bible .context-popover-head{
     padding-right:8px;
   }
   body.page-bible :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ){
     border:1px solid var(--tab-point) !important;
     background:var(--tab-point) !important;
     color:var(--surface-bg) !important;
   }
   body.page-bible :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):hover,
   body.page-bible :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):focus-visible{
     background:color-mix(in srgb, var(--tab-point) 84%, #000 16%) !important;
     border-color:color-mix(in srgb, var(--tab-point) 84%, #000 16%) !important;
     color:var(--surface-bg) !important;
   }
   body.page-bible :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):active{
     background:color-mix(in srgb, var(--tab-point) 72%, #000 28%) !important;
     border-color:color-mix(in srgb, var(--tab-point) 72%, #000 28%) !important;
     color:var(--surface-bg) !important;
   }
   body.page-bible :is(
     .context-note-more-btn,
     .memo-modal-save,
     .memo-index-reset-btn
   ){
     border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%) !important;
     color:var(--reader-text, var(--ink)) !important;
   }
   body.page-bible :is(
     .context-note-more-btn,
     .memo-modal-save,
     .memo-index-reset-btn
   ):hover,
   body.page-bible :is(
     .context-note-more-btn,
     .memo-modal-save,
     .memo-index-reset-btn
   ):focus-visible{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
   }
   body.page-bible :is(
     .context-note-more-btn,
     .memo-modal-save,
     .memo-index-reset-btn
   ):active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
   }
   body.page-bible .memo-modal-input{
     background:color-mix(in srgb, var(--reader-card-bg) 88%, #000000 12%) !important;
     color:var(--reader-text) !important;
     border-color:color-mix(in srgb, var(--reader-text) 30%, transparent) !important;
   }
   body.page-bible .memo-modal-input:focus{
     border-color:var(--app-point-soft) !important;
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-soft) 28%, transparent) !important;
   }
   body.page-bible .memo-index-select,
   body.page-bible .memo-index-recent,
   body.page-bible .memo-index-search{
     background:color-mix(in srgb, var(--reader-card-bg) 92%, #000000 8%) !important;
     color:var(--reader-text) !important;
     border-color:color-mix(in srgb, var(--reader-text) 24%, transparent) !important;
   }
   body.page-bible .memo-index-select:focus,
   body.page-bible .memo-index-recent:focus,
   body.page-bible .memo-index-search:focus,
   body.page-bible .memo-index-date:focus{
     border-color:var(--app-point-soft) !important;
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-soft) 24%, transparent);
     outline:none;
   }
   
   /* Final override: enforce one popup/modal design system in dark themes. */
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-panel,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-panel,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover{
     background:var(--reader-card-bg) !important;
     color:var(--reader-text) !important;
     border:1px solid color-mix(in srgb, var(--reader-text) 36%, transparent) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover{
     box-shadow:
       0 22px 44px rgba(0, 0, 0, 0.42),
       0 0 0 1px color-mix(in srgb, #ffffff 12%, transparent) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover::before,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover::before,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover::before{
     border-color:transparent transparent var(--reader-card-bg) transparent !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-status,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-ref,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-preview,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-meta,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .note-popover-text,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-clicked,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-popover-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-head strong,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-desc,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-popover-example{
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .btn-popup-close,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .btn-popup-close,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .btn-popup-close{
     border-color:var(--reader-card-border) !important;
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ){
     background:var(--app-point-highlight) !important;
     border:1px solid var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):focus-visible{
     background:color-mix(in srgb, var(--app-point-highlight) 86%, var(--app-point-soft) 14%) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-search-btn,
     #tab-search .btn-primary
   ):active{
     background:color-mix(in srgb, var(--app-point-highlight) 74%, var(--app-point-soft) 26%) !important;
     border-color:var(--app-point-soft) !important;
     color:var(--app-dark-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-modal-save,
     .memo-index-reset-btn,
     .context-note-more-btn
   ){
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%) !important;
     border:1px solid var(--reader-card-border) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-modal-save,
     .memo-index-reset-btn,
     .context-note-more-btn
   ):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-modal-save,
     .memo-index-reset-btn,
     .context-note-more-btn
   ):focus-visible{
     background:color-mix(in srgb, var(--reader-card-bg) 76%, var(--tab-point-highlight) 24%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-modal-save,
     .memo-index-reset-btn,
     .context-note-more-btn
   ):active{
     background:color-mix(in srgb, var(--reader-card-bg) 68%, var(--tab-point-highlight) 32%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-actions .btn-secondary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-filters .btn-secondary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-more{
     background:transparent !important;
     border:1px solid color-mix(in srgb, var(--reader-text) 34%, transparent) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-input,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-select,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-recent,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-search,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-date{
     background:color-mix(in srgb, var(--reader-card-bg) 88%, #000000 12%) !important;
     color:var(--reader-text) !important;
     border-color:color-mix(in srgb, var(--reader-text) 30%, transparent) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-modal-input:focus,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-select:focus,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-recent:focus,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-search:focus,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-date:focus{
     border-color:var(--app-point-soft) !important;
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-soft) 24%, transparent) !important;
   }
   
   /* Bible popup font-size control */
   body.page-bible{
     /* 본문 헤더 역본명(개역개정 등): 좁은 폭에서 줄바꿈 방지용, 필요 시 이 값만 조정 */
     --reader-meta-version-font-size: clamp(0.75rem, 2.6vw, 0.8125rem);
     --bible-popover-font-size:16px;
     --bible-popover-font-size-delta:calc(var(--bible-popover-font-size, 16px) - 16px);
     --reader-popup-chip-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-chip-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%);
     --reader-popup-action-bg-hover:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     --reader-popup-action-border:color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
     --reader-popup-action-text:var(--reader-text, var(--ink));
   }
   body.page-bible .note-popover,
   body.page-bible .context-note-popover,
   body.page-bible .context-popover{
     font-size:var(--bible-popover-font-size, 16px) !important;
   }
  body.page-bible .popup-font-control-section,
  body.page-bible .font-slider-container{
    position:static;
    width:0;
    max-width:0;
    min-width:0;
    margin:0;
    padding:0;
    background:transparent;
    color:var(--reader-popup-text, #222222);
    border:none;
    border-radius:0;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    max-height:32px;
    opacity:0;
    overflow:hidden;
    transform:none;
    transition:max-width .2s ease, width .2s ease, opacity .2s ease, margin-right .2s ease;
    z-index:1;
    flex:0 0 auto;
  }
  body.page-bible .popup-font-control-section.popup-font-control-section-open,
  body.page-bible .font-slider-container.popup-font-control-section-open{
    width:144px;
    max-width:144px;
    opacity:1;
    margin-right:2px;
  }
  body.page-bible .popup-font-control-section.popup-font-control-section-collapsed,
  body.page-bible .font-slider-container.popup-font-control-section-collapsed{
    width:0;
    max-width:0;
    opacity:0;
    margin-right:0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .popup-font-control-section{
    background:transparent;
   }
   body.page-bible .popup-font-control{
     display:flex;
     align-items:center;
     gap:5px;
     width:144px;
     min-width:144px;
     max-width:144px;
     height:28px;
     margin:0;
     padding:0;
     flex-wrap:nowrap;
   }
   body.page-bible .popup-font-control-section .popup-font-control{
     margin:0;
   }
   body.page-bible .popup-font-control input[type="range"]{
    flex:1 1 auto;
    min-width:58px;
    height:4px;
    border-radius:999px;
    border:none;
   }
  body.page-bible .popup-font-control .font-size-icon-sm{
     /*
     width:12px;
     height:12px;
     */
     width:20px;
     height:20px;
     stroke-width: 2; 
     opacity: 0.6;
     
   }
   body.page-bible .popup-font-control .font-size-icon-lg{
    /* 
    width:14px;
     height:14px;
    */
      width: 24px; 
      height: 24px; 
      stroke-width: 3;
   }
   body.page-bible .popup-font-control .font-size-icon{
    /*
     stroke:currentColor;
     fill:none;
     stroke-width:1.8;
     stroke-linecap:round;
     stroke-linejoin:round;
     */
     fill: none;             /* 안쪽 색 채우지 않음 */
    stroke: currentColor;   /* 글자색을 선색으로 사용 */
    stroke-width: 5.5;      /* 선 두께를 두껍게 해서 아이콘처럼 보이게 함 */
    stroke-linecap: round;  /* 선의 끝을 둥글게 (고급스러운 느낌) */
    stroke-linejoin: round; /* 꺾이는 부분을 둥글게 */
    width: 24px;            /* 아이콘 크기 고정 */
    height: 24px;
   }
  body.page-bible .popup-font-toggle{
    margin:0;
    padding:0;
    width:32px;
    height:32px;
    min-width:32px;
    min-height:32px;
    border-radius:50%;
    border:none;
    background:transparent;
    color:var(--reader-popup-text);
    cursor:pointer;
    box-sizing:border-box;
    transition:color .18s ease, background-color .18s ease, box-shadow .18s ease;
  }
  body.page-bible .popup-font-toggle:hover,
  body.page-bible .popup-font-toggle:focus-visible{
    color:var(--tab-point, var(--nav));
    background:color-mix(in srgb, var(--reader-popup-chip-bg) 72%, transparent);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 14%, transparent);
    text-decoration:none;
  }
  body.page-bible .popup-font-toggle.popup-font-toggle-active{
    color:var(--tab-point, var(--nav));
    background:color-mix(in srgb, var(--reader-popup-chip-bg) 80%, transparent);
    text-decoration:none;
  }
   body.page-bible .popup-font-toggle-icon{
     width:20px;
     height:20px;
     stroke-width:2;
   }
   body.page-bible .popup-font-control .font-size-icon{
     flex:0 0 auto;
   }
   body.page-bible .popup-title-row .context-note-clicked,
   body.page-bible .popup-title-row .context-popover-head,
   body.page-bible .popup-title-row .context-note-head{
     margin:0;
     flex:1 1 auto;
     min-width:0;
     font-size:24px !important;
     font-weight:700 !important;
   }
   body.page-bible .popup-font-control-inline{
     width:min(210px, 56%);
     margin:0;
     padding:0;
     flex:0 0 auto;
     box-sizing:border-box;
   }
   body.page-bible .popup-font-control-inline input[type="range"]{
     min-width:84px;
   }
   @media (max-width:560px){
     body.page-bible .popup-title-row{
       flex-wrap:wrap;
       align-items:flex-start;
     }
     body.page-bible .popup-font-control-inline{
       width:100%;
     }
   }

   @media (max-width:480px){
     .context-note-popover-header{
       flex-wrap:nowrap;
       align-items:center;
     }
     .context-note-popover-header .context-note-popover-title{
       width:auto;
       order:0;
     }
     body.page-bible .popup-header-actions{
       gap:2px;
     }
     body.page-bible .popup-font-control-section,
     body.page-bible .font-slider-container{
       width:0;
       max-width:0;
     }
     body.page-bible .popup-font-control-section.popup-font-control-section-open,
     body.page-bible .font-slider-container.popup-font-control-section-open{
       width:126px;
       max-width:126px;
     }
     body.page-bible .popup-font-control{
       width:126px;
       min-width:126px;
       max-width:126px;
       flex-direction:row;
       align-items:center;
       gap:4px;
     }
   }
   body.page-bible .popup-font-size-value{
     min-width:16px;
     font-size:11px;
     text-align:right;
     font-weight:700;
     color:inherit;
   }
   body.page-bible .note-popover-text,
   body.page-bible .context-popover-desc,
   body.page-bible .context-popover-example{
     font-size:1em;
     line-height:1.62;
   }
   body.page-bible .context-note-clicked{
     font-size:24px !important;
     font-weight:700 !important;
   }
   body.page-bible .context-note-badge,
   body.page-bible .context-note-marker,
   body.page-bible .context-note-refs-title,
   body.page-bible .context-note-synonyms-title{
     font-size:0.92em;
   }
   body.page-bible .context-note-ref-link{
     font-size:1em;
   }
   body.page-bible .context-note-ref-view-btn{
     min-height:44px;
     padding:0 20px;
     border:1px solid var(--reader-popup-action-border);
     border-radius:999px;
     background:var(--reader-popup-action-bg);
     color:var(--reader-popup-action-text);
     font-size:14px;
     font-weight:800;
     letter-spacing:-0.01em;
     box-shadow:none;
   }
   body.page-bible .context-note-ref-view-btn:hover,
   body.page-bible .context-note-ref-view-btn:focus-visible{
     background:var(--reader-popup-action-bg-hover);
     border-color:var(--tab-point-soft);
     color:var(--reader-popup-action-text);
   }
   body.page-bible .context-note-more-btn,
   body.page-bible .context-note-synonym-chip,
   body.page-bible .context-popover-tag{
     font-size:0.92em;
   }
   body.page-bible .context-popover-head strong{
     font-size:24px !important;
     font-weight:700 !important;
   }
   
   body.page-bible .related-topbar{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:8px;
     margin-bottom:8px;
     flex-wrap:wrap;
   }
   body.page-bible .related-top-actions,
   body.page-bible .related-toolbar-controls{
     display:inline-flex;
     align-items:center;
     gap:6px;
     flex:0 0 auto;
   }
   body.page-bible .related-topbar .related-current{
     margin:0;
     flex:1 1 auto;
   }
   body.page-bible .related-mobile-close{
     display:none;
     position:static;
     top:auto;
     right:auto;
     border:1px solid color-mix(in srgb, var(--reader-text, var(--ink)) 14%, transparent);
     background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 82%, rgba(127,127,127,0.18));
     color:var(--reader-text, var(--ink));
     border-radius:999px;
     width:38px;
     height:38px;
     padding:0;
     font-size:24px;
     line-height:1;
     align-items:center;
     justify-content:center;
     cursor:pointer;
     backdrop-filter:blur(10px);
   }
   body.page-bible .related-verse-picker{
     display:inline-flex;
     align-items:center;
     flex:0 0 auto;
   }
   body.page-bible .related-verse-picker select{
     min-height:32px;
     border:1px solid var(--reader-card-border, var(--line));
     border-radius:10px;
     padding:0 10px;
     background:var(--reader-card-bg, var(--surface-bg));
     color:var(--reader-text, var(--ink));
   }
   body.page-bible .related-chapter-memo-btn{
     --memo-btn-size:30px;
   }
   body.page-bible .related-my-memos-btn{
     --memo-btn-size:30px;
   }
   body.page-bible .related-reader.mobile-open,
   body.page-bible .related-mobile-sheet{
     scrollbar-width:none;
     -ms-overflow-style:none;
   }
   body.page-bible .related-reader.mobile-open::-webkit-scrollbar,
   body.page-bible .related-mobile-sheet::-webkit-scrollbar{
     width:0;
     height:0;
   }
   body.page-bible .related-mobile-sheet-backdrop[hidden]{
     display:none !important;
   }
   body.page-bible.related-mobile-modal-open{
     position:fixed;
     left:0;
     right:0;
     width:100%;
     overflow:hidden;
     height:100%;
     overscroll-behavior:none;
   }
   
   body.page-bible.related-mobile-modal-open .topbar{
     visibility:hidden;
     pointer-events:none;
   }
   
   body.page-bible.memo-dialog-open{
     overflow:hidden;
   }
   html.memo-dialog-open{
     overflow:hidden;
   }
   
   /* =========================
      2026-03 Bible Popup + Related UX
      ========================= */
   body.page-bible.popover-open::before{
     background:var(--overlay-bg);
     backdrop-filter:blur(6px);
     -webkit-backdrop-filter:blur(6px);
   }
   
   body.page-bible .note-popover[data-mobile-sheet="true"],
   body.page-bible .context-popover[data-mobile-sheet="true"]{
     width:min(680px, calc(100vw - 20px));
     max-width:min(680px, calc(100vw - 20px)) !important;
     height:auto;
     max-height:min(78vh, 720px);
     padding:18px 18px 20px;
     border-radius:20px 20px 16px 16px;
     overflow:auto;
     box-sizing:border-box;
   }
   
   body.page-bible .related-mobile-close,
   body.page-bible .related-mobile-sheet-close,
   body.page-bible .related-mobile-sheet-back{
     width:52px;
     height:52px;
     border-radius:16px;
     box-shadow:none;
   }
   
   body.page-bible .related-layout,
   body.page-bible .related-reader,
   body.page-bible .related-reader > *{
     min-width:0;
     box-sizing:border-box;
   }
   
   body.page-bible .related-list-wrap{
     align-self:start;
     height:auto;
   }
   
   body.page-bible .related-topbar{
     display:grid;
     grid-template-columns:minmax(0, 1fr) auto;
     align-items:start;
     gap:10px 14px;
     margin-bottom:10px;
   }
   
   body.page-bible .related-topbar .related-current{
     margin:0;
     min-width:0;
   }
   
   body.page-bible .related-top-actions{
     display:flex;
     align-items:center;
     justify-content:flex-end;
     flex-wrap:wrap;
     gap:8px;
   }
   
   body.page-bible .related-reader #relatedReaderContent{
     padding:20px;
     padding-bottom:108px;
     overflow-wrap:anywhere;
   }
   
   body.page-bible .related-reader #relatedReaderContent .chapter-header,
   body.page-bible .related-reader #relatedReaderContent .verse-line{
     width:100%;
   }
   
   body.page-bible .related-reader-nav{
     position:sticky;
     bottom:0;
     z-index:5;
     margin-top:auto;
     padding:12px 0 calc(env(safe-area-inset-bottom, 0px) + 4px);
     background:linear-gradient(180deg, rgba(247, 251, 255, 0) 0%, color-mix(in srgb, var(--surface-bg) 92%, transparent) 28%, var(--surface-bg) 100%);
   }
   
   @media (max-width:768px){
     body.page-bible .related-layout{
       display:block;
     }
   
     body.page-bible .related-list-wrap{
       border:none;
       background:transparent;
       padding:0;
     }
   
     body.page-bible .related-filters{
       display:none !important;
     }
   
     body.page-bible .related-list{
       min-height:64px;
     }
   
     body.page-bible .related-mobile-launch{
       width:100%;
       min-height:52px;
       border:1px solid var(--accent-border);
       border-radius:16px;
       background:linear-gradient(135deg, var(--surface-bg) 0%, #eef4fb 100%);
       color:var(--point-color);
       padding:14px 16px;
       font:inherit;
       font-weight:800;
       text-align:left;
       cursor:pointer;
       box-shadow:var(--shadow-sm);
     }
   
     body.page-bible .related-mobile-hint{
       margin:0;
       color:var(--muted);
       font-size:13px;
     }
   
     body.page-bible .related-reader{
       display:none;
     }
   
     body.page-bible .related-reader.mobile-open{
       display:flex;
       position:fixed;
       inset:0;
       z-index:1400;
       background:var(--surface-bg);
       padding:
         calc(env(safe-area-inset-top, 0px) + 12px)
         14px
         calc(env(safe-area-inset-bottom, 0px) + 92px);
       overflow:auto;
       overflow-x:hidden;
       gap:0;
     }
   
     body.page-bible .related-reader.mobile-open .related-topbar{
       position:sticky;
       top:0;
       z-index:6;
       grid-template-columns:minmax(0, 1fr) auto;
       padding:4px 0 14px;
       padding-right:56px;
       background:color-mix(in srgb, var(--surface-bg) 94%, transparent);
       border-bottom:1px solid color-mix(in srgb, var(--line) 78%, transparent);
       backdrop-filter:blur(12px);
     }
   
     body.page-bible .related-reader.mobile-open .related-mobile-close{
       position:absolute;
       top:0;
       right:0;
       z-index:8;
     }
   
     body.page-bible .related-reader.mobile-open #relatedReaderContent{
       padding:18px 16px 132px;
       margin-bottom:0;
       width:100%;
     }
   
     body.page-bible .related-reader.mobile-open .related-reader-nav{
       position:fixed;
       left:14px;
       right:14px;
       bottom:calc(env(safe-area-inset-bottom, 0px) + 10px);
       padding:10px;
       /* border:1px solid color-mix(in srgb, var(--line) 78%, transparent); */
       border-radius:18px;
       background:color-mix(in srgb, var(--surface-bg) 94%, transparent);
       box-shadow:0 14px 32px rgba(15, 23, 42, 0.14);
       backdrop-filter:blur(14px);
     }
   
     body.page-bible .related-reader.mobile-open .related-reader-nav .btn-pill{
       min-height:44px;
     }
   
     body.page-bible .related-mobile-sheet-backdrop{
       background:var(--overlay-bg);
       align-items:center;
       justify-content:center;
       padding:16px;
     }
   
     body.page-bible .related-mobile-sheet{
       width:min(720px, 100%);
       max-height:min(78vh, 720px);
       border-radius:22px;
       background:var(--surface-bg);
     }
   
     body.page-bible .related-mobile-sheet-head{
       display:grid;
       grid-template-columns:auto minmax(0, 1fr) auto;
       align-items:center;
       gap:10px;
       padding:14px 16px 12px;
     }
   
     body.page-bible .related-mobile-sheet-title{
       min-width:0;
       text-align:center;
       font-weight:800;
     }
   
     body.page-bible .related-mobile-sheet-list{
       padding:12px 12px 18px;
     }
   
     body.page-bible .related-mobile-book-list{
       grid-template-columns:1fr;
     }
   }
   
   /* =========================
      2026-03 Global Layout Harmonization
      ========================= */
   header.topbar{
     position:fixed !important;
     top:0;
     left:0;
     width:100%;
     z-index:1000;
     background:var(--main-bg);
     border-bottom:1px solid var(--line);
   }
   
   body.has-sticky-header .page-title{
     padding-top:calc(var(--sticky-header-offset, 56px) + 12px);
   }
   
   body.has-sticky-header main{
     padding-top:12px;
   }
   
   body.has-sticky-header [data-include="partials/header.html"],
   body.has-sticky-header [data-include-html="partials/header.html"]{
     min-height:0;
   }
   
   body.has-sticky-header:not(.page-bible){
     scroll-padding-top:calc(var(--sticky-header-offset, 56px) + 16px);
   }
   
   .section,
   .card,
   .month-grid,
   .month-card,
   .related-card,
   .related-layout,
   .related-list-wrap,
   .related-reader,
   .bible-reader-content,
   .hymn-viewer,
   .hymn-viewer-figure{
     max-width:100%;
     box-sizing:border-box;
   }
   
   /* Hymn */
   body.page-hymn .voice-input-group{
     display:flex;
     align-items:center;
     gap:10px;
     margin:0;
   }
   
   body.page-hymn .hymn-search{
     display:flex;
     flex-direction:column;
     gap:14px;
     padding:20px;
     border:1px solid var(--line);
     border-radius:18px;
     background:var(--main-bg);
     box-shadow:var(--shadow-sm);
   }
   
   body.page-hymn .hymn-search-input{
     margin:0;
     background:var(--main-bg);
   }
   
   body.page-hymn .hymn-search-options{
     gap:14px;
     flex-wrap:wrap;
   }
   
   body.page-hymn .hymn-viewer-placeholder{
     display:none !important;
   }
   
   /* Bulletin + Dream cards */
   body.page-bulletin .month-grid{
     grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr));
     align-items:stretch;
   }
   body.page-dream .month-grid{
     grid-template-columns:repeat(2, minmax(320px, 420px)) !important;
     justify-content:center !important;
     align-items:stretch;
     width:100%;
   }
   @media (max-width:768px){
     body.page-dream .month-grid{
       grid-template-columns:1fr !important;
     }
   }
   
   body.page-bulletin .month-card,
   body.page-dream .month-card{
     min-height:0;
     height:auto;
     display:grid;
     grid-template-rows:auto 1fr auto;
   }
   body.page-dream .month-card{
     width:100%;
     max-width:420px;
     justify-self:center;
     box-sizing:border-box;
   }
   
   body.page-bulletin .week-buttons,
   body.page-dream .action-bar{
     align-items:stretch;
   }
   
   body.page-bulletin .week-buttons .btn,
   body.page-dream .chip{
     min-width:72px;
     min-height:42px;
     justify-content:center;
   }
   
   body.page-dream .dream-panel{
     min-width:0;
     width:100%;
   }
   body.page-dream #tab-dream-setlist{
     width:100%;
     margin:0;
     display:grid;
     gap:18px;
     align-content:start;
   }
   body.page-dream #tab-dream-resources{
     width:100%;
     margin:0;
     display:grid;
     gap:18px;
     align-content:start;
   }
   body.page-dream .section.date-filter{
     margin-bottom:0;
   }

  body.page-dream .dream-resource-tabs{
    display:flex;
    flex-wrap:nowrap;
    gap:8px;
    align-items:center;
    margin:0 0 14px;
    padding:0 16px 4px 0;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    position:relative;
  }

  body.page-dream .dream-resource-tabs::-webkit-scrollbar{
    display:none;
  }

  body.page-dream .dream-resource-tabs::after{
    content:"";
    position:sticky;
    right:0;
    top:0;
    width:24px;
    height:100%;
    flex:0 0 24px;
    pointer-events:none;
    background:linear-gradient(
      to right,
      color-mix(in srgb, var(--ui-surface-bg) 0%, transparent) 0%,
      color-mix(in srgb, var(--ui-surface-bg) 92%, transparent) 100%
    );
  }

  body.page-dream .dream-resource-tab{
    flex-shrink:0;
    min-height:42px;
    padding:0 14px;
    justify-content:center;
    font-weight:700;
    letter-spacing:-0.01em;
    white-space:nowrap;
  }

  body.page-dream .dream-resource-tab.active,
  body.page-dream .dream-resource-tab[aria-selected="true"]{
    background:color-mix(
      in srgb,
      var(--ui-surface-bg) 74%,
      var(--app-point-highlight, rgba(15, 62, 102, 0.18)) 26%
    );
    border-color:var(--app-point-soft, #d1a054);
    color:var(--app-point, var(--nav));
    box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--app-point-soft, #d1a054) 36%, transparent);
  }

  body.page-dream .dream-resource-tab:focus-visible{
    outline:none;
  }

  body.page-dream .dream-resource-panel{
    min-width:0;
    width:100%;
  }
   
   body.page-dream .dream-explorer-card{
     display:flex;
     flex-direction:column;
     gap:14px;
     margin:0;
     padding:24px;
     border-radius:12px;
   }
   
   body.page-dream .dream-explorer-head h2{
     margin:0;
     color:var(--point-color);
   }
   
   body.page-dream .dream-explorer-breadcrumb{
     display:flex;
     flex-wrap:wrap;
     gap:6px;
     align-items:center;
     min-height:24px;
     color:var(--muted);
   }
   
   body.page-dream .dream-crumb{
     border:0;
     background:transparent;
     color:var(--point-color);
     font:inherit;
     font-weight:700;
     cursor:pointer;
     padding:0;
   }
   
   body.page-dream .dream-crumb.is-current{
     color:var(--ink);
   }
   
   body.page-dream .dream-explorer-toolbar{
     display:flex;
     gap:10px;
     flex-wrap:wrap;
   }
   
   body.page-dream .dream-explorer-search{
     display:grid;
     grid-template-columns:minmax(0, 1fr) auto auto;
     gap:10px;
     align-items:center;
   }
   
   body.page-dream .dream-explorer-search-input{
     min-width:0;
     border:1px solid var(--line);
     border-radius:12px;
     padding:11px 14px;
     font:inherit;
     color:var(--ink);
     background:var(--surface-bg);
   }
   
   body.page-dream .dream-explorer-search .btn-secondary{
     min-width:72px;
     white-space:nowrap;
   }
   
   body.page-dream .dream-explorer-search-input:focus{
     outline:none;
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-highlight) 45%, transparent);
   }
   
   body.page-dream .dream-explorer-status{
     margin:0;
     color:var(--muted);
     font-size:14px;
   }
   
   body.page-dream .dream-explorer-list{
     width:100%;
     max-width:100%;
     overflow-x:hidden;
   }
   
   body.page-dream .dream-explorer-table{
     display:flex;
     flex-direction:column;
     gap:10px;
   }
   
   body.page-dream .dream-explorer-row{
     width:100%;
     display:grid;
     grid-template-columns:minmax(0, 1.7fr) 100px 120px;
     gap:12px;
     align-items:center;
     text-align:left;
     border:1px solid var(--line);
     border-radius:14px;
     background:linear-gradient(180deg, color-mix(in srgb, var(--surface-bg, #ffffff) 94%, var(--main-bg, #f7fbff) 6%) 0%, color-mix(in srgb, var(--surface-bg, #ffffff) 72%, var(--main-bg, #f7fbff) 28%) 100%);
     padding:12px 14px;
     font:inherit;
     color:var(--ink);
     cursor:pointer;
     transition:border-color .18s, background .18s, transform .18s;
   }
   
   body.page-dream .dream-explorer-row:hover,
   body.page-dream .dream-explorer-row:focus-visible{
     border-color:color-mix(in srgb, var(--nav) 42%, var(--line) 58%);
     background:linear-gradient(180deg, color-mix(in srgb, var(--surface-bg, #ffffff) 90%, var(--accent-bg, #eef4fb) 10%) 0%, color-mix(in srgb, var(--surface-bg, #ffffff) 70%, var(--accent-bg, #eef4fb) 30%) 100%);
     outline:none;
   }
   
   body.page-dream .dream-explorer-name{
     display:flex;
     align-items:center;
     gap:10px;
     min-width:0;
   }
   
   body.page-dream .dream-explorer-meta{
     overflow:hidden;
     text-overflow:ellipsis;
     white-space:nowrap;
     color:var(--muted);
   }
   
   body.page-dream .dream-explorer-name span:last-child{
     overflow:hidden;
     text-overflow:ellipsis;
     white-space:nowrap;
   }
   
   body.page-dream .dream-explorer-icon{
     flex:0 0 auto;
   }
   
   body.page-dream .dream-explorer-empty{
     margin:0;
     padding:18px;
     border:1px dashed var(--line);
     border-radius:14px;
     color:var(--muted);
     background:color-mix(in srgb, var(--surface-bg, #ffffff) 76%, var(--main-bg, #f7fbff) 24%);
   }
   
   body.page-dream .dream-file-modal{
     position:fixed;
     inset:0;
     display:flex;
     align-items:center;
     justify-content:center;
     padding:20px;
     z-index:1200;
   }
   
   body.page-dream .dream-file-modal[hidden]{
     display:none;
   }
   
   body.page-dream .dream-file-modal-backdrop{
     position:absolute;
     inset:0;
     background:rgba(10, 19, 30, .46);
   }
   
   body.page-dream .dream-file-modal-panel{
     position:relative;
     width:min(420px, 100%);
     padding:22px;
     border:1px solid var(--line);
     border-radius:18px;
     background:linear-gradient(180deg, color-mix(in srgb, var(--surface-bg, #ffffff) 95%, var(--main-bg, #f7fbff) 5%) 0%, color-mix(in srgb, var(--surface-bg, #ffffff) 78%, var(--main-bg, #f7fbff) 22%) 100%);
     box-shadow:var(--shadow-lg, 0 18px 40px rgba(15, 23, 42, .18));
   }
   
   body.page-dream .dream-file-modal-name{
     margin:14px 0 0;
     color:var(--ink);
     word-break:break-word;
   }
   
   body.page-dream .dream-file-modal-actions{
     margin-top:18px;
   }
   
   body.page-dream.dream-file-modal-open{
     overflow:hidden;
   }
   
   @media (max-width:768px){
     body.page-bible .related-layout{
       grid-template-columns:1fr !important;
     }
   
     body.page-bible .related-list-wrap{
       width:100%;
     }
   }
   
   @media (max-width:768px){
     body.page-dream .dream-explorer-row{
       grid-template-columns:minmax(0, 1fr);
     }
   
     body.page-dream .dream-explorer-search{
       gap:8px;
     }
   
     body.page-dream .dream-explorer-search .btn-secondary{
       min-width:64px;
       padding-inline:12px;
     }
   
     body.page-dream .dream-file-modal-panel{
       padding:18px;
     }
   }
   
   body.page-bible .history-card{
     display:flex;
     flex-direction:column;
     gap:15px;
     min-width:320px;
     padding:24px;
   }
   body.page-bible .history-card > *{
     width:100%;
   }
   body.page-bible .history-summary{
     padding-bottom:16px;
     border-bottom:1px solid rgba(0, 0, 0, 0.06);
   }
   body.page-bible .history-section-calendar{
     padding-bottom:16px;
     border-bottom:1px solid rgba(0, 0, 0, 0.06);
   }
   body.page-bible .history-section-books{
     margin-top:24px;
     padding-bottom:16px;
     /* 하단 구분선 제거: history-section-activity의 border-top만으로 구분 */
   }
   body.page-bible .history-section-activity{
     margin-top:24px;
     padding-top:32px;
     border-top:1px solid rgba(0, 0, 0, 0.06);
   }
   body.page-bible .history-head{
     display:flex;
     flex-direction:column;
     gap:4px;
     position:relative;
   }
   body.page-bible .history-title-row{
     display:flex;
     align-items:center;
     gap:8px;
   }
   body.page-bible .history-title{
     margin:0;
     font-size:20px;
     color:#204768;
   }
   body.page-bible .history-help-btn{
     width:22px;
     height:22px;
     border:1px solid #cfd9e3;
     border-radius:999px;
     background:#ffffff;
     color:#6d8091;
     font-size:12px;
     font-weight:700;
     line-height:1;
     padding:0;
   }
   body.page-bible .history-help-popover{
     width:min(280px, calc(100vw - 48px));
     margin-top:4px;
     padding:12px 14px;
     border-radius:16px;
     background:var(--reader-popup-bg);
     color:var(--reader-popup-text);
     border:1px solid var(--reader-popup-border);
     box-shadow:0 22px 44px rgba(0, 0, 0, 0.22);
     font-size:13px;
     line-height:1.55;
   }
   body.page-bible .history-filter{
     display:grid;
     gap:10px;
   }
   body.page-bible .history-range-display{
     min-height:22px;
     margin-top:14px;
     margin-bottom:4px;
     color:var(--ink, #1f3d55);
     font-size:15px;
     font-weight:700;
     line-height:1.4;
   }
   body.page-bible .history-filter-fields{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr)) auto;
     gap:10px;
     align-items:end;
   }
   body.page-bible .history-filter-fields .history-apply-btn{
     grid-column:auto;
   }
   body.page-bible .history-filter .field input{
     min-height:42px;
     padding:10px 12px;
     border-radius:12px;
   }
   body.page-bible .history-filter-actions{
     display:flex;
     flex-wrap:wrap;
     gap:12px;
     align-items:center;
   }
   body.page-bible .history-preset-chip{
     min-height:44px;
     padding:0 18px;
     border-radius:999px;
     font-size:15px;
     font-weight:700;
   }
   body.page-bible .history-preset-chip.is-active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible .history-direct-btn{
     margin-left:0;
     border-style:solid;
   }
   body.page-bible .history-direct-btn:hover,
   body.page-bible .history-direct-btn:focus-visible,
   body.page-bible .history-direct-btn.is-active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):active{
     transform:translateY(1px);
   }
   body.page-bible .history-apply-btn{
     min-height:42px;
     border-radius:12px;
     padding:0 16px;
   }
   body.page-bible .history-summary-grid{
     display:grid;
     grid-template-columns:repeat(3, minmax(0, 1fr));
     gap:10px;
   }
   body.page-bible .history-metric{
     border:1px solid var(--reader-card-border, #d8e4f0);
     border-radius:12px;
     background:var(--surface-bg, #f8fbff);
     min-height:72px;
     padding:10px 12px;
     display:flex;
     flex-direction:column;
     justify-content:space-between;
     gap:6px;
   }
   body.page-bible .history-metric.is-wide{
     grid-column:auto;
   }
   body.page-bible .history-metric-label{
     font-size:12px;
     color:var(--muted, #5f7388);
     display:inline-flex;
     align-items:center;
     gap:6px;
   }
   body.page-bible .history-metric-label::before{
     opacity:0.3;
   }
   body.page-bible .history-metric-label[data-kind="reads"]::before{ content:"◔"; }
   body.page-bible .history-metric-label[data-kind="chapter"]::before{ content:"◫"; }
   body.page-bible .history-metric-label[data-kind="book"]::before{ content:"◧"; }
   body.page-bible .history-metric-label[data-kind="recent"]::before{ content:"◷"; }
   body.page-bible .history-metric-value{
     color:var(--ink, #1f3d55);
     font-size:15px;
     font-weight:700;
     line-height:1.25;
     word-break:keep-all;
   }
   body.page-bible .history-section h3{
     margin:0 0 6px;
     font-size:15px;
     color:#244a68;
   }
   body.page-bible .history-card-header{
     flex-shrink:0;
   }
   body.page-bible .history-calendar-head{
     display:flex;
     align-items:center;
     justify-content:center;
     gap:8px;
     margin-bottom:10px;
   }
   body.page-bible .history-cal-label-btn{
     min-width:108px;
     text-align:center;
     font-size:18px;
     font-weight:700;
     padding:4px 14px;
     cursor:pointer;
     border:1px solid transparent;
     background:transparent;
     border-radius:999px;
   }
   body.page-bible .history-cal-label-btn:focus-visible{
     outline:none;
   }
   body.page-bible .history-cal-nav-btn{
     width:34px;
     min-width:34px;
     height:34px;
     border-radius:999px;
     padding:0;
     font-size:22px;
     line-height:1;
   }
   body.page-bible .history-calendar-grid{
     display:grid;
     grid-template-columns:repeat(7, minmax(0, 1fr));
     gap:6px;
     min-width:320px;
     margin:0 auto;
   }
   body.page-bible .history-month-modal{
     z-index:1200;
   }
   body.page-bible .history-month-panel{
     width:min(360px, 100%);
     border-radius:12px;
     padding:14px;
   }
   body.page-bible .history-month-panel h4{
     margin:0 0 10px;
     color:#1f3d55;
     font-size:16px;
   }
   body.page-bible .history-month-fields{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:8px;
   }
   body.page-bible .history-month-actions{
     margin-top:10px;
     display:flex;
     justify-content:flex-end;
     gap:8px;
   }
   body.page-bible .history-calendar-weekday{
     text-align:center;
     font-size:12px;
     font-weight:700;
     color:#9aabb4;
     padding:4px 0;
   }
   body.page-bible{
     --history-calendar-selected-border:var(--tab-point, #1D4ED8);
     --history-calendar-today-dot:#EAB308;
     --history-calendar-intensity-dot:rgba(100, 116, 139, 0.4);
   }
   body.page-bible .history-section-title{
     margin:0 0 8px;
     font-size:15px;
     color:var(--tab-point, #244a68);
   }
   body.page-bible .history-session-controls{
     display:flex;
     flex-wrap:wrap;
     align-items:center;
     gap:6px;
     margin-bottom:10px;
   }
   body.page-bible .history-day-window-toggle{
     display:flex;
     align-items:center;
     gap:6px;
     cursor:pointer;
     user-select:none;
     position:relative;
   }
   body.page-bible .history-day-window-toggle input{
     position:absolute;
     opacity:0;
     pointer-events:none;
   }
   body.page-bible .history-day-window-toggle-track{
     width:34px;
     height:18px;
     border-radius:999px;
     background:rgba(148, 163, 184, 0.5);
     position:relative;
     transition:background 0.2s ease;
     flex:0 0 auto;
   }
   body.page-bible .history-day-window-toggle-track::after{
     content:"";
     position:absolute;
     top:2px;
     left:2px;
     width:14px;
     height:14px;
     border-radius:999px;
     background:#fff;
     box-shadow:0 1px 2px rgba(0, 0, 0, 0.2);
     transition:transform 0.2s ease;
   }
   body.page-bible .history-day-window-toggle input:checked + .history-day-window-toggle-track{
     background:var(--tab-point, #1D4ED8);
   }
   body.page-bible .history-day-window-toggle input:checked + .history-day-window-toggle-track::after{
     transform:translateX(16px);
   }
   body.page-bible .history-day-window-toggle-label{
     font-size:12px;
     color:var(--muted, #64748b);
   }
   body.page-bible .history-day-window-toggle input:focus-visible + .history-day-window-toggle-track{
     outline:2px solid var(--tab-point, #1D4ED8);
     outline-offset:2px;
   }
   body.page-bible #tab-history .history-day-window-segmented{
     display:flex;
     border:1px solid rgba(148, 163, 184, 0.45);
     border-radius:999px;
     overflow:hidden;
   }
   body.page-bible #tab-history .history-day-window-segmented .history-day-window-chip{
     border:none;
     border-radius:0;
     min-height:21px;
     padding:0 9px;
     font-size:11px;
     background:transparent;
     color:var(--muted, #64748b);
     font-weight:600;
     box-shadow:none;
     transition:background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
   }
   body.page-bible #tab-history .history-day-window-segmented .history-day-window-chip + .history-day-window-chip{
     border-left:1px solid rgba(148, 163, 184, 0.3);
   }
  body.page-bible #tab-history .history-day-window-segmented .history-day-window-chip.is-active,
  body.page-bible #tab-history .history-day-window-segmented .history-day-window-chip[aria-pressed="true"]{
    background:linear-gradient(180deg, color-mix(in srgb, var(--tab-point, #1D4ED8) 92%, #ffffff 8%), var(--tab-point, #1D4ED8));
    color:#ffffff;
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.6),
      0 2px 8px rgba(15, 23, 42, 0.25);
    font-weight:700;
    text-shadow:0 1px 0 rgba(15, 23, 42, 0.28);
     position:relative;
     z-index:1;
  }
   body.page-bible #tab-history .history-day-window-segmented .history-day-window-chip:disabled{
     opacity:0.45;
     cursor:not-allowed;
     background:transparent;
     color:rgba(100, 116, 139, 0.7);
     box-shadow:none;
   }
   body.page-bible .history-section-calendar .history-calendar-head{
     margin-top:0;
   }
   body.page-bible .history-calendar-day{
     border:1px solid var(--reader-card-border, rgba(148, 163, 184, 0.35));
     border-radius:12px;
     background:transparent;
     min-height:56px;
     padding:6px 4px;
     display:flex;
     flex-direction:column;
     align-items:center;
     justify-content:flex-start;
     gap:2px;
     transition:border-color 0.2s ease-in-out, color 0.2s ease-in-out;
   }
   body.page-bible .history-calendar-day.is-empty{
     border-color:transparent;
     background:transparent;
     pointer-events:none;
   }
   body.page-bible button.history-calendar-day{
     cursor:pointer;
   }
   body.page-bible button.history-calendar-day:disabled{
     cursor:default;
     opacity:0.72;
   }
   body.page-bible button.history-calendar-day:hover:not(.is-selected){
     border-color:var(--tab-point-soft);
   }
   body.page-bible .history-calendar-day.is-selected{
     border-color:var(--history-calendar-selected-border);
   }
   body.page-bible .history-calendar-day.is-selected .history-calendar-day-num{
     color:var(--ink);
   }
   body.page-bible .history-calendar-day.is-today:not(.is-selected){
     box-shadow:none;
   }
   body.page-bible .history-calendar-day-num{
     position:relative;
     font-size:12px;
     font-weight:700;
     color:var(--ink, #34546e);
     min-width:28px;
     min-height:28px;
     padding:0 4px;
     border-radius:8px;
     display:inline-flex;
     align-items:center;
     justify-content:center;
   }
   body.page-bible .history-calendar-day.is-today .history-calendar-day-num::before{
     content:"";
     position:absolute;
     top:-2px;
     left:50%;
     transform:translateX(-50%);
     width:5px;
     height:5px;
     border-radius:999px;
     background:var(--history-calendar-today-dot);
   }
   body.page-bible .history-calendar-day.is-today .history-calendar-day-num{
     font-weight:800;
   }
   body.page-bible .history-calendar-intensity-dots{
     display:flex;
     align-items:center;
     justify-content:center;
     gap:2px;
   }
   body.page-bible .history-calendar-intensity-dot{
     width:4px;
     height:4px;
     border-radius:999px;
     background:var(--history-calendar-intensity-dot);
   }
   body.page-bible .history-calendar-dots{
     display:none;
   }
   body.page-bible .history-calendar-dot,
   body.page-bible .history-calendar-more{
     display:none;
   }
   body.page-bible .history-book-accordion{
     border:1px solid var(--reader-card-border, #d8e4f0);
     border-radius:12px;
     overflow:hidden;
     margin-bottom:8px;
   }
   body.page-bible .history-book-accordion:last-child{
     margin-bottom:0;
   }
   body.page-bible .history-book-accordion-header{
     width:100%;
     display:flex;
     align-items:center;
     justify-content:space-between;
     padding:12px 14px;
     background:var(--surface-bg, #f8fbff);
     border:none;
     cursor:pointer;
     font-size:15px;
     font-weight:600;
     color:var(--ink, #1f3d55);
     text-align:left;
     transition:background 0.2s ease;
   }
   body.page-bible .history-book-accordion-header:hover{
     background:var(--tab-point-highlight);
   }
   body.page-bible .history-book-accordion-header.is-open .history-book-accordion-chevron{
     transform:rotate(90deg);
   }
   body.page-bible .history-book-accordion-chevron{
     flex-shrink:0;
     font-size:18px;
     color:var(--muted, #5f7388);
     transition:transform 0.2s ease;
   }
   body.page-bible .history-book-accordion-panel{
     padding:10px 14px 12px;
     background:color-mix(in srgb, var(--surface-bg) 96%, #000);
     border-top:1px solid var(--reader-card-border, #d8e4f0);
   }
   body.page-bible .history-book-chips{
     display:flex;
     flex-wrap:wrap;
     gap:6px;
   }
   body.page-bible .history-book-chip{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     min-width:28px;
     min-height:32px;
     padding:4px 8px;
     font-size:13px;
     font-weight:600;
     color:#fff;
     background:var(--history-book-chip-bg, rgba(100, 116, 139, 0.45));
     border:1px solid rgba(255,255,255,0.35);
     border-radius:8px;
   }
   body.page-bible .history-book-chip.is-reread{
     border-width:2.5px;
     border-color:rgba(255,255,255,0.7);
   }
   body.page-bible .history-book-chip.is-wide{
     min-width:36px;
     font-size:12px;
     padding:4px 10px;
   }
   body.page-bible .history-book-chip-tip{
     margin:8px 0 0;
     font-size:11px;
     color:var(--muted, #5f7388);
   }
   body.page-bible .history-book-accordion-meta{
     font-size:13px;
     color:var(--muted, #5f7388);
   }
   body.page-bible .history-book-chip-list-wrap{
     position:relative;
     margin:0 -4px;
     max-width:100%;
   }
   body.page-bible .history-book-chip-list{
     display:flex;
     flex-wrap:nowrap;
     gap:8px;
     overflow-x:auto !important;
     overflow-y:hidden;
     padding:8px 0 12px;
     -webkit-overflow-scrolling:touch;
     white-space:nowrap;
     width:100%;
     max-width:100%;
     min-width:0;
     -ms-overflow-style:scrollbar !important;
     scrollbar-width:thin !important;
     scrollbar-color:rgba(212, 175, 55, 0.3) transparent !important;
   }
   body.page-bible .history-book-chip-list::-webkit-scrollbar{
     height:5px !important;
     display:block !important;
   }
   body.page-bible .history-book-chip-list::-webkit-scrollbar-track{
     background:rgba(255, 255, 255, 0.05);
     border-radius:10px;
   }
   body.page-bible .history-book-chip-list::-webkit-scrollbar-thumb{
     background-color:rgba(212, 175, 55, 0.4) !important;
     border-radius:10px !important;
   }
   body.page-bible .history-book-chip-list::-webkit-scrollbar-thumb:hover{
     background:rgba(212, 175, 55, 0.5);
   }
   body.page-bible .history-book-h-chip{
     flex-shrink:0;
     min-height:36px;
     padding:6px 14px;
     font-size:13px;
     font-weight:600;
     color:var(--ink, #1f3d55);
     background:var(--surface-bg, #f8fbff);
     border:1px solid var(--reader-card-border, #d8e4f0);
     border-radius:999px;
     cursor:pointer;
     transition:background 0.2s, border-color 0.2s, color 0.2s;
   }
   body.page-bible .history-book-h-chip:hover{
     background:var(--tab-point-highlight);
     border-color:var(--tab-point-soft);
     color:var(--tab-point);
   }
   body.page-bible .history-book-h-chip.is-selected{
     background:var(--tab-point);
     border-color:var(--tab-point);
     color:#fff;
   }
   /*
   body.page-bible .history-book-chapter-grid{
     display:grid;
     grid-template-columns:repeat(auto-fill, minmax(32px, 32px));
     gap:6px;
     margin-top:8px;
     max-height:400px;
     overflow-y:auto;
     overflow-x:hidden;
   }
   */
   body.page-bible .history-book-chapter-box{
     width:32px;
     height:32px;
     min-width:32px;
     min-height:32px;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     font-size:11px;
     font-weight:600;
     color:var(--muted, #64748b);
     background:rgba(148, 163, 184, 0.12);
     border:1px solid transparent;
     border-radius:6px;
     box-sizing:border-box;
   }
   body.page-bible .history-book-chapter-box.is-read{
     color:#fff;
     background:var(--tab-point);
     border-color:var(--tab-point-soft);
   }
   body.page-bible .history-timeline-more{
     margin-top:12px;
     font-size:12px;
     min-height:36px;
     padding:0 14px;
   }
   body.page-bible .history-timeline{
     display:flex;
     flex-direction:column;
     gap:0;
     position:relative;
     padding-left:4px;
   }
   body.page-bible .history-timeline-group{
     display:flex;
     flex-direction:column;
     gap:0;
   }
   body.page-bible .history-timeline-year-group{
     padding-left:4px;
   }
   body.page-bible .history-timeline-month-group{
     padding-left:10px;
   }
   body.page-bible .history-timeline-day-group{
     padding-left:0;
   }
   body.page-bible .history-timeline::before{
     content:"";
     position:absolute;
     left:3px;
     top:8px;
     bottom:8px;
     width:1px;
     background:var(--reader-card-border, rgba(148, 163, 184, 0.25));
     border-radius:0;
     opacity:0.85;
   }
   body.page-bible .history-timeline-date-header{
     margin-top:14px;
     padding:10px 0 8px;
     border-top:1px solid rgba(0, 0, 0, 0.06);
     position:relative;
   }
   body.page-bible .history-timeline-year-header{
     margin-top:18px;
     padding-top:14px;
   }
   body.page-bible .history-timeline-month-header{
     margin-top:12px;
     padding-top:8px;
     border-top:1px dashed rgba(0, 0, 0, 0.05);
   }
   body.page-bible .history-timeline-day-header{
     margin-top:10px;
   }
   body.page-bible .history-timeline-date-toggle{
     display:flex;
     align-items:center;
     gap:8px;
     width:100%;
     padding:0;
     border:none;
     background:none;
     text-align:left;
     cursor:pointer;
   }
   body.page-bible .history-timeline-date-toggle:focus-visible{
     outline:2px solid var(--tab-point, #1D4ED8);
     outline-offset:4px;
     border-radius:10px;
   }
   body.page-bible .history-timeline-date-header:first-child{
     margin-top:0;
     padding-top:0;
     border-top:none;
   }
   body.page-bible .history-timeline-date-header-label{
     display:block;
     font-size:12px;
     font-weight:600;
     color:var(--muted, #64748b);
     padding-left:76px;
     line-height:1.3;
     flex:1;
   }
   body.page-bible .history-timeline-year-header .history-timeline-date-header-label,
   body.page-bible .history-timeline-month-header .history-timeline-date-header-label{
     padding-left:0;
   }
   body.page-bible .history-timeline-year-header .history-timeline-date-meta,
   body.page-bible .history-timeline-month-header .history-timeline-date-meta{
     margin-left:0;
   }
   body.page-bible .history-timeline-date-meta{
     font-size:11px;
     color:var(--muted, #8a98a8);
     white-space:nowrap;
   }
   body.page-bible .history-timeline-date-chevron{
     margin-left:auto;
     font-size:16px;
     color:var(--muted, #8a98a8);
     transform:rotate(0deg);
     transition:transform 0.2s ease;
   }
   body.page-bible .history-timeline-date-toggle[aria-expanded="true"] .history-timeline-date-chevron{
     transform:rotate(90deg);
   }
   body.page-bible .history-timeline-row{
     display:grid;
     grid-template-columns:auto auto 1fr;
     grid-template-areas:"time dot card";
     align-items:flex-start;
     gap:10px 8px;
     padding-bottom:16px;
     position:relative;
   }
   body.page-bible .history-timeline-row:last-child{
     padding-bottom:0;
   }
   body.page-bible .history-timeline-time{
     grid-area:time;
     font-size:12px;
     color:var(--muted, #8a98a8);
     white-space:nowrap;
     padding-top:2px;
     min-width:52px;
   }
   body.page-bible .history-timeline-dot{
     grid-area:dot;
     width:8px;
     height:8px;
     border-radius:999px;
     background:var(--tab-point-soft, #94a3b8);
     margin-top:6px;
     flex-shrink:0;
     position:relative;
     z-index:1;
   }
  body.page-bible .history-timeline-row .history-timeline-card{
     grid-area:card;
     margin:0;
     padding:10px 12px;
     border-radius:12px;
     border:1px solid var(--reader-card-border, #d8e4f0);
     background:var(--surface-bg, #f8fbff);
     min-width:0;
     overflow:hidden;
   }
   body.page-bible .history-timeline-card-title{
     display:block;
     font-size:14px;
     margin-bottom:4px;
     color:var(--ink, #1f3d55);
     white-space:normal;
     overflow-wrap:anywhere;
     word-break:break-word;
   }
   body.page-bible .history-timeline-card .history-session-detail{
     margin:0;
     font-size:13px;
     color:var(--muted, #5f7388);
     white-space:normal;
     overflow-wrap:anywhere;
     word-break:break-word;
   }
   body.page-bible .history-book-list{
     display:flex;
     flex-direction:column;
     gap:8px;
     max-width:100%;
     min-width:0;
   }
   /*
   body.page-bible .history-session-list{
     display:flex;
     flex-direction:column;
     gap:12px;
     max-height:500px;
     overflow-y:auto;
     overflow-x:hidden;
     -webkit-overflow-scrolling:touch;
     scrollbar-width:thin;
     scrollbar-color:rgba(234, 179, 8, 0.3) transparent;
   }
   */
   body.page-bible .history-book-chapter-grid{
    /* 기존: max-height:400px; overflow-y:auto; */
    max-height:none;
    overflow-y:clip;
  }
  
   body.page-bible .history-session-list{
    display:flex;
    flex-direction:column;
    gap:12px;
    /* 내부 스크롤 제거: 문서(html)만 스크롤 */
    max-height:none;
    overflow-y:visible;
    overflow-x:visible;
    -webkit-overflow-scrolling:auto;
    scrollbar-width:auto;
    scrollbar-color:rgba(234, 179, 8, 0.3) transparent; /* 있어도/없어도 무방 */
  }
   body.page-bible .history-session-list::-webkit-scrollbar{
     width:4px;
   }
   body.page-bible .history-session-list::-webkit-scrollbar-track{
     background:transparent;
   }
   body.page-bible .history-session-list::-webkit-scrollbar-thumb{
     background:rgba(234, 179, 8, 0.3);
     border-radius:999px;
   }
   body.page-bible .history-session-list::-webkit-scrollbar-thumb:hover{
     background:rgba(234, 179, 8, 0.45);
   }
   body.page-bible .history-list-actions{
     display:flex;
     justify-content:center;
     margin-top:2px;
   }
   body.page-bible .history-list-pagination{
     align-items:center;
     gap:10px;
   }
   body.page-bible .history-page-label{
     min-width:54px;
     text-align:center;
     color:#5f7388;
     font-size:12px;
     font-weight:700;
   }
   body.page-bible .history-page-size{
     min-width:78px;
     min-height:34px;
     border:1px solid #d8e4f0;
     border-radius:10px;
     background:#ffffff;
     color:#456255;
     padding:0 10px;
   }
   body.page-bible .history-list-actions .btn-secondary{
     min-width:160px;
   }
   body.page-bible .history-list-pagination .btn-secondary{
     min-width:84px;
   }
   body.page-bible .history-book-row,
   body.page-bible .history-session-item{
     border:1px solid #d8e4f0;
     border-radius:12px;
     background:#ffffff;
     padding:12px 14px;
     display:flex;
     flex-direction:column;
     gap:8px;
   }
   body.page-bible .history-book-row strong,
   body.page-bible .history-session-item strong{
     color:#1f3d55;
   }
   body.page-bible .history-book-row span,
   body.page-bible .history-session-item p,
   body.page-bible .history-session-detail{
     margin:0;
     color:#5f7388;
     font-size:13px;
     line-height:1.5;
     white-space:nowrap;
     overflow:hidden;
     text-overflow:ellipsis;
   }
   body.page-bible .history-session-list .history-timeline{
     gap:0;
   }
   body.page-bible .history-session-item{
     border-color:rgba(216, 228, 240, 0.7);
     box-shadow:none;
   }
   body.page-bible .history-session-head{
     display:flex;
     align-items:flex-start;
     justify-content:space-between;
     gap:10px;
   }
   body.page-bible .history-session-time{
     flex:none;
     color:#8a98a8;
     font-size:11px;
     line-height:1.4;
   }
   body.page-bible .history-empty{
     margin:0;
     color:#6b7280;
     font-size:13px;
   }
   body.page-bible .history-footer{
     display:flex;
     justify-content:flex-end;
     margin-top:20px;
     padding-bottom:2.5rem;
     flex-shrink:0;
   }
   body.page-bible .history-clear-btn,
   body.page-bible .memo-index-clear-all{
     min-height:42px;
     padding:0 14px;
     border-radius:12px;
     border:1px solid rgba(220, 38, 38, 0.55);
     background:rgba(255, 0, 0, 0.08);
     color:#c62828;
     box-shadow:0 10px 24px rgba(220, 38, 38, 0.12);
     backdrop-filter:blur(6px);
     -webkit-backdrop-filter:blur(6px);
     font-size:12px;
     font-weight:700;
   }
   body.page-bible .history-clear-btn:hover,
   body.page-bible .history-clear-btn:focus-visible,
   body.page-bible .memo-index-clear-all:hover,
   body.page-bible .memo-index-clear-all:focus-visible{
     background:rgba(255, 0, 0, 0.12);
     color:#a61b1b;
     border-color:rgba(220, 38, 38, 0.75);
   }
   @media (max-width: 768px){
     body.page-bible .history-filter-fields{
       grid-template-columns:repeat(2, minmax(0, 1fr)) auto;
       gap:8px;
     }
     body.page-bible .history-filter-fields .history-apply-btn{
       grid-column:auto;
       width:auto;
     }
     body.page-bible .history-summary-grid{
       grid-template-columns:repeat(3, minmax(0, 1fr));
       gap:8px;
     }
     body.page-bible .history-metric{
       min-height:60px;
       padding:6px 8px;
     }
     body.page-bible .history-metric-label{
       font-size:11px;
     }
     body.page-bible .history-metric-value{
       font-size:12px;
     }
     body.page-bible .history-session-head{
       flex-direction:column;
       gap:4px;
     }
   }
   body.page-bible.reader-dark-mode .history-title{
     color:#e2e8f0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-card{
     background:var(--reader-card-bg);
     border-color:var(--reader-card-border);
     box-shadow:0 18px 34px rgba(0,0,0,0.28);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-summary,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-calendar,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-books{
     border-bottom-color:rgba(255, 255, 255, 0.1);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-books{
     border-bottom:none;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-activity{
     border-top-color:rgba(255, 255, 255, 0.1);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-verse-picker select{
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%);
     border-color:var(--reader-card-border);
     color:#d9e6f2;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-help-btn{
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%);
     border-color:var(--reader-card-border);
     color:#b8cbe0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-help-popover{
     background:var(--reader-popup-bg);
     color:var(--reader-popup-text);
     border-color:var(--reader-popup-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-range-display,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-page-label,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .related-verse-picker select{
     color:#b8cbe0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-related .related-version-option input,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) #tab-related .related-compare-wrap input{
     accent-color:var(--app-point-soft);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-metric,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-accordion-header,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-session-item,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-card{
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%);
     border-color:var(--reader-card-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-accordion,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-accordion-panel{
     border-color:var(--reader-card-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-accordion-header{
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-card .history-timeline-card-title{
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline::before{
     background:var(--reader-card-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-date-header{
     border-top-color:rgba(255, 255, 255, 0.1);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-date-header-label{
     color:var(--muted, #94a3b8);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-dot{
     background:var(--tab-point-soft);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-h-chip{
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000 16%);
     border-color:var(--reader-card-border);
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-h-chip.is-selected{
     background:var(--tab-point);
     border-color:var(--tab-point);
     color:#fff;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-chapter-box{
     color:var(--muted);
     background:rgba(148, 163, 184, 0.15);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-chapter-box.is-read{
     background:var(--tab-point);
     color:#fff;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-more{
     color:var(--reader-text);
     border-color:var(--reader-card-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-page-size{
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%);
     border-color:var(--reader-card-border);
     color:#d9e6f2;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-head strong{
     color:#e2e8f0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-weekday{
     color:#7f95a7;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode){
     --history-calendar-selected-border:#FBBF24;
     --history-calendar-today-dot:#EAB308;
     --history-calendar-intensity-dot:rgba(148, 163, 184, 0.5);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day{
     background:transparent;
     border-color:var(--reader-card-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day.is-empty{
     border-color:transparent;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day.is-selected{
     border-color:var(--history-calendar-selected-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day.is-selected .history-calendar-day-num{
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day.is-today .history-calendar-day-num::before{
     background:var(--history-calendar-today-dot);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day.is-today:not(.is-selected){
     box-shadow:none;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-calendar-day-num{
     color:#dbe7f3;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-metric-label,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-session-detail,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-empty,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-session-time,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-chip-tip,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-book-accordion-meta{
     color:#b8cbe0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-title{
     color:#e2e8f0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-page-label{
     color:#b8cbe0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-list-actions .btn-secondary{
     color:#dbe7f3;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-preset-chip:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-direct-btn:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-direct-btn:focus-visible,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-direct-btn.is-active,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-preset-chip.is-active{
     background:color-mix(in srgb, var(--reader-card-bg) 76%, var(--tab-point-highlight) 24%);
     border-color:var(--tab-point-soft);
     color:var(--reader-text);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-clear-btn,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-clear-all{
     color:#ffb4b4;
     border-color:rgba(255, 120, 120, 0.45);
     background:rgba(255, 78, 78, 0.12);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-clear-btn:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-clear-btn:focus-visible,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-clear-all:hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .memo-index-clear-all:focus-visible{
     color:#ffd9d9;
     border-color:rgba(255, 150, 150, 0.62);
     background:rgba(255, 78, 78, 0.18);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-metric-value,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-timeline-card-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-section-title,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-title{
     color:#e2e8f0;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) button.history-calendar-day:hover{
     background:rgba(111, 147, 177, 0.22);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-clear-btn{
     box-shadow:0 12px 28px rgba(0, 0, 0, 0.24);
   }
   
   body.page-hymn .hymn-search-input{
     color:var(--text-color, var(--ink));
     background:var(--surface-bg);
     border:1px solid var(--line);
     caret-color:var(--text-color, var(--ink));
   }
   
   body.app-dark-mode.page-hymn .hymn-search-input,
   body.page-hymn.app-dark-mode .hymn-search-input{
     color:#ffffff !important;
     background:#1e293b !important;
     border-color:color-mix(in srgb, #ffffff 12%, var(--line));
     caret-color:#ffffff;
   }
   
   body.page-bible .memo-index-filter-actions{
     display:flex;
     flex-wrap:wrap;
     gap:12px;
     align-items:center;
     margin-right:24px;
   }
   @media (max-width:480px){
     body.page-bible .memo-index-filter-actions{
       display:grid;
       grid-template-columns:1fr 1fr;
       gap:8px;
       margin-right:0;
     }
   }
   
   body.page-bible .memo-index-preset-chip,
   body.page-bible .memo-index-direct-btn{
     min-height:44px;
     padding:0 18px;
     border-radius:999px;
     font-size:15px;
     font-weight:700;
   }
   
   body.page-bible .memo-index-preset-chip.is-active,
   body.page-bible .memo-index-direct-btn.is-active{
     border-color:var(--app-point-soft) !important;
     color:var(--app-point-soft) !important;
     background:color-mix(in srgb, var(--app-point-soft) 14%, transparent) !important;
   }
   
   body.page-bible .memo-index-range-display{
     margin:0;
     min-height:18px;
     color:var(--reader-popup-text);
     font-size:13px;
   }
   
   body.page-bible .memo-index-filter-fields{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr)) auto;
     gap:10px;
     align-items:end;
   }
   
   body.page-bible .memo-index-query-row{
     display:grid;
     grid-template-columns:1fr 1fr;
     gap:10px;
     align-items:center;
   }
   body.page-bible .memo-index-query-row .memo-index-select,
   body.page-bible .memo-index-query-row .memo-index-search{
     grid-column:1 / -1;
     width:100%;
     box-sizing:border-box;
   }
   body.page-bible .memo-index-query-row .btn-primary,
   body.page-bible .memo-index-query-row .btn-secondary{
     width:100%;
     min-width:0;
   }
   
   body.page-bible .memo-index-date{
     min-height:42px;
     background:color-mix(in srgb, var(--reader-card-bg) 92%, #000000 8%) !important;
     color:var(--reader-text) !important;
     border:1px solid color-mix(in srgb, var(--reader-text) 24%, transparent) !important;
     border-radius:12px;
     padding:10px 12px;
   }
   
   body.page-bible .memo-index-apply-btn{
     min-height:42px;
     border-radius:12px;
     padding:0 16px;
   }
   
   body.page-bible .history-list-pagination .btn-secondary{
     min-width:44px;
     width:44px;
     padding:0;
     font-size:20px;
   }
   
   body.page-bible .history-list-pagination .btn-secondary[aria-label]{
     font-weight:700;
   }
   
   @media (max-width: 720px){
     body.page-bible .memo-index-filter-fields{
       grid-template-columns:repeat(2, minmax(0, 1fr));
     }
     body.page-bible .memo-index-apply-btn{
       grid-column:1 / -1;
       width:100%;
     }
     body.page-bible .memo-index-query-row{
       grid-template-columns:1fr 1fr;
     }
     body.page-bible .memo-index-query-row .memo-index-search{
       grid-column:1 / -1;
     }
     body.page-bible .memo-index-query-row .memo-index-search-btn,
     body.page-bible .memo-index-query-row .memo-index-reset-btn{
       width:100%;
     }
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-month-panel{
     background:var(--reader-popup-bg);
     border-color:var(--reader-popup-border);
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) .history-month-panel h4{
     color:#e2e8f0;
   }
   
   /* =========================
      Admin Page Final Overrides
      ========================= */
   body.admin-page .auth-btn,
   body.admin-page button.auth-btn,
   body.admin-page a.auth-btn{
     appearance:none;
     display:inline-flex;
     align-items:center;
     justify-content:center;
     min-height:36px;
     padding:8px 14px;
     border:1px solid #d1deef;
     border-radius:999px;
     background:#ffffff;
     color:#203a4a;
     text-decoration:none;
     font-size:13px;
     font-weight:700;
     line-height:1.2;
     cursor:pointer;
     box-shadow:0 4px 14px rgba(15, 23, 42, 0.06);
     transition:background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
   }
   body.admin-page .auth-btn:hover,
   body.admin-page .auth-btn:focus-visible{
     background:#f5f9ff;
     border-color:#9bb7d5;
     color:#163854;
   }
   body.admin-page .auth-btn:disabled{
     opacity:0.55;
     cursor:not-allowed;
     box-shadow:none;
   }
   body.admin-page .admin-event-actions .auth-btn{
     min-width:52px;
   }
   body.admin-page .admin-toolbar .auth-btn,
   body.admin-page .admin-search-toolbar .auth-btn,
   body.admin-page .admin-form-actions .auth-btn{
     min-height:38px;
   }
   body.admin-page .admin-role-select{
     min-height:36px;
   }
   body.app-dark-mode.admin-page .auth-btn,
   body.app-dark-mode.admin-page button.auth-btn,
   body.app-dark-mode.admin-page a.auth-btn{
     background:#111a26;
     border-color:#2f4358;
     color:#edf4fb;
     box-shadow:0 6px 18px rgba(0, 0, 0, 0.24);
   }
   body.app-dark-mode.admin-page .auth-btn:hover,
   body.app-dark-mode.admin-page .auth-btn:focus-visible{
     background:#182536;
     border-color:#6b8baa;
     color:#ffffff;
   }
   body.app-dark-mode.admin-page .admin-user-input{
     background:#111a26;
     border-color:#2f4358;
     color:#edf4fb;
   }
   
   /* =========================
      2026-03 Related Bible Mobile + Theme Consistency
      ========================= */
   body.page-bible .verse-annotation-header,
   body.page-bible .popup-title-row{
     position:relative;
     display:flex;
     flex-direction:column !important;
     align-items:flex-start !important;
     gap:10px;
     margin-right:0;
     padding-top:40px !important;
   }
   
   body.page-bible .verse-annotation-close{
     position:absolute !important;
     top:0;
     right:0;
     width:48px !important;
     height:48px !important;
     display:flex;
     align-items:center;
     justify-content:center;
   }
   
   body.page-bible .font-size-control,
   body.page-bible .popup-font-control-inline{
     width:100%;
     margin-top:10px;
   }
   
   body.page-bible .related-reader-viewer,
   body.page-bible .related-reader{
     position:relative;
   }
   
  body.page-bible .related-content-header{
    position:sticky;
    top:0 !important;
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-bottom:0;
    padding:10px 16px;
    background:var(--surface-bg) !important;
    border-bottom:2px solid var(--line) !important;
    z-index:30;
  }
   
   body.page-bible .related-header-top{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
   }

   body.page-bible .related-title-group{
     display:flex;
     align-items:center;
     gap:10px;
     min-width:0;
     flex:1 1 auto;
   }
   
   body.page-bible .related-content-header .related-current{
     margin:0;
     min-width:0;
     flex:0 1 auto;
     font-size:16px;
     font-weight:800;
     color:var(--ink);
   }

   body.page-bible .related-chapter-picker{
     display:inline-flex;
     align-items:center;
     flex:0 0 auto;
     min-width:0;
   }
   
   body.page-bible .related-header-bottom{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:8px;
   }
   
   body.page-bible .related-header-bottom-left{
     display:flex;
     align-items:center;
     gap:8px;
   }
   
   body.page-bible .related-top-actions,
   body.page-bible .control-group{
     display:flex;
     align-items:center;
     justify-content:flex-end;
     gap:8px;
     flex:0 0 auto;
   }
   
   body.page-bible .related-chapter-picker select{
     min-height:42px;
     padding:0 14px;
     border:1px solid var(--line);
     border-radius:12px;
     background:var(--surface-bg);
     color:var(--ink);
     font:inherit;
     font-weight:700;
   }
   
   body.page-bible .related-chapter-memo-btn,
   body.page-bible .related-my-memos-btn{
     --memo-btn-size:48px;
   }
   
   body.page-bible .related-reader #relatedReaderContent{
     padding-top:18px;
   }
   
   body.page-bible .related-mobile-close{
     display:none !important;
   }
   
   body.page-bible.related-mobile-modal-open .topbar{
     visibility:visible;
     pointer-events:auto;
   }
   
   @media (max-width:768px){
     body.page-bible .related-layout{
       display:flex;
       flex-direction:column;
       gap:16px;
     }
   
     body.page-bible .related-list-wrap{
       width:100%;
       border:none;
       background:transparent;
       padding:0;
     }
   
     body.page-bible .related-mobile-launch{
       width:100%;
       min-height:52px;
       border:1px solid var(--line);
       border-radius:14px;
       background:var(--surface-bg);
       color:var(--ink);
       padding:14px 16px;
       font:inherit;
       font-weight:800;
       text-align:left;
       cursor:pointer;
       box-shadow:none;
     }
   
     body.page-bible .related-mobile-hint{
       margin:0;
       color:var(--muted);
       font-size:13px;
     }
   
     body.page-bible .related-reader{
       display:none;
       width:100%;
       min-width:0;
       /* border:1px solid var(--line); */
       border-radius:18px;
       background:var(--surface-bg);
       overflow:hidden;
     }
   
     body.page-bible .related-reader.mobile-open{
       display:flex;
       position:relative;
       inset:auto;
       z-index:auto;
       padding:0;
       gap:0;
       background:var(--surface-bg);
       overflow:visible;
     }
   
     body.page-bible .related-reader.mobile-open .related-content-header{
       top:0 !important;
       flex-wrap:wrap;
       align-items:flex-start;
       padding:12px 16px;
     }
   
     body.page-bible .related-reader.mobile-open .related-content-header .related-current{
       flex:1 1 100%;
       font-size:18px;
       line-height:1.35;
     }
   
     body.page-bible .related-reader.mobile-open .related-top-actions{
       width:100%;
       justify-content:flex-start;
       flex-wrap:wrap;
     }
   
     body.page-bible .related-reader.mobile-open #relatedReaderContent{
       width:100%;
       padding:18px 16px 28px;
       margin-bottom:0;
     }
   
     body.page-bible .related-reader.mobile-open .reader-status{
       padding:14px 16px 0;
       margin-bottom:0;
     }
   
     body.page-bible .related-reader.mobile-open .related-reader-nav{
       position:sticky;
       bottom:0;
       left:auto;
       right:auto;
       margin-top:auto;
       padding:12px 16px calc(env(safe-area-inset-bottom, 0px) + 12px);
       /* border-top:1px solid var(--line); */
       border-radius:0;
       background:var(--surface-bg);
       box-shadow:none;
       backdrop-filter:none;
     }
   
     body.page-bible .related-reader.mobile-open .related-reader-nav .btn-pill{
       min-height:44px;
     }
   
     body.page-bible .related-mobile-sheet-backdrop{
       position:fixed;
       top:max(60px, env(safe-area-inset-top, 0px)) !important;
       left:0;
       width:100%;
       height:calc(100% - max(60px, env(safe-area-inset-top, 0px))) !important;
       padding:0;
       background-color:var(--overlay-bg);
       z-index:999;
       overflow:hidden;
     }
   
     body.page-bible .related-mobile-sheet{
       width:100%;
       height:100%;
       max-height:none;
       border:none;
       border-radius:0;
       background:var(--surface-bg) !important;
       box-shadow:none;
       overflow:auto;
     }
   
     body.page-bible .related-mobile-sheet-head{
       position:sticky;
       top:0;
       display:grid;
       grid-template-columns:48px minmax(0, 1fr) 48px;
       align-items:center;
       gap:8px;
       padding:calc(8px + env(safe-area-inset-top, 0px)) 12px 8px;
       background-color:var(--surface-bg) !important;
       border-bottom:2px solid var(--line) !important;
       backdrop-filter:none;
     }
   
     body.page-bible .related-mobile-sheet-title{
       min-width:0;
       text-align:center;
       font-size:17px;
       font-weight:800;
       color:var(--ink);
     }
   
     body.page-bible .related-mobile-sheet-close.btn-popup-close,
     body.page-bible .related-mobile-sheet-back.btn-popup-close{
       position:static !important;
       top:auto;
       right:auto;
       width:52px !important;
       height:52px !important;
       border-radius:16px !important;
       box-shadow:none;
     }
   
     body.page-bible .related-mobile-sheet-back{
       font-size:20px !important;
       font-weight:700;
       color:var(--ink) !important;
     }
   
     body.page-bible .related-mobile-sheet-back span[aria-hidden="true"]{
       font-size:20px;
       font-weight:700;
       color:var(--ink);
       line-height:1;
     }
   
     body.page-bible .related-mobile-sheet-list{
       padding:12px 16px 24px;
       gap:10px;
     }
   
     body.page-bible .related-mobile-book-list{
       grid-template-columns:1fr;
       gap:10px;
     }
   
     body.page-bible .related-mobile-book-button,
     body.page-bible .related-mobile-sheet-list .related-ref-item{
       width:100%;
       min-height:52px;
       padding:14px 16px;
       border:1px solid var(--line);
       border-radius:12px;
       background:var(--surface-bg);
       color:var(--ink);
       font:inherit;
       font-weight:700;
       box-shadow:none;
     }
   }
   
   body.page-hymn .hymn-search-input{
     background-color:var(--surface-bg);
   }
   
   body.page-dream .dream-explorer-head{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     padding-bottom:10px;
     border-bottom:1px solid var(--line);
   }
   
   body.app-dark-mode.page-dream .dream-explorer-head h2{
     color:var(--app-dark-text);
   }
   
   body.app-dark-mode.page-dream .page-title .h1{
     color:#d8e5f2;
   }
   
   body.app-dark-mode.page-dream .dream-explorer-row{
     background:linear-gradient(180deg, color-mix(in srgb, var(--app-dark-surface) 92%, #ffffff 8%) 0%, color-mix(in srgb, var(--app-dark-surface) 80%, var(--app-dark-bg) 20%) 100%);
   }
   
   body.app-dark-mode.page-dream .dream-explorer-row:hover,
   body.app-dark-mode.page-dream .dream-explorer-row:focus-visible{
     border-color:color-mix(in srgb, var(--app-point) 52%, var(--app-dark-border) 48%);
     background:linear-gradient(180deg, color-mix(in srgb, var(--app-dark-surface) 84%, var(--app-point-highlight) 16%) 0%, color-mix(in srgb, var(--app-dark-surface) 70%, var(--app-dark-bg) 30%) 100%);
   }
   
   body.app-dark-mode.page-dream .dream-explorer-search-input{
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
     background:var(--app-dark-surface);
   }
   
   body.app-dark-mode.page-dream .dream-explorer-search-input:focus{
     border-color:var(--app-point-soft);
     box-shadow:0 0 0 3px color-mix(in srgb, var(--app-point-highlight) 38%, transparent);
   }
   
   body.app-dark-mode.page-dream .dream-explorer-empty{
     background:color-mix(in srgb, var(--app-dark-surface) 82%, var(--app-dark-bg) 18%);
   }
   
   body.app-dark-mode.page-dream .dream-file-modal-panel{
     border-color:var(--app-dark-border);
     background:linear-gradient(180deg, color-mix(in srgb, var(--app-dark-surface) 92%, #ffffff 8%) 0%, color-mix(in srgb, var(--app-dark-surface) 78%, var(--app-dark-bg) 22%) 100%);
   }
   
   body.app-dark-mode.page-dream .dream-file-modal-name{
     color:var(--app-dark-text);
   }
   
   /* =========================
      2026-03-12 Theme Feedback Fixes
      ========================= */
   
   body.page-confession .confession-version-chip:hover,
   body.page-confession .confession-version-chip:focus-visible{
     outline:none;
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--surface-bg) 82%, var(--tab-point-highlight) 18%);
     color:var(--tab-point);
   }
   
   body.app-dark-mode.page-confession .confession-version-chip:hover,
   body.app-dark-mode.page-confession .confession-version-chip:focus-visible{
     border-color:var(--app-point-soft);
     background:color-mix(in srgb, var(--app-dark-surface) 76%, var(--app-point-highlight) 24%);
     color:var(--app-point-soft);
   }
   
   body.page-confession #confessionFontSizeControl:focus-visible{
     outline:2px solid var(--tab-point-soft);
     outline-offset:2px;
   }
   
   body.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary{
     border-color:color-mix(in srgb, var(--tab-point-soft) 48%, var(--line) 52%);
     color:var(--ink);
     background:color-mix(in srgb, var(--surface-bg) 88%, var(--tab-point-highlight) 12%);
   }
   
   body.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary:hover,
   body.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary:focus-visible{
     border-color:var(--tab-point-soft);
     color:var(--ink);
     background:color-mix(in srgb, var(--surface-bg) 72%, var(--tab-point-highlight) 28%);
   }
   
   body.app-dark-mode.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary{
     border-color:var(--app-dark-border);
     color:var(--app-dark-text);
     background:color-mix(in srgb, var(--app-dark-surface) 88%, var(--app-dark-bg) 12%);
   }
   
   body.app-dark-mode.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary:hover,
   body.app-dark-mode.page-dream :is(.dream-explorer-toolbar, .dream-explorer-search) .btn-secondary:focus-visible{
     border-color:var(--app-point-soft);
     color:var(--app-dark-text);
     background:color-mix(in srgb, var(--app-dark-surface) 76%, var(--app-point-highlight) 24%);
   }
   
   body.page-confession .confession-reader{
     min-height:clamp(420px, 58vh, 640px);
   }
   
   @media (max-width: 768px){
     body.page-confession .tab-reader-tools{
       width:100%;
       flex-wrap:wrap;
       row-gap:8px;
     }
   
     body.page-confession .tab-reader-select{
       flex:0 0 132px;
     }
   
     body.page-confession .tab-font-control{
       flex:1 1 220px;
       max-width:300px;
     }
   }
   
   body.page-bible #tab-related .btn-pill{
     background:var(--tab-point);
     border-color:var(--tab-point);
     color:#fff;
   }
   
   body.page-bible #tab-related .btn-pill:not(:disabled):hover,
   body.page-bible #tab-related .btn-pill:not(:disabled):focus-visible{
     background:color-mix(in srgb, var(--tab-point) 84%, #000 16%);
     border-color:color-mix(in srgb, var(--tab-point) 84%, #000 16%);
   }
   
   body.page-bible #tab-related .related-reader:not(.mobile-open) .related-reader-nav{
     position:static;
     margin-top:0;
     padding:0;
     background:var(--main-bg);
   }
   
   body.page-bible #tab-related .related-card{
     background:transparent;
     border:none;
   }
   
   body.page-bible #tab-related .related-subtitle strong{
     color:var(--tab-point);
   }
   
   body.page-bible #tab-related .related-list-wrap{
     background:color-mix(in srgb, var(--reader-card-bg) 92%, var(--reader-panel-bg) 8%);
     border-color:var(--reader-card-border);
   }
   
   body.page-bible #tab-related .related-filter{
     border-color:color-mix(in srgb, var(--reader-card-border) 72%, var(--tab-point-soft) 28%);
     color:var(--reader-text);
     background:var(--reader-panel-bg);
   }
   
   body.page-bible #tab-related .related-filter:hover,
   body.page-bible #tab-related .related-filter:focus-visible{
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--reader-panel-bg) 82%, var(--tab-point-highlight) 18%);
     color:var(--tab-point);
     outline:none;
   }
   
   body.page-bible #tab-related .related-filter.active{
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--reader-panel-bg) 75%, var(--tab-point-highlight) 25%);
     color:var(--tab-point);
   }
   
   body.page-bible #tab-related .related-ref-item{
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-text);
   }
   
   body.page-bible #tab-related .related-ref-item:hover,
   body.page-bible #tab-related .related-ref-item:focus-visible,
   body.page-bible #tab-related .related-ref-item.active{
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--reader-card-bg) 80%, var(--tab-point-highlight) 20%);
     color:var(--tab-point);
   }
   
   body.page-bible #tab-related .related-content-header{
     display:flex !important;
     flex-direction:column !important;
     gap:10px !important;
     padding:12px 16px !important;
     background:var(--reader-panel-bg) !important;
     border:1px solid var(--reader-card-border) !important;
     border-bottom:1px solid var(--reader-card-border) !important;
     border-radius:calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0 !important;
   }
   
   body.page-bible #tab-related .related-header-top,
   body.page-bible #tab-related .related-header-bottom{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     min-width:0;
     width:100%;
   }
   
   body.page-bible #tab-related .related-header-bottom-left{
     display:flex;
     align-items:center;
     justify-content:flex-start;
     gap:8px;
     min-width:0;
     flex:1 1 auto;
   }
   
   body.page-bible #tab-related .related-header-bottom-right{
     display:flex;
     align-items:center;
     justify-content:flex-end;
     gap:8px;
     flex:0 0 auto;
     margin-left:auto;
   }
   
   body.page-bible #tab-related .related-content-header .related-current{
     flex:0 1 auto;
     min-width:0;
     color:var(--reader-text) !important;
   }

   body.page-bible #tab-related .related-title-group{
     display:flex;
     align-items:center;
     gap:10px;
     flex:1 1 auto;
     min-width:0;
   }

   body.page-bible #tab-related .related-chapter-picker select{
     min-height:42px;
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-text);
   }
   
   body.page-bible #tab-related .related-header-top .related-mobile-close{
     margin-left:auto;
   }
   
   body.page-bible #tab-related .related-header-version-row{
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     flex-wrap:wrap;
     padding:6px 0;
     border-bottom:1px solid var(--reader-card-border);
   }
   body.page-bible #tab-related .related-version-options{
     display:flex;
     align-items:center;
     gap:12px;
   }
   body.page-bible #tab-related .related-version-option{
     display:inline-flex;
     align-items:center;
     gap:6px;
     cursor:pointer;
     color:var(--reader-text);
   }
   body.page-bible #tab-related .related-version-option input{
     min-width:18px;
     min-height:18px;
     accent-color:var(--tab-point);
   }
   body.page-bible #tab-related .related-compare-wrap{
     display:inline-flex;
     align-items:center;
     gap:6px;
     cursor:pointer;
     color:var(--reader-text);
   }
   body.page-bible #tab-related .related-compare-wrap input{
     min-width:18px;
     min-height:18px;
     accent-color:var(--tab-point);
   }
   body.page-bible #tab-related .related-reader-compare{
     margin-top:12px;
     padding:12px 0;
     border-top:1px solid var(--reader-card-border);
   }
   body.page-bible #tab-related .related-reader-compare .compare-head,
   body.page-bible #tab-related .related-reader-compare .compare-pairs{
     color:var(--reader-text);
   }
   body.page-bible #tab-related .related-mobile-sheet-back{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     gap:6px;
   }
   body.page-bible #tab-related .related-mobile-sheet-back-text{
     font-size:14px;
     font-weight:600;
     color:var(--ink);
   }
   
   body.page-bible #tab-related .related-verse-picker select{
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-text);
   }
   
   body.page-bible #tab-related .related-verse-picker select:focus{
     outline:none;
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 2px color-mix(in srgb, var(--tab-point-soft) 22%, transparent);
   }
   
   body.page-bible #tab-related .related-reader-content{
     color:var(--reader-text) !important;
     box-shadow:none !important;
     padding:0;
     overflow-y: auto !important;
     -ms-overflow-style: none;
     scrollbar-width: none;
   }
   
   body.page-bible #tab-related .related-reader #relatedReaderContent{
     padding:18px 16px 20px !important;
     margin-bottom:0 !important;
   }
   
   body.page-bible #tab-related .related-mobile-launch,
   body.page-bible #tab-related .related-mobile-book-button,
   body.page-bible #tab-related .related-mobile-sheet-list .related-ref-item{
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-text);
   }
   
   body.page-bible #tab-related .related-mobile-launch:hover,
   body.page-bible #tab-related .related-mobile-launch:focus-visible,
   body.page-bible #tab-related .related-mobile-book-button:hover,
   body.page-bible #tab-related .related-mobile-book-button:focus-visible,
   body.page-bible #tab-related .related-mobile-sheet-list .related-ref-item:hover,
   body.page-bible #tab-related .related-mobile-sheet-list .related-ref-item:focus-visible{
     border-color:var(--tab-point-soft);
     background:color-mix(in srgb, var(--reader-card-bg) 80%, var(--tab-point-highlight) 20%);
     color:var(--tab-point);
   }
   
   body.page-bible #tab-related .related-mobile-sheet{
     background:var(--reader-card-bg) !important;
     color:var(--reader-text);
   }
   
   body.page-bible #tab-related .related-mobile-sheet-head{
     display:flex !important;
     align-items:center;
     gap:8px;
     background:var(--reader-card-bg) !important;
     border-bottom:1px solid var(--reader-card-border) !important;
   }
   
   body.page-bible #tab-related .related-mobile-sheet-title{
     flex:1 1 auto;
     margin:0;
     color:var(--reader-text);
     text-align:center;
   }
   
   body.page-bible #tab-related .related-mobile-sheet-close{
     margin-left:auto;
   }
   
   body.page-bible #tab-related .related-mobile-sheet-close,
   body.page-bible #tab-related .related-mobile-sheet-back{
     box-shadow:none;
   }
   
   body.page-bible #tab-related .related-mobile-sheet-list{
     background:var(--reader-card-bg);
   }

   /* Keyword Focus Header: temporary shared header pattern for related Bible flows */
   body.page-bible #tab-related .keyword-focus-header{
     display:flex;
     flex-direction:column;
     align-items:flex-start;
     gap:4px;
     min-width:0;
   }

   body.page-bible #tab-related .keyword-focus-header-title{
     margin:0;
     color:var(--tab-point) !important;
     font-size:20px;
     font-weight:800;
     line-height:1.1;
     letter-spacing:-0.02em;
     font-family:var(--reader-content-font, inherit);
   }

  body.page-bible #tab-related .keyword-focus-header-subtitle{
     margin:0;
     color:color-mix(in srgb, var(--reader-text) 76%, var(--tab-point-highlight) 24%) !important;
     font-size:1.05rem;
     font-weight:500;
     line-height:1.35;
   }

   body.page-bible #tab-related .related-description{
     --term-desc-lead-color:color-mix(in srgb, var(--reader-text) 88%, var(--tab-point-highlight) 12%);
     --term-desc-label-bg:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 86%, var(--tab-point-highlight) 14%);
     --term-desc-label-text:color-mix(in srgb, var(--tab-point) 74%, var(--reader-text) 26%);
     padding:14px 0 18px;
   }

   body.page-bible #tab-related .related-description .context-note-desc-summary{
     margin:0 0 24px;
     padding:0;
   }

   body.page-bible #tab-related .related-description .context-note-desc-summary .term-desc-lead{
     margin:0;
     color:color-mix(in srgb, currentColor 92%, #0b2235 8%);
     font-size:calc(16px + var(--bible-popover-font-size-delta, 0px));
     font-weight:700;
     letter-spacing:-0.005em;
     line-height:1.8;
   }

   body.page-bible #tab-related .related-description .context-note-desc-sections{
     display:flex;
     flex-direction:column;
     gap:12px;
   }

   body.page-bible #tab-related .related-description .term-desc-section + .term-desc-section{
     margin-top:3px;
     padding-top:0;
   }

   body.page-bible #tab-related .related-description .term-desc-section-label{
     display:block;
     margin:4px 0 4px;
     color:#143f63;
     font-size:12px;
     font-weight:600;
     letter-spacing:0.01em;
     line-height:1.35;
   }

   body.page-bible #tab-related .related-description .term-desc-section-body{
     display:block;
     margin:0;
     font-size:0.96em;
     line-height:1.75;
   }

   body.page-bible #tab-related .related-description .context-note-synonyms{
     margin-top:16px;
   }

   body.page-bible #tab-related .related-description .context-note-synonyms-title{
     display:block;
     margin:0 0 7px;
     color:color-mix(in srgb, currentColor 74%, transparent);
     font-size:13px;
     font-weight:600;
     letter-spacing:0.01em;
     line-height:1.45;
   }

   body.page-bible #tab-related .keyword-focus-header-compact .keyword-focus-header-title{
     font-size:20px;
   }

   body.page-bible #tab-related .keyword-focus-header-compact .keyword-focus-header-subtitle{
     font-size:1rem;
   }

  body.page-bible #tab-related .related-head{
    position:relative;    
    padding:6px 12px 14px !important;     /* padding:16px 18px 14px !important; */
    /* padding-right:18px !important; */
    border-bottom:1px solid var(--reader-card-border);
  }

   body.page-bible #tab-related .related-subtitle-row{
     width:100%;
     display:flex;
     align-items:center;
     justify-content:space-between;
     gap:12px;
     min-height:32px;
   }

   body.page-bible #tab-related .related-inline-back{
     white-space:nowrap;
     padding:6px 10px;
     border-radius:10px;
     font-size:0.95rem;
     min-height:32px;
     display:inline-flex;
     align-items:center;
   }

   body.page-bible #tab-related .related-inline-back[hidden]{
     display:inline-flex !important;
     visibility:hidden !important;
   }

   body.page-bible #tab-related .related-content-header{
     gap:12px !important;
     padding:14px 16px 12px !important;
   }

   body.page-bible #tab-related .related-header-top{
     align-items:center;
   }

   body.page-bible #tab-related .related-header-bottom-left{
     flex-wrap:wrap;
     gap:10px;
   }

   body.page-bible #tab-related .related-content-header .related-current{
     margin:0;
     font-size:clamp(1.1rem, 3.8vw, 1.45rem);
     font-weight:800;
     line-height:1.2;
     white-space:nowrap;
     word-break:keep-all;
     writing-mode:horizontal-tb !important;
     text-orientation:mixed;
     flex:0 0 auto;
   }

   body.page-bible #tab-related .related-chapter-picker select{
     min-height:42px;
     padding:0 14px;
     border-radius:999px;
     border-color:var(--reader-card-border);
     background:var(--reader-card-bg);
     color:var(--reader-text);
     font-weight:700;
   }

   body.page-bible #tab-related .related-chapter-picker select:focus{
     outline:none;
     border-color:var(--tab-point-soft);
     box-shadow:0 0 0 2px color-mix(in srgb, var(--tab-point-soft) 22%, transparent);
   }

   body.page-bible #tab-related .related-header-version-row{
     justify-content:flex-start;
     align-items:center;
     flex-wrap:nowrap;
     gap:10px 14px;
     padding:2px 0 0;
     border-bottom:none;
   }

   body.page-bible #tab-related .related-compare-wrap{
     white-space:nowrap;
     flex:0 0 auto;
     margin-left:2px;
   }

   body.page-bible #tab-related .related-header-version-row .related-top-actions{
     flex:0 0 auto;
     width:auto;
     margin-left:auto;
     justify-content:flex-end;
     padding-top:0;
   }

   body.page-bible #tab-related .related-version-option{
     white-space:nowrap;
   }

   body.page-bible #tab-related .related-list .related-mobile-book-list{
     display:grid;
     grid-template-columns:repeat(2, minmax(0, 1fr));
     gap:10px;
   }

   body.page-bible #tab-related .related-mobile-ref-list{
     display:flex;
     flex-direction:column;
     gap:10px;
   }

   body.page-bible #tab-related .related-version-options{
     gap:8px;
     flex-wrap:nowrap;
   }

   @media (max-width: 540px){
     body.page-bible #tab-related .related-header-version-row{
       display:flex !important;
       flex-wrap:wrap !important;
       width:100% !important;
     }

     body.page-bible #tab-related .related-header-version-row .related-top-actions{
       display:flex !important;
       flex:1 0 100% !important;
       width:100% !important;
       margin-left:0 !important;
       justify-content:flex-end !important;
       padding-top:6px !important;
     }
   }

   @media (min-width: 541px) and (max-width: 768px){
     body.page-bible #tab-related .related-header-version-row{
       display:flex !important;
       align-items:center !important;
       flex-wrap:nowrap !important;
       width:100%;
     }

     body.page-bible #tab-related .related-reader.mobile-open .related-top-actions{
       flex:0 0 auto !important;
       width:max-content !important;
       margin-left:auto !important;
       justify-content:flex-end !important;
       flex-wrap:nowrap !important;
     }
   }

   body.page-bible #tab-related .related-mobile-sheet-head{
     align-items:flex-start;
   }

   body.page-bible #tab-related .related-mobile-sheet-heading{
     flex:1 1 auto;
   }

   body.page-bible #tab-related .related-mobile-sheet-title{
     text-align:left;
   }

   body.page-bible #tab-related .related-mobile-sheet-close[hidden]{
     display:none !important;
   }
   
   body.page-bible #tab-related #relatedReaderContent .chapter-title-main,
   body.page-bible #tab-related #relatedReaderContent .chapter-subtitle,
   body.page-bible #tab-related #relatedReaderContent .verse-text,
   body.page-bible #tab-related #relatedReaderContent .verse-title{
     color:var(--reader-text) !important;
   }
   
   /* Unified popup close button */
   
   body.page-bible #tab-related .related-mobile-close.btn-popup-close{
     display:none !important;
   }
   
   /* =========================
      Related Tab: Final Layout + Scroll + Mobile Sheet
      ========================= */
   body.page-bible #tab-related{
     --border-color:var(--reader-card-border, var(--line));
     --main-bg:var(--reader-card-bg, var(--surface-bg));
     --related-pad-inline:calc(var(--radius) + (var(--radius) / 3));
     --related-pad-bottom:calc(var(--radius) * 1.5);
     --related-edge-gap:calc(var(--radius) / 3);
     --related-empty-min-height:clamp(360px, 56vh, 680px);
   }
   
   body.page-bible #tab-related .related-card{
     border:1px solid var(--border-color);
     background-color:var(--main-bg);
     border-radius:var(--radius);
     min-height:calc(var(--related-empty-min-height) + 88px);
   }
   
   body.page-bible #tab-related .related-layout,
   body.page-bible #tab-related .related-reader{
     height:auto !important;
     min-height:var(--related-empty-min-height) !important;
     max-height:none !important;
   }

   body.page-bible #tab-related .related-layout{
     align-items:stretch;
   }

body.page-bible #tab-related .related-list-wrap,
body.page-bible #tab-related .related-reader{
  min-height:100%;
}

body.page-bible #tab-related .related-reader{
  overflow:visible !important;
  max-height:none !important;
  min-height:0 !important;
}

body.page-bible #tab-related #relatedReaderContent{
  overflow:visible !important;
  max-height:none !important;
  min-height:0 !important;
}
   
   body.page-bible #tab-related #relatedReaderContent{
     margin-bottom:0 !important;
     border-color:var(--border-color) !important;
     background:var(--reader-panel-bg) !important;
     padding-bottom:var(--related-pad-bottom) !important;
   }
   
   body.page-bible #tab-related .related-reader-nav{
     border:1px solid var(--border-color) !important;
     border-top:none !important;
     background:var(--main-bg) !important;
     border-radius:0 0 calc(var(--radius) - 1px) calc(var(--radius) - 1px);
     overflow:hidden;
   }

   body.page-bible #tab-related .related-card.has-no-refs .related-layout{
     min-height:var(--related-empty-min-height);
   }

   body.page-bible #tab-related .related-card.reader-only .related-layout{
     grid-template-columns:minmax(0, 1fr) !important;
   }

   body.page-bible #tab-related .related-card.reader-only .related-reader{
     grid-column:1 / -1;
   }

   body.page-bible #tab-related .related-card.has-no-refs .related-list-wrap{
     display:flex;
     align-items:center;
     justify-content:center;
   }
   
   @media (max-width: 768px){
     body.page-bible #tab-related{
       --related-empty-min-height:clamp(300px, 48vh, 520px);
     }

     body.page-bible #tab-related .related-layout{
       flex-direction:column;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open{
       position:relative !important;
       inset:auto !important;
       padding:0 !important;
       overflow:visible !important;
       background:var(--main-bg) !important;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open #relatedReaderContent{
       padding:
         var(--related-pad-bottom)
         var(--related-pad-inline)
         var(--related-pad-bottom) !important;
       margin-bottom:0 !important;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-reader-nav{
       position:static !important;
       left:auto !important;
       right:auto !important;
       bottom:auto !important;
       margin-top:0 !important;
       box-shadow:none !important;
       backdrop-filter:none !important;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-content-header{
       padding:12px 16px !important;
       background:var(--reader-panel-bg) !important;
       border-color:var(--reader-card-border) !important;
       border-bottom:1px solid var(--reader-card-border) !important;
       border-radius:calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0 !important;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-header-top{
       align-items:center;
       justify-content:space-between;
     }

     body.page-bible #tab-related .related-reader.mobile-open .related-title-group{
       width:auto;
       flex-wrap:nowrap;
       gap:8px;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-header-bottom{
       align-items:center;
     }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-header-bottom-left{
       gap:10px;
     }
     
      body.page-bible #tab-related .related-reader.mobile-open .related-header-bottom-right{
        margin-left:0;
      }
   
     body.page-bible #tab-related .related-reader.mobile-open .related-mobile-close.btn-popup-close{
       display:inline-flex !important;
       flex:0 0 auto;
     }

     body.page-bible #tab-related .related-reader.mobile-open .related-mobile-close.btn-popup-close[hidden]{
       display:none !important;
     }

    /*
     body.page-bible #tab-related .related-head{
       padding-right:92px !important;
     }
    */ 

     body.page-bible .related-mobile-sheet-backdrop{
       top:var(--related-mobile-sheet-top, 0px) !important;
       height:calc(100dvh - var(--related-mobile-sheet-top, 0px)) !important;
       padding:
         0
         calc(var(--radius) / 2)
         calc(env(safe-area-inset-bottom, 0px) + (var(--radius) / 2)) !important;
       display:flex;
       align-items:flex-end;
     }
   
     body.page-bible .related-mobile-sheet{
       width:100%;
       max-height:calc(100dvh - var(--related-mobile-sheet-top, 0px));
       border:1px solid var(--border-color) !important;
       background:var(--main-bg) !important;
       border-radius:calc(var(--radius) * 1.3) calc(var(--radius) * 1.3) var(--radius) var(--radius);
     }
   
     body.page-bible #relatedMobileSheetBack{
       display:none !important;
     }
   
     body.page-bible .related-mobile-sheet-head{
       display:grid !important;
       grid-template-columns:minmax(0, 1fr) auto !important;
       align-items:center;
       gap:var(--related-edge-gap);
       padding:var(--related-pad-inline) var(--related-pad-inline) calc(var(--radius) / 1.5) !important;
       border-bottom:1px solid var(--border-color) !important;
       background:var(--main-bg) !important;
     }
   
     body.page-bible .related-mobile-sheet-title{
       text-align:left;
       color:var(--ink);
     }

     body.page-bible .related-mobile-sheet-subtitle{
       color:color-mix(in srgb, var(--reader-text, var(--ink)) 76%, var(--tab-point-highlight) 24%) !important;
     }
   
     body.page-bible .related-mobile-sheet-close.btn-popup-close{
       position:static !important;
       width:52px !important;
       height:52px !important;
       border-radius:16px !important;
     }
   
     body.page-bible .related-mobile-sheet-head .btn-popup-close:hover,
     body.page-bible .related-mobile-sheet-head .btn-popup-close:focus-visible{
       background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
       border-color:var(--tab-point-soft) !important;
       color:var(--tab-point) !important;
       box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 24%, transparent) !important;
       outline:none;
     }
   
     body.page-bible .related-mobile-book-list{
       display:grid;
       grid-template-columns:repeat(2, minmax(0, 1fr));
       gap:var(--related-edge-gap);
     }
   
     body.page-bible .related-mobile-book-button{
       min-height:calc(var(--radius) * 4);
       border:1px solid color-mix(in srgb, var(--point-color) 40%, var(--border-color));
       background:color-mix(in srgb, var(--main-bg) 90%, var(--point-color) 10%);
       color:var(--ink);
       border-radius:var(--radius);
     }
   
     body.page-bible .related-mobile-book-button:hover,
     body.page-bible .related-mobile-book-button:focus-visible,
     body.page-bible .related-mobile-book-button.active{
       border-color:var(--point-color);
       background:color-mix(in srgb, var(--main-bg) 80%, var(--point-color) 20%);
     }
   }
   
   @media (max-width: 768px){
     body.page-bible .history-filter-fields{
       grid-template-columns:repeat(2, minmax(0, 1fr)) auto !important;
     }
   
     body.page-bible .history-filter-fields .history-apply-btn{
       grid-column:auto !important;
       width:auto !important;
     }
   }
   
   /* Final button unification for Bible page popups, history, and related flows */
   body.page-bible :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ){
     min-height:44px !important;
     padding:0 18px !important;
     border-radius:999px !important;
     font-size:15px !important;
     font-weight:700 !important;
     border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%) !important;
     color:var(--reader-text, var(--ink)) !important;
   }
   body.page-bible :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):hover,
   body.page-bible :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):focus-visible{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
   }
   body.page-bible :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
     transform:translateY(1px);
   }
   body.page-bible :is(
     .memo-index-preset-chip.is-active,
     .memo-index-direct-btn.is-active,
     .history-preset-chip.is-active,
     .history-direct-btn.is-active
   ){
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
   }
   body.page-bible .history-direct-btn{
     margin-left:0 !important;
     border-style:solid !important;
   }
   
   body.page-bible :is(.history-filter-actions, .memo-index-filter-actions){
     gap:12px !important;
   }
   
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields){
     display:grid !important;
     grid-template-columns:minmax(0, 1fr) minmax(0, 1fr) !important;
     gap:12px !important;
     align-items:end !important;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields)[hidden]{
     display:none !important;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) .field{
     min-width:0;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) .field input,
   body.page-bible .memo-index-date{
     min-height:44px !important;
     height:44px !important;
     padding:0 18px !important;
     border-radius:16px !important;
     font-size:15px !important;
     background:color-mix(in srgb, var(--reader-card-bg, var(--surface-bg)) 92%, #000000 8%) !important;
     color:var(--reader-text, var(--ink)) !important;
     border:1px solid color-mix(in srgb, var(--reader-text, var(--ink)) 24%, transparent) !important;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn){
     min-width:92px !important;
     min-height:44px !important;
     height:44px !important;
     padding:0 24px !important;
     border-radius:16px !important;
     align-self:end;
     justify-self:start;
     grid-column:1 / -1;
     border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%) !important;
     color:var(--reader-text, var(--ink)) !important;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):hover,
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):focus-visible{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):active{
     background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 62%, var(--tab-point-highlight) 38%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--tab-point) !important;
     transform:translateY(1px);
   }
   body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) .field-label{
     display:block;
     margin-bottom:10px;
     font-size:14px;
     font-weight:700;
   }
   
   @media (max-width: 720px){
     body.page-bible :is(.history-filter-fields, .memo-index-filter-fields){
       grid-template-columns:minmax(0, 1fr) !important;
     }
     body.page-bible :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn){
       width:auto !important;
       grid-column:1 / -1 !important;
     }
   }
   
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ){
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%) !important;
     border-color:var(--reader-card-border) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):focus-visible,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-preset-chip.is-active,
     .memo-index-direct-btn.is-active,
     .history-preset-chip.is-active,
     .history-direct-btn.is-active
   ){
     background:color-mix(in srgb, var(--reader-card-bg) 76%, var(--tab-point-highlight) 24%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(
     .memo-index-preset-chip,
     .memo-index-direct-btn,
     .history-preset-chip,
     .history-direct-btn
   ):active{
     background:color-mix(in srgb, var(--reader-card-bg) 68%, var(--tab-point-highlight) 32%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn){
     background:color-mix(in srgb, var(--reader-card-bg) 84%, #000000 16%) !important;
     border-color:var(--reader-card-border) !important;
     color:var(--reader-text) !important;
   }
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):hover,
   body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):focus-visible{
     background:color-mix(in srgb, var(--reader-card-bg) 76%, var(--tab-point-highlight) 24%) !important;
     border-color:var(--tab-point-soft) !important;
     color:var(--reader-text) !important;
   }
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) :is(.history-filter-fields, .memo-index-filter-fields) :is(.history-apply-btn, .memo-index-apply-btn):active{
    background:color-mix(in srgb, var(--reader-card-bg) 68%, var(--tab-point-highlight) 32%) !important;
    border-color:var(--tab-point-soft) !important;
    color:var(--reader-text) !important;
  }
  body.page-bible .memo-modal-actions .memo-modal-save,
  body.page-bible .search-actions .btn-primary,
  body.page-bible .history-filter-fields .history-apply-btn,
  body.page-bible .memo-index-apply-btn,
  body.page-bible .history-month-actions .btn-primary,
  body.page-finance #financeSubmitDoc,
  body.page-finance #financeClosedApply{
    box-shadow:none !important;
  }
  body.page-bible .memo-modal-actions .memo-modal-save:hover,
  body.page-bible .memo-modal-actions .memo-modal-save:focus-visible,
  body.page-bible .memo-modal-actions .memo-modal-save:active,
  body.page-bible .search-actions .btn-primary:hover,
  body.page-bible .search-actions .btn-primary:focus-visible,
  body.page-bible .search-actions .btn-primary:active,
  body.page-bible .history-filter-fields .history-apply-btn:hover,
  body.page-bible .history-filter-fields .history-apply-btn:focus-visible,
  body.page-bible .history-filter-fields .history-apply-btn:active,
  body.page-bible .memo-index-apply-btn:hover,
  body.page-bible .memo-index-apply-btn:focus-visible,
  body.page-bible .memo-index-apply-btn:active,
  body.page-bible .history-month-actions .btn-primary:hover,
  body.page-bible .history-month-actions .btn-primary:focus-visible,
  body.page-bible .history-month-actions .btn-primary:active,
  body.page-finance #financeSubmitDoc:hover,
  body.page-finance #financeSubmitDoc:focus-visible,
  body.page-finance #financeSubmitDoc:active,
  body.page-finance #financeClosedApply:hover,
  body.page-finance #financeClosedApply:focus-visible,
  body.page-finance #financeClosedApply:active{
    box-shadow:none !important;
  }
  
  /* 성경 페이지: 내부 패널이 별도 스크롤 컨테이너가 되지 않도록 문서 흐름만 사용 */
  body.page-bible #bibleReader,
  body.page-bible .bible-reader-content{
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  /* Final font-panel and popup action overrides */
  body.page-bible .tab-reader-tools,
  body.page-confession .tab-reader-tools{
    min-width:0;
    max-width:100%;
  }
  body.page-bible .font-control-wrapper,
  body.page-confession .font-control-wrapper{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:auto;
    max-width:100%;
    min-width:0;
    flex:1 1 auto;
  }
  body.page-bible .font-expanded-panel,
  body.page-confession .font-expanded-panel{
    position:relative;
    top:auto;
    left:auto;
    flex:1 1 auto;
    width:auto;
    min-width:0;
    max-width:0;
    transform:translateX(10px);
    overflow:hidden;
    white-space:nowrap;
  }
  body.page-bible .font-expanded-panel.active,
  body.page-confession .font-expanded-panel.active{
    max-width:min(100%, 480px);
    transform:translateX(0);
  }
  body.page-bible .tab-reader-tools{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    flex-wrap:nowrap;
    overflow:visible;
    width:100%;
  }
  body.page-bible .tab-reader-tools .font-control-wrapper{
    max-width:min(100%, 560px);
  }
  body.page-bible .tab-reader-tools .font-expanded-panel{
    max-width:0;
  }
  body.page-bible .tab-reader-tools .font-expanded-panel.active{
    max-width:min(100%, 520px);
  }
  body.page-confession .tab-reader-tools{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    flex-wrap:nowrap;
    overflow:visible;
  }
  body.page-confession .tab-reader-tools .font-control-wrapper{
    flex:0 1 auto;
    max-width:min(100%, 420px);
  }
  body.page-confession .tab-reader-tools .font-expanded-panel.active{
    max-width:min(100%, 380px);
  }
  @media (max-width:640px){
    body.page-bible .tab-reader-tools .font-control-wrapper{
      max-width:100%;
    }
    body.page-bible .tab-reader-tools .font-expanded-panel.active,
    body.page-confession .tab-reader-tools .font-expanded-panel.active{
      max-width:min(100%, 320px);
    }
  }
  @media (max-width:480px){
    body.page-bible .tab-reader-tools,
    body.page-confession .tab-reader-tools{
      gap:6px;
      flex-wrap:nowrap;
    }
    body.page-bible .tab-reader-tools .font-control-wrapper,
    body.page-confession .tab-reader-tools .font-control-wrapper{
      gap:6px;
      max-width:100%;
    }
    body.page-bible .tab-reader-tools .font-expanded-panel.active{
      max-width:min(100%, 260px);
    }
    body.page-confession .tab-reader-tools .font-expanded-panel.active{
      max-width:min(100%, 220px);
    }
  }
  body.page-bible .context-note-popover,
  body.page-bible .context-note-popover *,
  body.page-bible .context-popover,
  body.page-bible .context-popover *{
    box-sizing:border-box;
  }
  body.page-bible .context-note-ref-view-btn,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .context-note-ref-view-btn{
    background:var(--reader-popup-action-bg) !important;
    border-color:var(--reader-popup-action-border) !important;
    color:var(--reader-popup-action-text) !important;
  }
  body.page-bible .context-note-ref-view-btn:hover,
  body.page-bible .context-note-ref-view-btn:focus-visible{
    background:var(--reader-popup-action-bg-hover) !important;
    border-color:var(--tab-point-soft) !important;
    color:var(--reader-popup-action-text) !important;
  }

  /* Refined font control panel */
  :root{
    --font-control-track-height:3px;
    --font-control-thumb-size:16px;
    --font-control-panel-gap:15px;
  }

  .font-trigger-btn{
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, transparent);
    background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 90%, var(--tab-point-highlight) 10%);
    color:var(--reader-text, var(--ink, var(--muted)));
    box-shadow:0 8px 18px rgba(15, 23, 42, 0.08);
    transition:border-color .2s ease, color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .16s ease;
  }
  .font-trigger-btn:hover,
  .font-trigger-btn:focus-visible,
  .font-trigger-btn[aria-expanded="true"],
  .font-trigger-btn.is-active{
    background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 76%, var(--tab-point-highlight) 24%);
    border-color:color-mix(in srgb, var(--tab-point-soft) 72%, var(--reader-card-border, var(--line)) 28%);
    color:var(--tab-point);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 16%, transparent), 0 10px 24px rgba(15, 23, 42, 0.12);
  }
  .font-trigger-btn:active{
    transform:translateY(1px);
  }
  .font-trigger-icon{
    width:18px;
    height:18px;
    stroke-width:1.8;
  }

  .font-expanded-panel,
  body.page-confession .font-expanded-panel,
  body.page-bible .tab-reader-tools .font-expanded-panel{
    width:min(420px, calc(100vw - 88px));
    max-width:0;
    min-height:52px;
    padding:10px 14px;
    gap:var(--font-control-panel-gap);
    border-radius:20px;
    border:0.5px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 70%, transparent);
    background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 88%, transparent);
    box-shadow:0 18px 40px rgba(15, 23, 42, 0.14);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    transform:translate3d(0, calc(-50% - 5px), 0);
    transition:max-width .28s ease, opacity .22s ease, transform .22s ease, padding .22s ease;
  }
  .font-expanded-panel.active,
  body.page-confession .font-expanded-panel.active,
  body.page-bible .tab-reader-tools .font-expanded-panel.active{
    max-width:min(420px, calc(100vw - 88px));
    transform:translate3d(0, -50%, 0);
  }
  .font-expanded-panel .font-control-divider{
    height:24px;
    background:color-mix(in srgb, var(--reader-text, var(--ink)) 12%, transparent);
  }
  .font-expanded-panel .reader-font-select{
    appearance:none;
    -webkit-appearance:none;
    min-width:112px;
    padding:9px 34px 9px 12px;
    border:0.5px solid color-mix(in srgb, var(--reader-text, var(--ink)) 18%, transparent);
    border-radius:12px;
    background-color:color-mix(in srgb, var(--reader-card-bg, #ffffff) 68%, transparent);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3 5.25L7 9.25L11 5.25' stroke='%23647b91' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 12px center;
    background-size:14px 14px;
    color:inherit;
  }
  .font-expanded-panel .reader-font-select:focus{
    outline:none;
    border-color:var(--tab-point-soft);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 18%, transparent);
  }
  .font-expanded-panel .font-size-icon{
    flex:0 0 auto;
    width:18px;
    height:18px;
    color:color-mix(in srgb, var(--reader-text, var(--ink)) 76%, transparent);
  }
  .font-expanded-panel .font-size-icon path{
    fill:none;
    stroke:currentColor;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .font-expanded-panel .font-size-icon-sm path{
    stroke-width:1.6;
  }
  .font-expanded-panel .font-size-icon-lg path{
    stroke-width:1.9;
  }
  .font-expanded-panel input[type="range"],
  body.page-bible .popup-font-control input[type="range"]{
    -webkit-appearance:none;
    appearance:none;
    flex:1 1 auto;
    min-width:84px;
    height:var(--font-control-track-height);
    border:none;
    border-radius:999px;
    background:linear-gradient(
      to right,
      var(--tab-point) 0%,
      var(--tab-point) var(--font-slider-progress, 50%),
      color-mix(in srgb, var(--reader-text, var(--ink)) 14%, transparent) var(--font-slider-progress, 50%),
      color-mix(in srgb, var(--reader-text, var(--ink)) 14%, transparent) 100%
    );
    cursor:pointer;
  }
  .font-expanded-panel input[type="range"]::-webkit-slider-runnable-track,
  body.page-bible .popup-font-control input[type="range"]::-webkit-slider-runnable-track{
    height:var(--font-control-track-height);
    border-radius:999px;
    background:transparent;
  }
  .font-expanded-panel input[type="range"]::-webkit-slider-thumb,
  body.page-bible .popup-font-control input[type="range"]::-webkit-slider-thumb{
    -webkit-appearance:none;
    appearance:none;
    width:var(--font-control-thumb-size);
    height:var(--font-control-thumb-size);
    margin-top:calc((var(--font-control-track-height) - var(--font-control-thumb-size)) / 2);
    border:1px solid color-mix(in srgb, #ffffff 82%, var(--reader-card-border, var(--line)) 18%);
    border-radius:50%;
    background:#ffffff;
    box-shadow:0 3px 10px rgba(15, 23, 42, 0.18);
  }
  .font-expanded-panel input[type="range"]::-moz-range-track,
  body.page-bible .popup-font-control input[type="range"]::-moz-range-track{
    height:var(--font-control-track-height);
    border:none;
    border-radius:999px;
    background:color-mix(in srgb, var(--reader-text, var(--ink)) 14%, transparent);
  }
  .font-expanded-panel input[type="range"]::-moz-range-progress,
  body.page-bible .popup-font-control input[type="range"]::-moz-range-progress{
    height:var(--font-control-track-height);
    border-radius:999px;
    background:var(--tab-point);
  }
  .font-expanded-panel input[type="range"]::-moz-range-thumb,
  body.page-bible .popup-font-control input[type="range"]::-moz-range-thumb{
    width:var(--font-control-thumb-size);
    height:var(--font-control-thumb-size);
    border:1px solid color-mix(in srgb, #ffffff 82%, var(--reader-card-border, var(--line)) 18%);
    border-radius:50%;
    background:#ffffff;
    box-shadow:0 3px 10px rgba(15, 23, 42, 0.18);
  }
  .font-expanded-panel #fontSizeValue,
  .font-expanded-panel #confessionFontSizeValue,
  body.page-bible .popup-font-size-value{
    min-width:30px;
    font-size:11px;
    font-weight:600;
    text-align:right;
    color:color-mix(in srgb, var(--reader-text, var(--ink)) 58%, transparent);
    letter-spacing:-0.01em;
  }

  body.page-bible .popup-font-control-section,
  body.page-bible .font-slider-container{
    width:0;
    max-width:0;
    max-height:40px;
    opacity:0;
    overflow:hidden;
    transform:translateY(-5px);
    transition:max-width .24s ease, opacity .2s ease, transform .2s ease, margin-right .2s ease;
  }
  body.page-bible .popup-font-control-section.popup-font-control-section-open,
  body.page-bible .font-slider-container.popup-font-control-section-open{
    width:144px;
    max-width:144px;
    opacity:1;
    margin-right:2px;
    transform:translateY(0);
  }
  body.page-bible .popup-font-control{
    width:144px;
    min-width:144px;
    max-width:144px;
    height:36px;
    gap:12px;
    padding:0 2px;
  }
  body.page-bible .popup-font-toggle{
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
    border-radius:50%;
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, transparent);
    background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 90%, var(--tab-point-highlight) 10%);
    color:var(--reader-popup-text, var(--reader-text, var(--ink)));
    box-shadow:0 8px 18px rgba(15, 23, 42, 0.08);
    transition:border-color .2s ease, color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .16s ease;
  }
  body.page-bible .popup-font-toggle:hover,
  body.page-bible .popup-font-toggle:focus-visible,
  body.page-bible .popup-font-toggle.popup-font-toggle-active{
    background:color-mix(in srgb, var(--reader-card-bg, #ffffff) 76%, var(--tab-point-highlight) 24%);
    border-color:color-mix(in srgb, var(--tab-point-soft) 72%, var(--reader-card-border, var(--line)) 28%);
    color:var(--tab-point);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--tab-point-soft) 16%, transparent), 0 10px 24px rgba(15, 23, 42, 0.12);
  }
  body.page-bible .popup-font-toggle:active{
    transform:translateY(1px);
  }
  body.page-bible .popup-font-toggle-icon{
    width:18px;
    height:18px;
    stroke-width:1.8;
  }

  body.page-confession:is(.reader-dark-mode, .app-dark-mode) .font-expanded-panel,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .tab-reader-tools .font-expanded-panel{
    background:color-mix(in srgb, var(--reader-card-bg, #1e1e1e) 82%, transparent);
    border-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--reader-text, #ffffff) 24%);
    box-shadow:
      0 16px 30px rgba(0, 0, 0, 0.3),
      0 0 0 1px rgba(255, 255, 255, 0.05);
  }
  body.page-confession:is(.reader-dark-mode, .app-dark-mode) .font-trigger-btn,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .tab-reader-tools .font-trigger-btn,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .popup-font-toggle{
    background:color-mix(in srgb, var(--reader-card-bg, #1e1e1e) 84%, var(--tab-point-highlight) 16%);
    border-color:color-mix(in srgb, var(--reader-card-border, var(--line)) 84%, transparent);
    box-shadow:0 10px 22px rgba(0, 0, 0, 0.26);
  }
  body.page-confession:is(.reader-dark-mode, .app-dark-mode) .font-expanded-panel .reader-font-select,
  body.page-bible:is(.reader-dark-mode, .app-dark-mode) .tab-reader-tools .font-expanded-panel .reader-font-select{
    background-color:color-mix(in srgb, var(--reader-card-bg, #1e1e1e) 74%, transparent);
    border-color:color-mix(in srgb, var(--reader-text, #ffffff) 18%, transparent);
  }

  @media (max-width:560px){
    .font-expanded-panel{
      flex-wrap:wrap;
      row-gap:10px;
    }
  }

  @media (max-width:480px){
    .font-expanded-panel,
    body.page-confession .font-expanded-panel,
    body.page-bible .tab-reader-tools .font-expanded-panel{
      width:min(320px, calc(100vw - 28px));
      max-width:0;
      gap:10px;
      padding:9px 12px;
      border-radius:16px;
    }
    .font-expanded-panel.active,
    body.page-confession .font-expanded-panel.active,
    body.page-bible .tab-reader-tools .font-expanded-panel.active{
      max-width:min(320px, calc(100vw - 28px));
    }
    .font-expanded-panel #fontSizeValue,
    .font-expanded-panel #confessionFontSizeValue{
      display:none;
    }
    body.page-bible .popup-font-control-section.popup-font-control-section-open,
    body.page-bible .font-slider-container.popup-font-control-section-open{
      width:126px;
      max-width:126px;
    }
    body.page-bible .popup-font-control{
      width:126px;
      min-width:126px;
      max-width:126px;
      gap:8px;
    }
    body.page-bible .popup-font-size-value{
      display:none;
    }
  }

  /* =========================
     Popup / Font Control Unification
     ========================= */

  :root{
    --popup-surface:var(--reader-card-bg, var(--surface-bg));
    --popup-surface-border:color-mix(in srgb, var(--reader-card-border, var(--line)) 78%, transparent);
  }

  body.page-bible .popup-panel-standard{
    background:var(--popup-surface) !important;
    border:1px solid var(--popup-surface-border) !important;
    border-radius:16px !important;
    box-shadow:0 22px 44px rgba(15, 23, 42, 0.22) !important;
  }

  body.page-bible .popup-panel-header{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    min-height:40px;
    margin:0;
    padding:0 0 16px;
    border-bottom:1px solid color-mix(in srgb, var(--reader-text, var(--ink)) 10%, transparent);
  }

  body.page-bible .popup-panel-title{
    margin:0;
    flex:1 1 auto;
    min-width:0;
    color:var(--reader-text, var(--ink)) !important;
  }

  body.page-bible .popup-panel-actions{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex:0 0 auto;
    min-width:0;
  }

  body.page-bible .memo-modal-panel{
    padding:16px 14px 14px !important;
    background:var(--popup-surface) !important;
  }

  body.page-bible .memo-modal-head{
    min-height:52px;
    padding-right:80px !important;
    margin-bottom:0;
    position:relative;
  }

  body.page-bible .memo-modal-title{
    font-size:17px !important;
    font-weight:800 !important;
  }


  body.page-bible .context-note-popover.popup-panel-standard{
    width:min(92vw, 520px) !important;
    max-width:min(520px, calc(100vw - 24px)) !important;
    min-width:280px !important;
    padding:22px 22px 20px !important;
    overflow:visible !important;
    border-radius:16px !important;
  }

  body.page-bible .context-note-popover[data-mobile-sheet="true"].popup-panel-standard{
    overflow:hidden !important;
    overscroll-behavior:contain !important;
    padding-bottom:calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-y !important;
    pointer-events:auto !important;
  }

  body.page-bible .context-note-popover[data-mobile-sheet="true"]::before{
    display:none !important;
  }

  body.page-bible .context-note-popover[data-mobile-sheet="true"] .context-note-popover-content{
    min-height:0 !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
    touch-action:pan-y !important;
  }

  body.page-bible .context-note-popover-header{
    align-items:flex-start !important;
    gap:14px !important;
    padding-bottom:16px !important;
    margin-bottom:16px !important;
  }

  body.page-bible .context-note-popover-title{
    font-size:20px !important;
    font-weight:800 !important;
    line-height:1.2 !important;
  }


  body.page-bible .popup-font-control-section,
  body.page-bible .font-slider-container{
    position:static !important;
    width:0 !important;
    min-width:0 !important;
    max-width:0 !important;
    max-height:44px !important;
    margin:0 !important;
    padding:0 !important;
    opacity:0;
    overflow:hidden;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    pointer-events:none;
    transform:none !important;
    transition:max-width .2s ease, opacity .2s ease, margin .2s ease;
    z-index:auto;
    flex:0 0 auto;
  }

  body.page-bible .popup-font-control-section.popup-font-control-section-open,
  body.page-bible .font-slider-container.popup-font-control-section-open{
    width:128px !important;
    min-width:128px !important;
    max-width:128px !important;
    opacity:1;
    pointer-events:auto;
    margin:0 2px 0 0 !important;
  }

  body.page-bible .popup-font-control{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:36px !important;
    gap:6px !important;
    padding:0 !important;
    align-items:center !important;
  }

  body.page-bible .popup-font-control input[type="range"]{
    flex:1 1 auto;
    min-width:0 !important;
  }

  body.page-bible .popup-font-size-value{
    display:none !important;
  }

  body.page-bible .popup-font-toggle,
  body.page-bible .tab-reader-tools .font-trigger-btn,
  body.page-confession .tab-reader-tools .font-trigger-btn{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    border-radius:16px !important;
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 88%, var(--tab-point-highlight) 12%) !important;
    color:var(--reader-text, var(--ink)) !important;
    box-shadow:none !important;
  }

  body.page-bible .popup-font-toggle:hover,
  body.page-bible .popup-font-toggle:focus-visible,
  body.page-bible .tab-reader-tools .font-trigger-btn:hover,
  body.page-bible .tab-reader-tools .font-trigger-btn:focus-visible,
  body.page-confession .tab-reader-tools .font-trigger-btn:hover,
  body.page-confession .tab-reader-tools .font-trigger-btn:focus-visible,
  body.page-bible .tab-reader-tools .font-trigger-btn[aria-expanded="true"],
  body.page-confession .tab-reader-tools .font-trigger-btn[aria-expanded="true"]{
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
    border-color:var(--tab-point-soft) !important;
    color:var(--tab-point) !important;
  }


  body.page-bible .tab-reader-tools,
  body.page-confession .tab-reader-tools{
    overflow:visible !important;
    align-items:center !important;
  }

  body.page-bible .font-control-wrapper,
  body.page-confession .font-control-wrapper{
    position:relative;
    overflow:visible !important;
  }

  body.page-bible .tab-reader-tools .font-expanded-panel,
  body.page-confession .tab-reader-tools .font-expanded-panel{
    position:absolute !important;
    top:50% !important;
    left:56px !important;
    right:auto !important;
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    gap:12px !important;
    width:min(420px, calc(100vw - 112px)) !important;
    min-width:min(280px, calc(100vw - 112px)) !important;
    max-width:min(420px, calc(100vw - 112px)) !important;
    max-height:none !important;
    padding:12px 16px !important;
    background:color-mix(in srgb, var(--reader-card-bg, var(--surface-bg)) 94%, transparent) !important;
    border:1px solid var(--popup-surface-border) !important;
    border-radius:20px !important;
    box-shadow:0 18px 34px rgba(15, 23, 42, 0.18) !important;
    overflow:visible !important;
    white-space:normal !important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translate3d(10px, -50%, 0) !important;
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease !important;
  }

  body.page-bible .tab-reader-tools .font-expanded-panel.active,
  body.page-confession .tab-reader-tools .font-expanded-panel.active{
    max-width:min(420px, calc(100vw - 112px)) !important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate3d(0, -50%, 0) !important;
  }

  body.page-bible .font-panel-group,
  body.page-confession .font-panel-group{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
  }

  body.page-bible .font-panel-group-select,
  body.page-confession .font-panel-group-select{
    flex:0 0 auto;
  }

  body.page-bible .font-panel-group-size,
  body.page-confession .font-panel-group-size{
    flex:1 1 220px;
  }

  body.page-bible .font-expanded-panel .reader-font-select,
  body.page-confession .font-expanded-panel .reader-font-select{
    width:auto;
    min-width:116px;
    max-width:132px;
  }

  body.page-bible .font-expanded-panel input[type="range"],
  body.page-confession .font-expanded-panel input[type="range"]{
    flex:1 1 auto;
    min-width:96px;
  }

  @media (max-width:560px){
    body.page-bible .tab-reader-tools .font-expanded-panel,
    body.page-confession .tab-reader-tools .font-expanded-panel{
      width:calc(100vw - 96px) !important;
      min-width:calc(100vw - 96px) !important;
      max-width:calc(100vw - 96px) !important;
      padding:12px 14px !important;
      gap:12px !important;
    }
  }

  @media (max-width:480px){
    body.page-bible .memo-modal{
      padding:12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
      align-items:flex-start;
    }

    body.page-bible .memo-modal-panel,
    body.page-bible .context-note-popover.popup-panel-standard{
      padding:18px 16px 16px !important;
    }

    body.page-bible .memo-modal-panel{
      width:min(100%, calc(100vw - 24px));
      max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 24px - env(safe-area-inset-bottom, 0px));
    }

    body.page-bible .memo-index-modal{
      padding:12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
      align-items:flex-start;
    }

    body.page-bible .memo-index-panel{
      width:min(100%, calc(100vw - 24px));
      max-width:calc(100vw - 24px);
      max-height:calc(100dvh - var(--sticky-header-offset, 56px) - 24px - env(safe-area-inset-bottom, 0px));
    }

    body.page-bible .popup-panel-header{
      padding-bottom:14px;
    }

    body.page-bible .popup-font-control-section,
    body.page-bible .font-slider-container{
      width:116px !important;
      min-width:116px !important;
      max-width:116px !important;
    }

    body.page-bible .popup-font-control{
      gap:4px !important;
    }

    body.page-bible .tab-reader-tools .font-expanded-panel,
    body.page-confession .tab-reader-tools .font-expanded-panel{
      top:50% !important;
      left:52px !important;
      right:auto !important;
      width:calc(100vw - 92px) !important;
      min-width:calc(100vw - 92px) !important;
      max-width:calc(100vw - 92px) !important;
      align-items:stretch !important;
      flex-direction:column !important;
      gap:10px !important;
      border-radius:18px !important;
      padding:12px !important;
      transform:translate3d(10px, -50%, 0) !important;
    }

    body.page-bible .tab-reader-tools .font-expanded-panel.active,
    body.page-confession .tab-reader-tools .font-expanded-panel.active{
      transform:translate3d(0, -50%, 0) !important;
    }

    body.page-bible .font-expanded-panel .font-control-divider,
    body.page-confession .font-expanded-panel .font-control-divider{
      display:none !important;
    }

    body.page-bible .font-panel-group,
    body.page-confession .font-panel-group{
      width:100%;
    }

    body.page-bible .font-panel-group-select,
    body.page-confession .font-panel-group-select{
      flex:1 1 auto;
    }

    body.page-bible .font-panel-group-size,
    body.page-confession .font-panel-group-size{
      flex:1 1 auto;
      display:grid;
      grid-template-columns:auto minmax(0, 1fr) auto auto;
      align-items:center;
      gap:8px;
    }

    body.page-bible .font-expanded-panel .reader-font-select,
    body.page-confession .font-expanded-panel .reader-font-select{
      width:100%;
      min-width:0;
      max-width:none;
    }

    body.page-bible .font-expanded-panel #fontSizeValue,
    body.page-confession .font-expanded-panel #confessionFontSizeValue{
      display:block !important;
      min-width:32px;
    }
  }

  /* =========================
     Final Responsive Rebuild
     0-480 / 481-560 / 561+
     ========================= */

  body.page-bible,
  body.page-confession{
    --reader-font-trigger-size:44px;
    --reader-font-button-radius:16px;
    --reader-font-toolbar-gap:8px;
    --reader-font-panel-gap:8px;
    --reader-font-panel-top-width:calc(100vw - 96px);
    --reader-font-panel-select-width:88px;
    --reader-font-panel-value-width:34px;
    --reader-font-panel-size-gap:6px;
    --reader-font-popup-slider-width:104px;
  }

  @media (min-width:481px){
    body.page-bible,
    body.page-confession{
      --reader-font-panel-top-width:calc(100vw - 108px);
      --reader-font-panel-select-width:96px;
      --reader-font-panel-value-width:36px;
      --reader-font-panel-size-gap:8px;
      --reader-font-popup-slider-width:112px;
    }
  }

  @media (min-width:561px){
    body.page-bible,
    body.page-confession{
      --reader-font-panel-top-width:min(420px, calc(100vw - 140px));
      --reader-font-panel-select-width:112px;
      --reader-font-panel-value-width:38px;
      --reader-font-panel-size-gap:10px;
      --reader-font-popup-slider-width:120px;
    }
  }

  body.page-bible .tab-reader-tools,
  body.page-confession .tab-reader-tools{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:var(--reader-font-toolbar-gap) !important;
    flex-wrap:nowrap !important;
    overflow:visible !important;
    width:auto !important;
  }

  body.page-bible .font-control-wrapper,
  body.page-confession .font-control-wrapper{
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:var(--reader-font-toolbar-gap) !important;
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    overflow:visible !important;
  }

  body.page-bible :is(
    .popup-font-toggle,
    .tab-reader-tools .font-trigger-btn,
    .confession-reader-tools .font-trigger-btn
  ){
    width:var(--reader-font-trigger-size) !important;
    height:var(--reader-font-trigger-size) !important;
    min-width:var(--reader-font-trigger-size) !important;
    min-height:var(--reader-font-trigger-size) !important;
    border-radius:var(--reader-font-button-radius) !important;
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
    background:var(--reader-panel-bg, var(--surface-bg)) !important;
    color:var(--reader-text, var(--ink)) !important;
    box-shadow:none !important;
  }

  body.page-bible :is(
    .popup-font-toggle:hover,
    .popup-font-toggle:focus-visible,
    .popup-font-toggle.popup-font-toggle-active,
    .tab-reader-tools .font-trigger-btn:hover,
    .tab-reader-tools .font-trigger-btn:focus-visible,
    .tab-reader-tools .font-trigger-btn[aria-expanded="true"],
    .tab-reader-tools .font-trigger-btn.is-active
  ),
  body.page-confession :is(
    .font-trigger-btn:hover,
    .font-trigger-btn:focus-visible,
    .font-trigger-btn[aria-expanded="true"],
    .font-trigger-btn.is-active
  ){
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
    border-color:var(--tab-point-soft) !important;
    color:var(--tab-point) !important;
  }


  body.page-bible .popup-font-control-section,
  body.page-bible .font-slider-container{
    position:absolute !important;
    top:50% !important;
    right:calc(100% + 8px) !important;
    left:auto !important;
    width:0 !important;
    min-width:0 !important;
    max-width:0 !important;
    height:36px !important;
    margin:0 !important;
    padding:0 !important;
    opacity:0;
    overflow:hidden;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    pointer-events:none;
    transform:translateY(-50%) !important;
    transition:max-width .18s ease, opacity .18s ease !important;
    z-index:2 !important;
  }

  body.page-bible .popup-font-control-section.popup-font-control-section-open,
  body.page-bible .font-slider-container.popup-font-control-section-open{
    width:var(--reader-font-popup-slider-width) !important;
    min-width:var(--reader-font-popup-slider-width) !important;
    max-width:var(--reader-font-popup-slider-width) !important;
    opacity:1;
    pointer-events:auto;
  }

  body.page-bible .popup-font-control{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:36px !important;
    gap:6px !important;
    padding:0 !important;
    align-items:center !important;
  }

  body.page-bible .popup-font-control .font-size-icon{
    width:18px !important;
    height:18px !important;
  }

  body.page-bible .popup-font-control input[type="range"]{
    min-width:0 !important;
  }

  body.page-bible .popup-font-size-value{
    display:none !important;
  }

  body.page-bible .tab-reader-tools .font-expanded-panel,
  body.page-confession .tab-reader-tools .font-expanded-panel{
    position:absolute !important;
    top:50% !important;
    left:calc(100% + var(--reader-font-toolbar-gap)) !important;
    right:auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    gap:var(--reader-font-panel-gap) !important;
    width:var(--reader-font-panel-top-width) !important;
    min-width:var(--reader-font-panel-top-width) !important;
    max-width:var(--reader-font-panel-top-width) !important;
    min-height:44px !important;
    padding:10px 12px !important;
    border-radius:18px !important;
    border:1px solid color-mix(in srgb, var(--popup-surface-border) 82%, var(--reader-text, var(--ink)) 18%) !important;
    background:var(--reader-card-bg, var(--surface-bg)) !important;
    box-shadow:
      0 14px 26px rgba(15, 23, 42, 0.14),
      0 0 0 1px color-mix(in srgb, var(--reader-text, var(--ink)) 8%, transparent) !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translate3d(8px, -50%, 0) !important;
    transition:opacity .18s ease, transform .18s ease, visibility .18s ease !important;
    z-index:30 !important;
  }

  body.page-bible .tab-reader-tools .font-expanded-panel.active,
  body.page-confession .tab-reader-tools .font-expanded-panel.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate3d(0, -50%, 0) !important;
  }

  body.page-bible .bible-header-actions .font-expanded-panel,
  body.page-bible #tab-related .related-top-actions .font-expanded-panel,
  body.page-confession .confession-reader-head .font-expanded-panel{
    border-color:color-mix(in srgb, var(--popup-surface-border) 80%, var(--reader-text, var(--ink)) 20%) !important;
    box-shadow:
      0 14px 28px rgba(15, 23, 42, 0.15),
      0 0 0 1px color-mix(in srgb, var(--reader-text, var(--ink)) 9%, transparent) !important;
  }

  body.page-bible .context-note-popover .popup-font-panel{
    border-color:color-mix(in srgb, var(--popup-surface-border) 80%, var(--reader-text, var(--ink)) 20%) !important;
    box-shadow:
      0 14px 28px rgba(15, 23, 42, 0.15),
      0 0 0 1px color-mix(in srgb, var(--reader-text, var(--ink)) 9%, transparent) !important;
  }

  body.page-bible .font-expanded-panel .font-control-divider,
  body.page-confession .font-expanded-panel .font-control-divider{
    height:20px !important;
    flex:0 0 1px !important;
    display:block !important;
  }

  body.page-bible .font-panel-group,
  body.page-confession .font-panel-group{
    display:flex !important;
    align-items:center !important;
    gap:var(--reader-font-panel-size-gap) !important;
    width:auto !important;
    min-width:0 !important;
    flex-wrap:nowrap !important;
  }

  body.page-bible .font-panel-group-select,
  body.page-confession .font-panel-group-select{
    flex:0 0 auto !important;
  }

  body.page-bible .font-panel-group-size,
  body.page-confession .font-panel-group-size{
    flex:1 1 auto !important;
  }

  body.page-bible .font-expanded-panel .reader-font-select,
  body.page-confession .font-expanded-panel .reader-font-select{
    width:var(--reader-font-panel-select-width) !important;
    min-width:var(--reader-font-panel-select-width) !important;
    max-width:var(--reader-font-panel-select-width) !important;
    padding:8px 28px 8px 10px !important;
  }

  body.page-bible .font-expanded-panel .font-size-icon,
  body.page-confession .font-expanded-panel .font-size-icon{
    width:16px !important;
    height:16px !important;
    flex:0 0 auto !important;
  }

  body.page-bible .font-expanded-panel input[type="range"],
  body.page-confession .font-expanded-panel input[type="range"]{
    flex:1 1 auto !important;
    min-width:0 !important;
  }

  body.page-bible .font-expanded-panel #fontSizeValue,
  body.page-confession .font-expanded-panel #confessionFontSizeValue{
    display:inline-block !important;
    min-width:var(--reader-font-panel-value-width) !important;
    font-size:11px !important;
    font-weight:700 !important;
    text-align:right !important;
  }

  body.page-bible .note-popover-header{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:start !important;
    gap:6px !important;
    width:100%;
    margin:0 0 12px;
  }

  body.page-bible .note-popover{
    padding-right:18px !important;
  }

  body.page-bible .note-popover .popup-font-control{
    display:grid !important;
    grid-template-columns:14px minmax(76px, 1fr) 14px auto !important;
    column-gap:2px !important;
    row-gap:0 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    padding:0 !important;
    align-items:center !important;
  }

  body.page-bible .note-popover .popup-font-control input[type="range"]{
    flex:1 1 auto;
    min-width:0 !important;
    width:100% !important;
  }

  body.page-bible .note-popover .popup-font-size-value{
    display:inline-flex !important;
    min-width:30px !important;
    margin-left:0 !important;
    justify-content:flex-end;
    flex:0 0 auto;
    white-space:nowrap;
  }

  body.page-bible .note-popover:not(.context-note-popover) .btn-popup-close{
    position:static !important;
    inset:auto !important;
    margin:0 !important;
    align-self:start !important;
    transform:translateY(-6px);
    justify-self:end;
    flex:0 0 auto;
  }

  body.page-bible .context-note-popover .btn-popup-close{
    position:static !important;
    inset:auto !important;
    margin:0 !important;
    align-self:center !important;
    transform:none !important;
    justify-self:end;
    flex:0 0 auto;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-lead + .term-desc-section{
    margin-top:16px;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-summary{
    margin:0 0 24px;
    padding:0;
    border-bottom:none;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-summary .term-desc-lead{
    margin:0;
    color:color-mix(in srgb, currentColor 92%, #0b2235 8%);
    font-size:calc(16px + var(--bible-popover-font-size-delta, 0px));
    font-weight:700;
    letter-spacing:-0.005em;
    line-height:1.8;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-sections{
    display:flex;
    flex-direction:column;
    gap:12px;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-body + .term-desc-section{
    margin-top:10px;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section + .term-desc-section{
    margin-top:3px;
    padding-top:0;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-label{
    display:block;
    margin:4px 0 4px;
    font-weight:600;
    color:color-mix(in srgb, currentColor 72%, transparent);
    opacity:1;
    font-size:12px;
    letter-spacing:0.01em;
    line-height:1.35;
  }

  body.page-bible .context-note-popover .context-note-synonyms-title{
    font-weight:600;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-label::after{
    content:none;
  }

  body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-body{
    display:block;
    margin:0;
    line-height:1.75;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-lead + .term-desc-section,
  body.page-bible #tab-related .related-description .term-desc-lead + .term-desc-section{
    margin-top:12px;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-body + .term-desc-section,
  body.page-bible #tab-related .related-description .term-desc-body + .term-desc-section{
    margin-top:12px;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-section + .term-desc-section,
  body.page-bible #tab-related .related-description .term-desc-section + .term-desc-section{
    margin-top:6px;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-section-label,
  body.page-bible #tab-related .related-description .term-desc-section-label{
    display:block;
    margin:0 0 1px;
    font-weight:800;
    color:#143f63;
    line-height:inherit;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-section-label::after,
  body.page-bible #tab-related .related-description .term-desc-section-label::after{
    content:none;
  }

  body.page-bible #tab-search .term-context-desc .term-desc-section-body,
  body.page-bible #tab-related .related-description .term-desc-section-body{
    display:block;
    margin:0;
  }

  body.page-bible .context-note-popover .context-note-synonyms{
    margin-top:16px;
  }

  body.page-bible .context-note-popover .context-note-synonyms-title{
    display:block;
    margin:0 0 7px;
    color:color-mix(in srgb, currentColor 74%, transparent);
    opacity:1;
    font-size:13px;
    letter-spacing:0.01em;
    line-height:1.45;
  }

  body.page-bible .context-note-popover .context-note-refs{
    margin-top:16px;
  }

  body.page-bible .context-note-popover .context-note-ref-view-btn{
    margin-top:2px;
  }

  @media (max-width: 768px){
    body.page-bible .note-popover-header{
      grid-template-columns:minmax(0, 1fr) auto;
      gap:6px !important;
    }

    body.page-bible .note-popover .popup-font-control{
      grid-template-columns:12px minmax(68px, 1fr) 12px auto !important;
      width:100% !important;
      min-width:0 !important;
      max-width:none !important;
      column-gap:1px !important;
    }

    body.page-bible .note-popover .popup-font-size-value{
      min-width:28px !important;
      font-size:12px !important;
    }

    body.page-bible .context-note-popover-header{
      padding-bottom:12px !important;
      margin-bottom:12px !important;
    }

    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-summary{
      margin-bottom:22px;
      padding:0;
    }

    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-summary .term-desc-lead,
    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-body{
      line-height:1.8;
    }

    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-summary .term-desc-lead{
      font-size:calc(16px + var(--bible-popover-font-size-delta, 0px));
    }

    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .context-note-desc-sections{
      gap:13px;
    }

    body.page-bible .context-note-popover .context-note-popover-content .note-popover-text .term-desc-section-label{
      margin:5px 0 4px;
    }

    body.page-bible .context-note-popover .context-note-synonyms{
      margin-top:18px;
    }

    body.page-bible .context-note-popover .context-note-refs{
      margin-top:18px;
    }
  }

  /* Bible reader/related action alignment */
  body.page-bible .reader-meta{
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }

  body.page-bible .reader-meta-row{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    column-gap:16px;
    align-items:center;
  }

  body.page-bible .reader-meta-title-group{
    min-width:0;
  }

  body.page-bible .chapter-version-label{
    display:block !important;
    margin:0 0 4px !important;
    line-height:1.1;
    text-align:left;
  }

  body.page-bible .chapter-fixed-title{
    margin:0 !important;
    display:block !important;
    width:100%;
    line-height:1.2;
  }

  body.page-bible .bible-header-actions,
  body.page-bible #tab-related .related-top-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex:0 0 auto;
    min-width:0;
    flex-wrap:nowrap;
  }

  body.page-bible .bible-header-actions{
    grid-area:actions;
    align-self:center;
  }

  body.page-bible .bible-header-actions .tab-reader-tools,
  body.page-bible #tab-related .related-top-actions .tab-reader-tools{
    width:auto !important;
    min-width:0 !important;
    flex:0 0 auto !important;
  }

  body.page-bible .bible-header-actions .font-control-wrapper,
  body.page-bible #tab-related .related-top-actions .font-control-wrapper{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
  }

  body.page-bible :is(.bible-header-actions, #tab-related .related-top-actions) :is(
    .chapter-memo-btn,
    .reader-my-memos-btn,
    .font-trigger-btn
  ){
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    padding:0 !important;
    border-radius:14px !important;
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%) !important;
    background:var(--reader-panel-bg, var(--surface-bg)) !important;
    color:var(--reader-text, var(--ink)) !important;
    box-shadow:none !important;
    gap:0 !important;
  }

  body.page-bible :is(.bible-header-actions, #tab-related .related-top-actions) :is(
    .chapter-memo-btn:hover,
    .chapter-memo-btn:focus-visible,
    .reader-my-memos-btn:hover,
    .reader-my-memos-btn:focus-visible,
    .font-trigger-btn:hover,
    .font-trigger-btn:focus-visible,
    .font-trigger-btn[aria-expanded="true"],
    .font-trigger-btn.is-active
  ){
    background:color-mix(in srgb, var(--reader-panel-bg, var(--surface-bg)) 74%, var(--tab-point-highlight) 26%) !important;
    border-color:var(--tab-point-soft) !important;
    color:var(--tab-point) !important;
  }

  body.page-bible :is(.bible-header-actions, #tab-related .related-top-actions) :is(
    .chapter-memo-btn,
    .reader-my-memos-btn,
    .font-trigger-btn
  ) svg{
    width:18px;
    height:18px;
  }

  body.page-bible .bible-header-actions .font-trigger-btn{    
    transform:translateY(1px);  /* transform:translateY(2px); */
  }

  body.page-bible #tab-related .related-top-actions .font-trigger-btn{
    transform:translateY(1px);  /* transform:translateY(2px); */
  }

  body.page-bible .bible-header-actions .font-expanded-panel{
    top:calc(100% + 10px) !important;
    right:0 !important;
    left:auto !important;
    width:min(420px, calc(100vw - 88px)) !important;
    min-width:240px !important;
    max-width:min(420px, calc(100vw - 88px)) !important;
    transform:translate3d(0, -4px, 0) !important;
  }

  body.page-bible .bible-header-actions .font-expanded-panel.active{
    transform:translate3d(0, 0, 0) !important;
  }

  body.page-bible #tab-related .related-top-actions .font-expanded-panel{
    top:calc(100% + 10px) !important;
    right:0 !important;
    left:auto !important;
    width:min(420px, calc(100vw - 88px)) !important;
    min-width:240px !important;
    max-width:min(420px, calc(100vw - 88px)) !important;
    transform:translate3d(0, -4px, 0) !important;
  }

  body.page-bible #tab-related .related-top-actions .font-expanded-panel.active{
    transform:translate3d(0, 0, 0) !important;
  }

  body.page-bible #tab-related :is(.related-inline-close, .related-mobile-close).btn-popup-close{
    position:static !important;
    inset:auto !important;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    padding:0;
    border-radius:12px;
    border:1px solid color-mix(in srgb, var(--reader-card-border, var(--line)) 76%, var(--tab-point-soft) 24%);
    background:var(--reader-panel-bg, var(--surface-bg));
    color:var(--reader-text, var(--ink));
    box-shadow:none;
    font-size:24px;
    line-height:1;
    transform:none !important;
  }

  body.page-bible #tab-related .related-inline-close.btn-popup-close{
    position:absolute !important;
    inset:16px 18px auto auto !important;
    top:16px !important;
    right:18px !important;
    bottom:auto !important;
    left:auto !important;
  }

  body.page-bible #tab-related .related-header-version-row{
    align-items:center !important;
    gap:10px 14px !important;
  }

  body.page-bible #tab-related .related-header-version-row .related-top-actions{
    margin-left:auto;
  }

  @media (max-width: 768px){
    body.page-bible :is(.bible-header-actions, #tab-related .related-top-actions){
      gap:8px;
    }

    body.page-bible :is(.bible-header-actions, #tab-related .related-top-actions) :is(
      .chapter-memo-btn,
      .reader-my-memos-btn,
      .font-trigger-btn
    ){
      width:40px !important;
      height:40px !important;
      min-width:40px !important;
      min-height:40px !important;
      border-radius:12px !important;
    }

    body.page-bible #tab-related .related-reader.mobile-open .related-top-actions{
      gap:8px !important;
    }
  }

  @media (max-width: 540px){
    body.page-bible .reader-meta-row{
      column-gap:12px;
    }

    body.page-bible #tab-related .related-header-version-row{
      display:flex !important;
      flex-wrap:wrap !important;
      width:100% !important;
    }

    body.page-bible #tab-related .related-header-version-row .related-top-actions{
      flex:1 0 100% !important;
      width:100% !important;
      margin-left:0 !important;
      justify-content:flex-end !important;
      padding-top:6px !important;
    }
  }

  @media (min-width: 769px) and (max-width: 904px){
    body.page-bible #tab-related .related-header-version-row{
      flex-wrap:wrap !important;
      width:100% !important;
    }

    body.page-bible #tab-related .related-header-version-row .related-top-actions{
      flex:1 0 100% !important;
      width:100% !important;
      margin-left:0 !important;
      justify-content:flex-end !important;
      padding-top:6px !important;
    }
  }

  @media (min-width: 769px){
    body.page-bible #tab-related .related-content-header .related-current{
      padding:0 !important;
      border:none !important;
      background:transparent !important;
      box-shadow:none !important;
      outline:none !important;
    }
  }

  @media (max-width: 768px){
    body.page-bible #tab-related .related-mobile-sheet-head{
      display:grid !important;
      grid-template-columns:minmax(0, 1fr) auto !important;
      grid-template-areas:"heading close" !important;
      align-items:center !important;
      gap:14px !important;
    }

    body.page-bible #tab-related .related-mobile-sheet-heading{
      grid-area:heading !important;
      display:flex !important;
      flex-direction:column;
      align-items:flex-start;
      min-width:0;
    }

    body.page-bible #tab-related .related-mobile-sheet-close.btn-popup-close{
      grid-area:close !important;
      position:static !important;
      top:auto !important;
      right:auto !important;
      left:auto !important;
      inset:auto !important;
      margin:0 !important;
      justify-self:end !important;
      align-self:center !important;
    }
  }