/* scanned case files: /artists/<name> */
.nsf-body { background: #0b0b0b; }
.nsf { max-width: 932px; margin: 0 auto; padding: 150px 16px 64px; color: #cfcac2; }
.nsf a:hover { text-shadow: none; }
.nsf-head { margin: 0 0 28px; font-family: 'Courier New', Courier, monospace; }
.nsf-back, .nsf-end a { color: #9b958c; text-decoration: none; font-size: 13px; letter-spacing: .06em; }
.nsf-back:hover, .nsf-end a:hover { color: #e7e2da; }
.nsf-title { margin: 14px 0 4px; font: 700 34px/1.1 'Courier New', Courier, monospace; letter-spacing: .12em; color: #ece7df; text-shadow: none; }
.nsf-pc { white-space: nowrap; }
.nsf-sub { margin: 0 0 14px; font-size: 13px; letter-spacing: .08em; color: #8f897f; text-transform: uppercase; }
.nsf-actions { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin: 0 0 6px; font-size: 14px; }
.nsf-actions a { color: #e2ddd5; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: #6d675e; }
.nsf-actions a:hover { text-decoration-color: #e2ddd5; }
.nsf-size { margin-left: -12px; color: #7d776e; font-size: 12px; }
.nsf-hint { margin: 0; font-size: 12px; color: #6f6a62; }

.nsf-page { margin: 0 0 34px; }
.nsf-img { display: block; line-height: 0; cursor: zoom-in; box-shadow: 0 2px 4px rgba(0,0,0,.6), 0 14px 34px rgba(0,0,0,.55); }
.nsf-img img { width: 100%; height: auto; display: block; background: #d9d6cf; }
.nsf-img:focus-visible { outline: 2px solid #c9c2b6; outline-offset: 4px; }
.nsf-cap { display: flex; gap: 14px; align-items: baseline; margin: 10px 2px 0; font: 12px/1.4 'Courier New', Courier, monospace; color: #8a847b; letter-spacing: .04em; }
.nsf-n { flex: none; color: #b4ada3; }
.nsf-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nsf-tx { margin: 6px 2px 0; font-family: 'Courier New', Courier, monospace; }
.nsf-tx summary { display: inline-block; cursor: pointer; font-size: 12px; color: #8a847b; letter-spacing: .04em; list-style: none; padding: 4px 0; }
.nsf-tx summary::-webkit-details-marker { display: none; }
.nsf-tx summary::before { content: '+ '; }
.nsf-tx[open] summary::before { content: '- '; }
.nsf-tx summary:hover { color: #d8d2c9; }
.nsf-txt { margin-top: 8px; padding: 16px 18px; background: #151413; border-left: 2px solid #2c2a27; font-size: 13.5px; line-height: 1.55; color: #c9c3ba; overflow-wrap: anywhere; }
.nsf-txt p { margin: 0 0 12px; }
.nsf-txt p:last-child { margin: 0; }
.nsf-txt .redacted { background: #000; color: transparent; padding: 0 .3em; border-radius: 1px; user-select: none; }
.nsf-txt .tx-x { color: #8f897f; font-style: italic; }
.nsf-txt .tx-bates, .nsf-txt .tx-mrz { color: #7d776e; font-size: 12px; }
.nsf-txt .tx-mrz { white-space: pre-wrap; word-break: break-all; }
.nsf-end { margin: 8px 0 0; font-family: 'Courier New', Courier, monospace; }

/* reader: one sheet on the desk, the rest stacked under it (js adds .nsf-reader; without js it stays a list) */
.nsf-reader { overflow-x: clip; }
.nsf-reader .nsf-stage { position: relative; isolation: isolate; width: min(100%, calc(var(--nsf-h, 80vh) * 1632 / 2112)); margin: 0 auto; }
.nsf-reader .nsf-page { display: none; margin: 0; }
.nsf-reader .nsf-page.is-cur { display: block; }
.nsf-reader .nsf-page.is-cur { position: relative; z-index: 2; }
.nsf-reader .nsf-cap { display: none; }
.nsf-reader .nsf-img { cursor: pointer; }
.nsf-under { position: absolute; left: 0; top: 0; width: 100%; aspect-ratio: 1632 / 2112; z-index: 0; background: #c8c4bb; box-shadow: 0 2px 4px rgba(0,0,0,.55); }
.nsf-under-1 { z-index: 1; transform: translate(5px, 6px) rotate(.6deg); background: #cdc9c0; }
.nsf-under-2 { transform: translate(-5px, 11px) rotate(-.8deg); background: #bfbbb2; }
.nsf-under-3 { z-index: -1; transform: translate(9px, 15px) rotate(1.3deg); background: #b3afa6; }
.nsf-under[hidden] { display: none; }
.nsf-reader .nsf-tx summary { display: none; }
.nsf-reader:not(.tx-on) .nsf-tx { display: none; }
.nsf-reader .nsf-tx { margin: 18px 0 0; }
.nsf-reader .nsf-txt { margin: 0; border-left-color: #b22222; }

/* the bar under the page: stays on screen while you read */
.nsf-bar { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 18px -16px 0; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(11,11,11,.95); border-top: 1px solid #2a2825; font-family: 'Courier New', Courier, monospace; }
.nsf-bar[hidden] { display: none; }
html.nsc-open .nsf-reader .nsf-bar.nsf-bar { translate: none; bottom: var(--nsc-h, 0px); }
.nsf-bar button, .nsf-jump { height: 44px; padding: 0 16px; border: 1px solid #4a4640; border-radius: 2px; background: #171615; color: #ece7df; font: 700 14px/1 'Courier New', Courier, monospace; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.nsf-bar button:hover:not(:disabled), .nsf-jump:hover { border-color: #8d867c; background: #211f1d; }
.nsf-bar button:focus-visible, .nsf-jump:focus-visible { outline: 2px solid #e9e3d6; outline-offset: 2px; }
.nsf-bar button:disabled { opacity: .3; cursor: default; }
.nsf-bar .nsf-next { background: #e9e3d6; border-color: #e9e3d6; color: #111; }
.nsf-bar .nsf-next:hover:not(:disabled) { background: #fff; border-color: #fff; }
.nsf-bar .nsf-txtbtn[aria-pressed="true"] { background: #b22222; border-color: #b22222; color: #fff; }
.nsf-pos { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; text-align: center; }
.nsf-pos-n { font-size: 15px; font-weight: 700; color: #ece7df; letter-spacing: .06em; }
.nsf-pos-l { max-width: 100%; overflow-wrap: anywhere; font-size: 11.5px; line-height: 1.3; color: #8a847b; letter-spacing: .03em; }
.nsf-tools { display: flex; gap: 8px; flex: 1 0 100%; min-width: 0; max-width: 100%; }
.nsf-tools button { flex: 1 1 0; }
.nsf-jump { flex: 1.4 1 0; width: 0; min-width: 0; padding: 0 8px; }
.nsf-jump option { text-transform: none; letter-spacing: 0; font-weight: 400; }
@media (min-width: 760px) {
  .nsf-bar { flex-wrap: nowrap; }
  .nsf-prev { order: 1; } .nsf-tools { order: 2; flex: 0 1 auto; } .nsf-pos { order: 3; } .nsf-next { order: 4; }
  .nsf-tools button { flex: none; }
  .nsf-jump { flex: none; width: 142px; }
}
/* computers: the file's heading sits left of the page, so the page starts high and fits the screen;
   with Text on, the typed copy sits right of the page, as tall as the page, and scrolls by itself */
@media (min-width: 1000px) {
  .nsf.nsf-reader { max-width: 1440px; padding-top: 136px; display: grid; grid-template-columns: 230px minmax(0, calc(var(--nsf-h, 80vh) * 1632 / 2112)); justify-content: center; column-gap: 40px; align-items: start; }
  .nsf-reader .nsf-head { grid-column: 1; grid-row: 1; margin: 0; }
  .nsf-reader .nsf-sub .nsf-dot { display: none; }
  .nsf-reader .nsf-sub .nsf-pc { display: block; }   /* the page count on its own line, not wrapped half-way */
  .nsf-reader .nsf-head .nsf-title { font-size: min(34px, calc(228px / (var(--tl, 10) * .72))); white-space: nowrap; }   /* the whole name on one line */
  .nsf-reader .nsf-stage { grid-column: 2; grid-row: 1; }
  .nsf-reader .nsf-bar { grid-column: 1 / -1; grid-row: 2; justify-self: center; width: min(920px, calc(100vw - 48px)); margin: 18px 0 0; }   /* wider than a short page, so the page name has room */
  .nsf-reader .nsf-end { grid-column: 1 / -1; grid-row: 3; }
}
@media (min-width: 1200px) {
  .nsf.nsf-reader.tx-on { grid-template-columns: 230px minmax(0, 1fr); }
  .nsf-reader.tx-on .nsf-stage { width: 100%; }
  .nsf-reader.tx-on .nsf-page.is-cur { display: grid; grid-template-columns: calc(var(--nsf-h) * 1632 / 2112) minmax(0, 1fr); gap: 24px; align-items: start; }
  .nsf-reader.tx-on .nsf-under { width: calc(var(--nsf-h) * 1632 / 2112); }
  .nsf-reader.tx-on .nsf-tx { margin: 0; max-height: var(--nsf-h); overflow: auto; }
  .nsf-reader.tx-on .nsf-txt { margin: 0; }
}

/* full-size viewer */
.nsf-lb { position: fixed; inset: 0; z-index: 2147483000; background: #070707; display: flex; flex-direction: column; }
.nsf-lb[hidden] { display: none; }
.nsf-lb-bar { flex: none; display: flex; align-items: center; gap: 6px; padding: 8px 10px; font: 13px 'Courier New', Courier, monospace; color: #b4ada3; }
.nsf-lb-n { margin-right: auto; padding-left: 6px; }
.nsf-lb button { width: 44px; height: 40px; border: 1px solid #3a3733; background: #161514; color: #e2ddd5; font: 24px/1 Arial, sans-serif; cursor: pointer; border-radius: 2px; }
.nsf-lb button:hover, .nsf-lb button:focus-visible { background: #25231f; outline: none; border-color: #77716a; }
.nsf-lb button:disabled { opacity: .3; cursor: default; }
.nsf-lb-scroll { flex: 1; overflow: auto; -webkit-overflow-scrolling: touch; text-align: center; }
.nsf-lb-scroll img { display: inline-block; width: min(1100px, 100%); height: auto; cursor: zoom-in; vertical-align: top; }
.nsf-lb-scroll.zoom img { width: 1632px; max-width: none; cursor: zoom-out; }
/* the whole sheet sits in the middle of the screen (margin:auto never cuts off a sheet taller than the screen) */
.nsf-lb-scroll:not(.zoom) { display: flex; }
.nsf-lb-scroll:not(.zoom) img { margin: auto; flex: none; }
body.nsf-lock { overflow: hidden; }

/* /artists/: manila folders */
.nsx { max-width: 1120px; margin: 0 auto; padding: 150px 16px 72px; color: #cfcac2; font-family: 'Courier New', Courier, monospace; }
.nsx a:hover { text-shadow: none; }
.nsx-head { margin: 0 0 34px; }
.nsx-title { margin: 0 0 8px; font: 700 34px/1.1 'Courier New', Courier, monospace; letter-spacing: .12em; color: #ece7df; text-shadow: none; text-align: left; }
.nsx-sub { margin: 0; max-width: 640px; font-size: 14px; line-height: 1.5; color: #8f897f; }
.nsx-group { margin: 0 0 46px; scroll-margin-top: 130px; }
.nsx-h2 { display: flex; align-items: baseline; gap: 14px; margin: 0 0 22px; padding-bottom: 8px; border-bottom: 1px solid #2a2825; font: 700 18px/1.2 'Courier New', Courier, monospace; letter-spacing: .14em; color: #e2ddd5; text-shadow: none; }
.nsx-h2 small { font-size: 12px; font-weight: 400; letter-spacing: .08em; color: #7d776e; text-transform: uppercase; }
.nsx-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 26px; }
.nsx-folder { position: relative; display: block; color: #cfcac2; text-decoration: none; transition: transform .2s ease; }
.nsx-folder img { display: block; width: 100%; height: auto; transition: filter .2s ease; }   /* the photo carries its own shadow */
.nsx-name { display: block; margin: -2px 0 0 5%; font-size: 12px; letter-spacing: .04em; color: #8f897f; }
.nsx-name b { color: #e2ddd5; font-size: 13px; letter-spacing: .08em; }
.nsx-name small { font-size: 11.5px; }
.nsx-folder:hover, .nsx-folder:focus-visible { transform: translateY(-6px) rotate(-.6deg); }
.nsx-folder:hover img { filter: drop-shadow(0 12px 14px rgba(0,0,0,.35)) brightness(1.04); }
.nsx-folder:hover .nsx-name b { color: #fff; }
.nsx-folder:focus-visible { outline: 2px solid #c9c2b6; outline-offset: 6px; }
.nsx-credit { margin: 10px 0 0; max-width: 720px; font-size: 11px; line-height: 1.5; color: #6f6a62; }
.nsx-credit a { color: #8f897f; text-decoration: underline; text-underline-offset: 2px; }
.nsx-credit a:hover { color: #cfcac2; }
@media (max-width: 900px) { .nsx-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .nsx { padding: 136px 14px 56px; }
  .nsx-title { font-size: 26px; }
  .nsx-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
  .nsx-name small { display: block; }
}
@media (max-width: 480px) { .nsx-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; } }
@media (prefers-reduced-motion: reduce) { .nsx-folder, .nsx-folder img { transition: none; } }

@media (max-width: 640px) {
  .nsf { padding: 136px 12px 48px; }
  .nsf-title { font-size: 26px; }
  .nsf-page { margin-bottom: 26px; }
  .nsf-bar { margin: 18px -12px 0; padding-left: 12px; padding-right: 12px; }
  /* phones: a compact heading (the way back sits on the name's line) and a two-row bar, so the page and the bar fit a 360x640 screen */
  .nsf.nsf-reader { padding-top: 120px; }
  .nsf-reader .nsf-head { position: relative; margin: 0 0 12px; }
  .nsf-reader .nsf-back { position: absolute; right: 0; top: 0; line-height: 30px; }
  .nsf-reader .nsf-title { margin: 0 0 4px; max-width: calc(100% - 128px); font-size: min(26px, calc((100vw - 152px) / (var(--tl, 10) * .72))); line-height: 30px; white-space: nowrap; }
  .nsf-reader .nsf-sub { margin: 0 0 6px; font-size: 12px; }
  .nsf-reader .nsf-actions { font-size: 13px; margin: 0; }
  .nsf-reader .nsf-bar { margin-top: 10px; padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); gap: 6px 8px; }
  .nsf-reader .nsf-pos-l { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; font-size: 11px; }
  .nsf-under-1 { transform: translate(3px, 5px) rotate(.5deg); }
  .nsf-under-2 { transform: translate(-3px, 9px) rotate(-.6deg); }
  .nsf-under-3 { transform: translate(4px, 12px) rotate(.9deg); }
  .nsf-bar button, .nsf-jump { padding: 0 10px; font-size: 13px; }
  .nsf-txt { padding: 12px 12px; font-size: 13px; }
  .nsf-lb-scroll.zoom img { width: 1400px; }
}
@media print {
  .nsf-head, .nsf-cap, .nsf-tx, .nsf-end, .nsf-lb, .nsf-bar, .nsf-under { display: none !important; }
  .nsf-reader .nsf-page { display: block !important; }
  .nsf-img { box-shadow: none; }
}

/* 10/27 phones: the sheet uses the full width, the heading is two short lines and the bar is one row:
   back | text | page n/N (tap to pick a page) | full size | next. Tap the left or right of the sheet to turn it, the middle to see it whole.
   Real phones also get mobile-override.css (1rem buttons with big padding, 1rem paragraphs, 1.8rem h1), so sizes here are !important */
@media (max-width: 640px) {
  .nsf-reader .nsf-stage { width: 100%; }
  html.mobile-device .nsf-reader .nsf-title { font-size: min(26px, calc((100vw - 152px) / (var(--tl, 10) * .72))) !important; line-height: 30px !important; }
  html .nsf-reader .nsf-sub { font-size: 11.5px !important; line-height: 1.35 !important; margin: 0 0 4px; }
  html .nsf-reader .nsf-actions { font-size: 13px !important; line-height: 1.4 !important; }
  .nsf-reader .nsf-head { margin: 0 0 12px; }
  .nsf-reader .nsf-bar { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1.3fr) 44px; grid-template-areas: "prev txt pos full next"; gap: 6px; align-items: center; }
  .nsf-reader .nsf-tools { display: contents; }
  .nsf-reader .nsf-prev { grid-area: prev; } .nsf-reader .nsf-next { grid-area: next; }
  .nsf-reader .nsf-txtbtn { grid-area: txt; } .nsf-reader .nsf-full { grid-area: full; }
  .nsf-reader .nsf-pos { grid-area: pos; height: 44px; flex-direction: row; justify-content: center; align-items: center; gap: 7px; border: 1px solid #4a4640; border-radius: 2px; background: #171615; }
  .nsf-reader .nsf-pos::after { content: ""; flex: none; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #8d867c; }
  .nsf-reader .nsf-pos-n { font-size: 12px; letter-spacing: .02em; }
  .nsf-reader .nsf-pos-l { display: none; }
  .nsf-reader .nsf-jump { grid-area: pos; position: relative; z-index: 2; width: 100%; height: 44px; opacity: 0; cursor: pointer; }
  .nsf-reader .nsf-prev span:not([aria-hidden]), .nsf-reader .nsf-next span:not([aria-hidden]) { display: none; }
  html .nsf-reader .nsf-bar button { min-height: 44px !important; height: 44px; padding: 0 4px !important; font-size: 12px !important; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html .nsf-reader .nsf-bar .nsf-prev, html .nsf-reader .nsf-bar .nsf-next { padding: 0 !important; font-size: 24px !important; line-height: 1 !important; }
  html .nsf-lb button { padding: 0 !important; min-height: 0 !important; font-size: 22px !important; line-height: 1 !important; }
  .nsf-lb-scroll.zoom img { width: calc(100vw * 2.2); }
  .nsf-reader .nsf-img { cursor: zoom-in; }
}
html .nsf-lb .nsf-lb-zoom { font: 22px/1 Arial, sans-serif; }
/* mobile-override.css caps everything at 100% width on real phones, which kept the zoomed sheet screen-wide */
html.mobile-device .nsf-lb-scroll.zoom img { max-width: none !important; }
@media (max-width: 360px) {
  .nsf-reader .nsf-bar { grid-template-columns: 38px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr) 38px; gap: 5px; }
  html .nsf-reader .nsf-bar button { font-size: 11px !important; letter-spacing: 0; }
}
/* the floating language button (narrow phones) sits above the page bar, not on its buttons */
.nsf-body #ns-lang:not(.nsl-top) { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
.nsf-reader .nsf-pos-n { white-space: nowrap; }
@media (max-width: 360px) {
  .nsf-reader .nsf-bar { grid-template-columns: 34px minmax(0, .8fr) minmax(0, 1.15fr) minmax(0, 1.4fr) 34px; }
  .nsf-reader .nsf-pos { gap: 4px; }
  .nsf-reader .nsf-pos-n { font-size: 11px; letter-spacing: 0; }
}
html .nsf-reader .nsf-bar button.nsf-2l { white-space: normal !important; overflow-wrap: anywhere; line-height: 1.1 !important; font-size: 10.5px !important; letter-spacing: 0; text-overflow: clip; }
html .nsf-reader .nsf-bar button.nsf-2s { font-size: 9.5px !important; }

/* until ns-file.js has sized the sheet (it is deferred) the page is already in reader layout (inline script in the
   page) and the sheet area is held empty, so the sheets never show as a big full-width stack that then shrinks */
.nsf-pre .nsf-stage { visibility: hidden; }
.nsf-pre .nsf-page:first-of-type { display: block; }