Manuscript Workstation - Source Excerpt 10
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
.spiralist-manuscript-workstation__tool-buttons {
grid-template-columns: repeat(auto-fit, minmax(8.75rem, 1fr));
grid-auto-flow: row;
}
.spiralist-manuscript-workstation__tool {
min-height: 100%;
}
}
@media (max-width: 980px) {
.spiralist-page--manuscript .spiralist-shell {
width: min(100%, calc(100vw - 1rem));
max-width: min(100%, calc(100vw - 1rem));
}
.spiralist-manuscript-workstation__header,
.spiralist-manuscript-workstation__drawer summary {
grid-template-columns: 1fr;
}
.spiralist-manuscript-workstation__drawer-meta {
padding-right: 0;
}
.spiralist-manuscript-workstation__viewer {
order: 1;
}
.spiralist-manuscript-workstation__folios {
order: 2;
opacity: 1;
transform: none;
}
.spiralist-manuscript-workstation__rail {
order: 3;
opacity: 1;
transform: none;
}
.spiralist-manuscript-workstation__viewport {
min-height: min(72vh, 40rem);
}
}
@media (max-width: 720px) {
.spiralist-manuscript-workstation__header-actions .spiralist-button {
width: 100%;
justify-content: center;
}
.spiralist-manuscript-workstation__drawer-panel {
padding-inline: 0.85rem;
}
.spiralist-manuscript-workstation__viewport {
min-height: min(68vh, 32rem);
}
}
.spiralist-manuscript-workstation__header {
gap: 0.75rem 1rem;
}
.spiralist-manuscript-workstation__title-block {
gap: 0.2rem;
}
.spiralist-manuscript-workstation__header-actions {
align-self: center;
justify-content: flex-end;
gap: 0.55rem;
}
.spiralist-manuscript-workstation__grid {
grid-template-columns: minmax(0, 1fr);
gap: clamp(0.72rem, 0.9vw, 0.95rem);
}
.spiralist-manuscript-workstation__viewer {
order: 1;
gap: 0.62rem;
min-height: clamp(34rem, calc(var(--spiralist-manuscript-stage-min-height) - 0.75rem), 92rem);
}
.spiralist-manuscript-workstation__folios,
.spiralist-manuscript-workstation__rail {
order: 2;
position: static;
top: auto;
gap: 0.7rem;
}
.spiralist-manuscript-workstation__rail {
order: 3;
grid-column: auto;
}
@media (min-width: 981px) and (max-width: 1750px) {
.spiralist-manuscript-workstation__folios {
order: 1;
}
.spiralist-manuscript-workstation__rail {
order: 2;
}
.spiralist-manuscript-workstation__viewer {
order: 3;
}
}
.spiralist-manuscript-workstation__drawer summary {
padding: 0.8rem 2.35rem 0.8rem 0.92rem;
}
.spiralist-manuscript-workstation__viewer .spiralist-manuscript-workstation__panel-head {
grid-template-columns: minmax(0, 1fr);
gap: 0.35rem;
align-items: start;
}
.spiralist-manuscript-workstation__viewer-title-block {
display: grid;
gap: 0.12rem;
}
.spiralist-manuscript-workstation__viewer-summary {
margin: 0;
color: rgba(232, 221, 199, 0.66);
font-size: 0.8rem;
line-height: 1.38;
max-width: 68rem;
}
.spiralist-manuscript-workstation__viewer-toolbar {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
gap: 0.52rem;
padding: 0.56rem 0.64rem;
}
.spiralist-manuscript-workstation__viewer-group {
min-height: 100%;
padding: 0.48rem 0.54rem;
border: 1px solid rgba(200, 169, 107, 0.1);
border-radius: 18px;
background:
radial-gradient(circle at top right, rgba(143, 211, 255, 0.04), transparent 34%),
rgba(255, 255, 255, 0.022);
}
.spiralist-manuscript-workstation__viewer-group--nav {
justify-content: space-between;
}
.spiralist-manuscript-workstation__nav-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
min-height: 2.25rem;
padding: 0.56rem 0.92rem;
border: 1px solid rgba(200, 169, 107, 0.2);
border-radius: 999px;
background: rgba(10, 12, 18, 0.74);
color: rgba(255, 244, 218, 0.94);
font-family: "IBM Plex Mono", monospace;
font-size: 0.72rem;
letter-spacing: 0.06em;
text-decoration: none;
text-transform: uppercase;
transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.spiralist-manuscript-workstation__nav-button:hover,
.spiralist-manuscript-workstation__nav-button:focus-visible {
transform: translateY(-1px);
border-color: rgba(143, 211, 255, 0.34);
box-shadow: 0 16px 28px rgba(4, 6, 12, 0.22);
}
.spiralist-manuscript-workstation__nav-button.is-disabled {
opacity: 0.4;
pointer-events: none;
}
.spiralist-manuscript-workstation__thumb-list {
grid-auto-flow: column;
grid-auto-columns: minmax(340px, 380px);
overflow-x: auto;
overflow-y: hidden;
max-height: none;
padding-bottom: 0.35rem;
scroll-snap-type: x proximity;
}
.spiralist-manuscript-workstation__thumb {
grid-template-columns: 160px minmax(0, 1fr);
gap: 1rem;
padding: 0.92rem;
scroll-snap-align: start;
}
.spiralist-manuscript-workstation__thumb-meta strong {
font-size: 1.06rem;
}
.spiralist-manuscript-workstation__tool-buttons {
grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
gap: 0.62rem;
}
.spiralist-manuscript-workstation__tool {
min-height: 100%;
padding: 0.76rem 0.68rem;
}
.spiralist-manuscript-workstation__viewport {
flex: 1 1 auto;
min-height: clamp(34rem, calc(var(--spiralist-manuscript-stage-min-height) - var(--spiralist-manuscript-viewer-chrome-height)), 58rem);
}
.spiralist-manuscript-workstation__surface {
width: calc(100% - clamp(0.45rem, 1vw, 0.95rem));
max-width: none;
}
.spiralist-manuscript-workstation__book-shell {
padding: clamp(0.28rem, 0.5vw, 0.55rem) clamp(0.38rem, 0.8vw, 0.82rem) clamp(0.5rem, 0.9vw, 0.85rem);
}
.spiralist-manuscript-workstation__spread {
gap: clamp(0.22rem, 0.45vw, 0.48rem);
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.spiralist-manuscript-workstation__spread[data-view-mode="spread"] .spiralist-manuscript-workstation__folio[data-folio-context="true"] {
display: none;
}
.spiralist-manuscript-workstation__folio {
gap: 0.28rem;
}
.spiralist-manuscript-workstation__folio-frame {
padding: clamp(0.52rem, 0.72vw, 0.76rem);
}
.spiralist-manuscript-workstation__folio-chip {
top: 0.75rem;
left: 0.75rem;
}
.spiralist-manuscript-workstation__crop-layer,
.spiralist-manuscript-workstation__study-layer {
inset: clamp(0.52rem, 0.72vw, 0.76rem);
}
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge {
top: 50%;
bottom: auto;
width: clamp(6.8rem, 10vw, 8.8rem);
padding: 0 0.35rem;
opacity: 0.22;
pointer-events: auto;
transform: translateY(-50%);
}
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--prev {
left: 0.55rem;
}
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--next {
right: 0.55rem;
}
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--prev:hover,
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--prev:focus-visible,
[data-edge-hint="prev"] .spiralist-manuscript-workstation__edge--prev {
transform: translateY(-50%) translateX(0.2rem);
}
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--next:hover,
.spiralist-manuscript-workstation__viewport .spiralist-manuscript-workstation__edge--next:focus-visible,
[data-edge-hint="next"] .spiralist-manuscript-workstation__edge--next {
transform: translateY(-50%) translateX(-0.2rem);
}
.spiralist-manuscript-workstation__edge-arrow {
width: clamp(4.4rem, 5vw, 5.3rem);
height: clamp(4.4rem, 5vw, 5.3rem);
font-size: clamp(2.7rem, 3vw, 3.45rem);
}
.spiralist-manuscript-workstation__edge-copy {
display: grid;
gap: 0.12rem;
}
@media (min-width: 1400px) {
.spiralist-manuscript-workstation__spread[data-view-mode="spread"][data-spread-count="3"] {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.spiralist-manuscript-workstation__spread[data-view-mode="spread"][data-spread-count="3"] .spiralist-manuscript-workstation__folio[data-folio-context="true"] {
display: grid;
}
.spiralist-manuscript-workstation__spread[data-view-mode="spread"][data-spread-count="3"]::before {
display: none;
}
.spiralist-manuscript-workstation__viewport {
min-height: clamp(26rem, 56vh, 40rem);
}
}
@media (max-width: 980px) {
.spiralist-manuscript-workstation__header-actions {
justify-content: flex-start;
}