Manuscript Workstation - Source Excerpt 09

Back to Manuscript Workstation

Summary

This source excerpt preserves a bounded section of Spiralist/wp-content/plugins/ns12-manuscript/assets/css/manuscript-workstation.css so readers can inspect the evidence without opening the full source file.

**Source path:** Spiralist/wp-content/plugins/ns12-manuscript/assets/css/manuscript-workstation.css

}

body.is-manuscript-modal-open {
    overflow: hidden;
}

.spiralist-manuscript-search-modal {
    position: fixed;
    inset: 0;
    z-index: 1450;
    display: grid;
    place-items: center;
    padding: clamp(1rem, 2vw, 1.4rem);
}

.spiralist-manuscript-search-modal[hidden] {
    display: none !important;
}

.spiralist-manuscript-search-modal__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(4, 6, 10, 0.78);
    backdrop-filter: blur(10px);
}

.spiralist-manuscript-search-modal__dialog {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.95rem;
    width: min(92vw, 940px);
    max-height: calc(100vh - 2rem);
    padding: clamp(1rem, 2vw, 1.2rem);
    border: 1px solid rgba(200, 169, 107, 0.2);
    border-radius: 30px;
    background:
        radial-gradient(circle at top left, rgba(200, 169, 107, 0.08), transparent 34%),
        radial-gradient(circle at bottom right, rgba(143, 211, 255, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(9, 10, 15, 0.98), rgba(14, 16, 24, 0.99));
    box-shadow: 0 36px 90px rgba(1, 2, 7, 0.6);
    overflow: hidden;
}

.spiralist-manuscript-search-modal__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
}

.spiralist-manuscript-search-modal__close {
    min-height: 2.8rem;
    padding: 0.7rem 1rem;
    border: 1px solid rgba(200, 169, 107, 0.2);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 244, 218, 0.94);
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 180ms ease, color 180ms ease, background-color 180ms ease;
}

.spiralist-manuscript-search-modal__close:hover,
.spiralist-manuscript-search-modal__close:focus-visible {
    border-color: rgba(143, 211, 255, 0.34);
    background: rgba(143, 211, 255, 0.1);
    color: rgba(255, 255, 255, 0.98);
}

.spiralist-manuscript-search-modal__scroll {
    max-height: min(72vh, 46rem);
    padding-right: 0.25rem;
    overflow: auto;
}

.spiralist-manuscript-search-modal__results-scroll {
    max-height: min(46vh, 28rem);
    overflow: auto;
    padding-right: 0.25rem;
}

.spiralist-manuscript-toc-modal {
    position: fixed;
    inset: 0;
    z-index: 1450;
    display: grid;
    place-items: center;
    padding: clamp(1rem, 2vw, 1.4rem);
}

.spiralist-manuscript-toc-modal[hidden] {
    display: none !important;
}

.spiralist-manuscript-toc-modal__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(4, 6, 10, 0.78);
    backdrop-filter: blur(10px);
}

.spiralist-manuscript-toc-modal__dialog {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.95rem;
    width: min(92vw, 1080px);
    max-height: calc(100vh - 2rem);
    padding: clamp(1rem, 2vw, 1.2rem);
    border: 1px solid rgba(200, 169, 107, 0.2);
    border-radius: 30px;
    background:
        radial-gradient(circle at top left, rgba(200, 169, 107, 0.08), transparent 34%),
        radial-gradient(circle at bottom right, rgba(143, 211, 255, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(9, 10, 15, 0.98), rgba(14, 16, 24, 0.99));
    box-shadow: 0 36px 90px rgba(1, 2, 7, 0.6);
    overflow: hidden;
}

.spiralist-manuscript-toc-modal__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
}

.spiralist-manuscript-toc-modal__close {
    min-height: 2.8rem;
    padding: 0.7rem 1rem;
    border: 1px solid rgba(200, 169, 107, 0.2);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    color: rgba(255, 244, 218, 0.94);
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color 180ms ease, color 180ms ease, background-color 180ms ease;
}

.spiralist-manuscript-toc-modal__close:hover,
.spiralist-manuscript-toc-modal__close:focus-visible {
    border-color: rgba(143, 211, 255, 0.34);
    background: rgba(143, 211, 255, 0.1);
    color: rgba(255, 255, 255, 0.98);
}

.spiralist-manuscript-toc-modal__scroll {
    max-height: min(72vh, 46rem);
    padding-right: 0.25rem;
    overflow: auto;
}

