.notes-reader[data-view="index"] *{
            box-sizing: border-box;
        }
.notes-reader[data-view="index"]{
            margin: 0;
            padding: 30px 15px;
            background: #eeeeee;
            color: #2a3746;
            font-family: Arial, Helvetica, sans-serif;
            line-height: 1.7;
        }
.notes-reader[data-view="index"] a{
            color: inherit;
            text-decoration: none;
        }
.notes-reader[data-view="index"] .blog-page{
            width: 100%;
            max-width: 900px;
            margin: 0 auto;
            padding: 40px;
            background: #ffffff;
            border-radius: 6px;
            box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
        }
.notes-reader[data-view="index"] .hp-image{
            display: block;
            width: 100%;
            height: auto;
            max-height: 250px;
            margin-bottom: 30px;
            border-radius: 4px;
            object-fit: cover;
        }
.notes-reader[data-view="index"] .page-heading{
            margin: 0 0 8px;
            color: #A1430D;
            font-size: clamp(2rem, 5vw, 3rem);
            line-height: 1.2;
        }
.notes-reader[data-view="index"] .page-description{
            margin: 0 0 24px;
            color: #66717d;
            font-size: 1.05rem;
        }
.notes-reader[data-view="index"] .article-search{
            display: flex;
            gap: 10px;
            margin-bottom: 30px;
        }
.notes-reader[data-view="index"] .article-search input{
            width: 100%;
            min-width: 0;
            padding: 11px 13px;
            border: 1px solid #c8ced4;
            border-radius: 4px;
            color: #2a3746;
            background: #ffffff;
            font: inherit;
        }
.notes-reader[data-view="index"] .article-search input:focus{
            border-color: #A1430D;
            outline: none;
        }
.notes-reader[data-view="index"] .article-search button{
            padding: 11px 18px;
            border: 0;
            border-radius: 4px;
            background: #A1430D;
            color: #ffffff;
            font: inherit;
            font-weight: 700;
            cursor: pointer;
        }
.notes-reader[data-view="index"] .article-list{
            margin: 0;
            padding: 0;
            list-style: none;
            border-top: 1px solid #d7dce1;
        }
.notes-reader[data-view="index"] .article-item{
            border-bottom: 1px solid #d7dce1;
        }
.notes-reader[data-view="index"] .article-card{
            display: grid;
            grid-template-columns: 230px minmax(0, 1fr) 30px;
            align-items: center;
            gap: 20px;
            padding: 24px 6px;
            transition:
                    background-color 0.2s ease,
                    transform 0.2s ease;
        }
.notes-reader[data-view="index"] .article-card:hover, .notes-reader[data-view="index"] .article-card:focus-visible{
            background: #f8f8f8;
            outline: none;
        }
.notes-reader[data-view="index"] .article-card:hover .article-title, .notes-reader[data-view="index"] .article-card:focus-visible .article-title{
            color: #A1430D;
        }
.notes-reader[data-view="index"] .article-image, .notes-reader[data-view="index"] .article-image-placeholder{
            display: block;
            width: 100%;
            height: 135px;
            
            border-radius: 3px;
            object-fit: contain;
            
        }
.notes-reader[data-view="index"] .article-image-placeholder{
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 15px;
            color: #7b858f;
            font-family: Georgia, "Times New Roman", serif;
            font-size: 1.1rem;
            text-align: center;
        }
.notes-reader[data-view="index"] .article-details{
            min-width: 0;
        }
.notes-reader[data-view="index"] .article-series{
            margin: 0 0 3px;
            color: #A1430D;
            font-size: 0.88rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.03em;
        }
.notes-reader[data-view="index"] .article-title{
            margin: 0 0 8px;
            color: #2a3746;
            font-family: Georgia, "Times New Roman", serif;
            font-size: 1.55rem;
            line-height: 1.2;
            transition: color 0.2s ease;
        }
.notes-reader[data-view="index"] .article-meta{
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 8px;
            margin: 0;
            color: #77818c;
            font-size: 0.95rem;
            font-weight: 600;
        }
.notes-reader[data-view="index"] .article-category{
            color: #A1430D;
        }
.notes-reader[data-view="index"] .article-separator{
            color: #a6adb4;
        }
.notes-reader[data-view="index"] .article-arrow{
            color: #A1430D;
            font-size: 2rem;
            line-height: 1;
            text-align: right;
            transition: transform 0.2s ease;
        }
.notes-reader[data-view="index"] .article-card:hover .article-arrow, .notes-reader[data-view="index"] .article-card:focus-visible .article-arrow{
            transform: translateX(4px);
        }
.notes-reader[data-view="index"] .empty-message{
            margin: 0;
            padding: 35px 0;
            color: #77818c;
            text-align: center;
        }
