body {
    overflow-x: hidden;  /* hide the horizontal slide of <main> during swipe nav */
}
#pagefix-open {
    font-size: smaller;
}

#pagefix {
    display: none;
}
#pagefix-cancel {
    display: none;
}
#pagefix-success-msg {
    display: none;
}
#pagefix-footer {
    --bs-gutter-x: 0;
}
#text-sure {
    white-space: break-spaces;
    margin-bottom: 1em;
    margin-top: 1.5em;
}
input#id_captcha_0 {
    width: 4em;
}

.reader-title {
    margin-bottom: 0.75rem;
    line-height: 1.3;
}
.reader-title a {
    color: var(--bs-body-color);
}
.reader-title a:hover {
    color: var(--hl-color);
}
.reader-image {
    border-radius: 0.25rem;
    box-shadow: 0 0 0 1px var(--border-color);
}
.reader-text-col {
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
}
@media (min-width: 1400px) {
    .reader-text-col {
        margin-left: 0;
    }
}

.pager {
    display: inline-flex;
    align-items: stretch;
    gap: 0.35rem;
    margin: 0.25rem 0;
    font-size: 0.9rem;
}
.pager-arrow {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--surface);
    --bs-btn-border-color: var(--border-color);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--surface-hover);
    --bs-btn-hover-border-color: var(--border-color-hover);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--surface-hover);
    --bs-btn-active-border-color: var(--border-color-hover);
    --bs-btn-disabled-color: rgba(255, 255, 255, 0.25);
    --bs-btn-disabled-bg: var(--surface);
    --bs-btn-disabled-border-color: var(--border-color);
    --bs-btn-disabled-opacity: 1;
    min-width: 2.2rem;
    padding: 0.15rem 0.5rem;
    font-size: 0.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.pager-count {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.15rem 0.45rem;
    background-color: var(--surface);
    border: 1px solid var(--border-color);
    border-radius: var(--bs-border-radius);
    font-variant-numeric: tabular-nums;
}
.pager-total {
    color: var(--muted);
    white-space: nowrap;
}
.pagenum-input {
    width: 2.8em;
    padding: 0.05rem 0.25rem;
    font-size: 0.9rem;
    text-align: center;
    border: 1px solid transparent !important;
    border-radius: var(--bs-border-radius-sm);
    outline: none;
    background-color: rgba(0, 0, 0, 0.3) !important;
}
.pagenum-input:focus {
    border-color: var(--hl-color) !important;
}

.extra-words {
    font-size: 0.9rem;
    color: var(--muted);
}
.extra-words h2 {
    color: var(--muted);
    margin-bottom: 0.4rem;
}
@media (pointer: coarse) {  /* touch screens: invisible 44px tap area, same look */
    .pager-arrow {
        position: relative;
    }
    .pager-arrow::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: max(100%, 44px);
        height: max(100%, 44px);
        transform: translate(-50%, -50%);
    }
}