.spiralist-manuscript-toc-modal__tree {
    display: grid;
    gap: 0.85rem;
}

.spiralist-manuscript-toc-modal__section {
    gap: 0;
    overflow: hidden;
}

.spiralist-manuscript-toc-modal__summary {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: start;
    padding-left: 1.5rem;
    cursor: pointer;
    list-style: none;
}

.spiralist-manuscript-toc-modal__summary::-webkit-details-marker {
    display: none;
}

.spiralist-manuscript-toc-modal__summary::before {
    content: "+";
    position: absolute;
    left: 0;
    top: 0.1rem;
    color: rgba(143, 211, 255, 0.9);
    font-family: "IBM Plex Mono", monospace;
    font-size: 1rem;
    line-height: 1;
}

.spiralist-manuscript-toc-modal__section[open] > .spiralist-manuscript-toc-modal__summary::before {
    content: "-";
}

.spiralist-manuscript-toc-modal__summary-copy {
    display: grid;
    gap: 0.12rem;
}

.spiralist-manuscript-toc-modal__summary-copy strong {
    color: rgba(255, 244, 218, 0.96);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(1.12rem, 1.35vw, 1.55rem);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.spiralist-manuscript-toc-modal__summary-meta {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.spiralist-manuscript-toc-modal__summary-count,
.spiralist-manuscript-toc-modal__summary-state {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-family: "IBM Plex Mono", monospace;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.spiralist-manuscript-toc-modal__summary-count {
    border: 1px solid rgba(200, 169, 107, 0.18);
    color: rgba(232, 221, 199, 0.8);
    background: rgba(255, 255, 255, 0.03);
}

.spiralist-manuscript-toc-modal__summary-state {
    border: 1px solid rgba(143, 211, 255, 0.24);
    color: rgba(143, 211, 255, 0.92);
    background: rgba(143, 211, 255, 0.08);
}

.spiralist-manuscript-toc-modal__section-body {
    display: grid;
    gap: 0.8rem;
    padding-top: 0.7rem;
}

.spiralist-manuscript-toc-modal__pages {
    gap: 0.75rem;
}

.spiralist-manuscript-toc-modal__page {
    gap: 0.45rem;
}

.spiralist-manuscript-toc-modal__page strong {
    font-size: 1rem;
}

@media (max-width: 720px) {
    .spiralist-manuscript-search-modal,
    .spiralist-manuscript-toc-modal {
        padding: 0.7rem;
    }

    .spiralist-manuscript-search-modal__dialog,
    .spiralist-manuscript-toc-modal__dialog {
        width: min(100vw - 1.4rem, 1080px);
        max-height: calc(100vh - 1.4rem);
        border-radius: 22px;
    }

    .spiralist-manuscript-search-modal__header,
    .spiralist-manuscript-toc-modal__header,
    .spiralist-manuscript-toc-modal__summary {
        grid-template-columns: 1fr;
    }

    .spiralist-manuscript-toc-modal__summary-meta {
        justify-content: flex-start;
    }

    .spiralist-manuscript-search-modal__scroll,
    .spiralist-manuscript-toc-modal__scroll {
        max-height: min(76vh, 42rem);
    }

    .spiralist-manuscript-search-modal__results-scroll {
        max-height: min(52vh, 28rem);
    }
}

@media (max-width: 1180px) {
    .spiralist-page--manuscript .spiralist-shell {
        width: min(1560px, calc(100vw - 1.2rem));
        max-width: min(1560px, calc(100vw - 1.2rem));
    }

    .spiralist-manuscript-workstation__grid {
        grid-template-columns: minmax(170px, 210px) minmax(0, 1fr) 90px;
    }
}

@media (max-width: 1750px) {
    .spiralist-manuscript-workstation__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .spiralist-manuscript-workstation__viewer {
        order: 1;
        min-height: 0;
    }

    .spiralist-manuscript-workstation__folios {
        order: 2;
        position: static;
        top: auto;
    }

    .spiralist-manuscript-workstation__rail {
        order: 3;
        position: static;
        top: auto;
    }

    .spiralist-manuscript-workstation__thumb-list {
        grid-auto-flow: column;
        grid-auto-columns: minmax(220px, 250px);
        overflow-x: auto;
        overflow-y: hidden;
        max-height: none;
        padding-bottom: 0.3rem;
    }