@media (max-width: 700px){.notes-reader[data-view="index"]{
                padding: 0;
                background: #ffffff;
            }
.notes-reader[data-view="index"] .blog-page{
                padding: 25px 20px;
                border-radius: 0;
                box-shadow: none;
            }
.notes-reader[data-view="index"] .article-card{
                grid-template-columns: 125px minmax(0, 1fr) 20px;
                gap: 14px;
                padding: 18px 0;
            }
.notes-reader[data-view="index"] .article-image, .notes-reader[data-view="index"] .article-image-placeholder{
                height: 100px;
            }
.notes-reader[data-view="index"] .article-title{
                font-size: 1.15rem;
            }
.notes-reader[data-view="index"] .article-arrow{
                font-size: 1.5rem;
            }
}
@media (max-width: 480px){.notes-reader[data-view="index"] .article-search{
                flex-direction: column;
            }
.notes-reader[data-view="index"] .article-card{
                grid-template-columns: 95px minmax(0, 1fr);
                align-items: start;
            }
.notes-reader[data-view="index"] .article-image, .notes-reader[data-view="index"] .article-image-placeholder{
                height: 82px;
                font-size: 0.8rem;
            }
.notes-reader[data-view="index"] .article-arrow{
                display: none;
            }
.notes-reader[data-view="index"] .article-meta{
                gap: 4px 7px;
                font-size: 0.82rem;
            }
}
.notes-reader[data-view="index"] .return-button{
            position: fixed;
            left:
                    calc(
                            50%
                            + 450px
                            - 210px
                    );
            bottom: 20px;
            width: 200px;
            z-index: 1000;
        }
.notes-reader[data-view="index"] .return-button a{
            display: block;
            padding: 12px 18px;
            background:
                    rgba(
                            255,
                            255,
                            255,
                            0.96
                    );
            backdrop-filter:
                    blur(8px);
            border:
                    1px solid
                    #d9d9d9;
            border-radius: 6px;
            color: #A1430D;
            font-weight: bold;
            text-align: center;
            text-decoration: none;
            box-shadow:
                    0 6px 18px
                    rgba(0, 0, 0, 0.15);
            transition:
                    all 0.2s ease;
        }
.notes-reader[data-view="index"] .return-button a:hover{
            background: #A1430D;
            color: #ffffff;
        }
@media (max-width: 930px){.notes-reader[data-view="index"] .return-button{
                left: auto;
                right: 20px;
            }
}
.notes-reader[data-view="index"] .article-pinned{
            background:
                    rgba(161, 67, 13, 0.055);

            border-left:
                    4px solid #A1430D;
        }
.notes-reader[data-view="index"] .article-pinned .article-card{
            padding-left: 14px;
            padding-right: 14px;
        }
.notes-reader[data-view="index"] .pinned-label{
            display: inline-flex;
            align-items: center;
            gap: 5px;

            margin-bottom: 4px;

            color: #A1430D;

            font-size: 0.75rem;
            font-weight: 700;

            text-transform: uppercase;
            letter-spacing: 0.06em;
        }
.notes-reader[data-view="index"] .pinned-label span{
            font-size: 0.9rem;
        }

.notes-reader[data-view="index"] .return-button {position: static; width: min(100%, 200px); margin: 1rem auto;}

/* HigherPraise reader palette is fixed; application docks keep the user's theme. */
.notes-reader {
 --body-background-normal:#eeeeee; --body-color-normal:#2a3746;
 --page-background-normal:#ffffff; --page-background-fade:#f8f8f8;
 --page-border-normal:#d7dce1; --header-color-highlight:#A1430D;
 --header-color-normal:#2a3746; --dialog-color-highlight:#A1430D;
 --dialog-background-normal:#ffffff; --dialog-color-normal:#2a3746;
 --dialog-border-normal:#c8ced4; --theme-accent:#A1430D;
}
.notes-reader p, .notes-reader h1, .notes-reader h2, .notes-reader h3,
.notes-reader input, .notes-reader button { font-family:Arial,Helvetica,sans-serif; }

/* The shared form defaults have fixed 30px controls and padded form wrappers.
   Reader search uses its own natural layout and fixed legacy palette. */
.notes-reader[data-view="index"] .article-search {
    margin:0 0 30px; padding:0; border:0; border-radius:0;
    background:transparent; align-items:stretch; text-align:left;
}
.notes-reader[data-view="index"] .article-search input,
.notes-reader[data-view="index"] .article-search button {
    height:auto; min-height:46px; line-height:1.4; margin:0;
    box-sizing:border-box; font-size:16px;
}
.notes-reader[data-view="index"] .article-search input { flex:1 1 0; font-weight:400; }
.notes-reader[data-view="index"] .article-search button { flex:0 0 auto; display:flex; align-items:center; justify-content:center; white-space:nowrap; }
.notes-reader[data-view="index"] .article-search input:focus { background:#fff; color:#2a3746; }
.notes-reader[data-view="index"] .article-search button:hover { background:#84370b; color:#fff; }
.notes-reader[data-view="index"] .article-search :focus-visible { outline:2px solid #A1430D; outline-offset:3px; }
@media(max-width:480px) {
    .notes-reader[data-view="index"] .article-search { flex-direction:column; gap:10px; }
    .notes-reader[data-view="index"] .article-search input,
    .notes-reader[data-view="index"] .article-search button { width:100%; flex:auto; }
}