/* Woordstroom transport, 14 September 2026. One physical sheet, four printed
   lines, and a stepped time gauge in the active reading frame's lower lip.
   The existing palette, paper photographs and print face remain the source. */
#zineApp[data-press-build="platen"] {
  /* Preserve the authored four-row pitch and fixed bottom ink aperture. This
     stock reserve does not move when the physical meter changes position. */
  --transport-gauge-height: clamp(24px, 3.7vh, 36px);
  --transport-lip-overlap: calc(var(--feed-height) * .13);
  --active-gauge-height: clamp(14px, 2vh, 18px);
}
#zineApp[data-press-build="platen"] .zine-words {
  height: calc(100% - var(--transport-gauge-height) - var(--transport-lip-overlap));
}
#zineApp[data-press-build="platen"] .zine-words li {
  margin: 0;
  padding: 0;
}
#zineApp[data-press-build="platen"] .paper-row,
#zineApp[data-press-build="platen"] [data-word-index]:not([data-word-index="0"]) .paper-row {
  padding: clamp(10px, 1.8vh, 18px) clamp(28px, 4vw, 64px);
}
/* Keep the current word exactly at its proven .90 × 1.10 size. Previews use
   .88 of that same fitted base, with full-strength ink. Promotion from .88
   to 1.10 follows the four held paper poses; row metrics never change. */
#zineApp[data-press-build="platen"] .word-text,
#zineApp[data-press-build="platen"] [data-word-index]:not([data-word-index="0"]) .word-text {
  font-size: calc(var(--word-size, 76px) * .90);
  line-height: 1;
  translate: 0 3px;
  transform: scale(.88);
  transform-origin: 50% 50%;
  transition: none;
}
#zineApp[data-press-build="platen"] [data-word-index="0"] .word-text,
#zineApp[data-press-build="platen"] [data-press-ghost] .word-text {
  transform: scale(1.1);
}
#zineApp[data-press-build="platen"] .press-current {
  inset: 0 -10px;
  height: auto;
  filter: drop-shadow(.6px 1.3px .35px #34281980) drop-shadow(0 2.5px 1.1px #211d2426);
}
/* Four cut-card faces, not a stroked digital rectangle. The existing stock
   photograph supplies fibres; a paper light and kraft edge give shallow
   thickness without taking even one pixel from the safe reading aperture. */
#zineApp[data-press-build="platen"] .press-current > .press-guide-top,
#zineApp[data-press-build="platen"] .press-current > .press-guide-left,
#zineApp[data-press-build="platen"] .press-current > .press-guide-right,
#zineApp[data-press-build="platen"] .press-current > .press-guide-bottom {
  background: var(--action) var(--stock) 100px 100px / 560px;
  background-blend-mode: multiply;
  box-shadow: inset 0 1px 0 #f2e5cfb8, inset 0 -2px 0 #8c785277, inset 1px 0 0 #f2e5cf70;
}
#zineApp[data-press-build="platen"] .press-guide-top {
  display: block;
  top: -2px;
  height: 10px;
  clip-path: polygon(0 14%, 11% 4%, 27% 10%, 43% 0, 61% 8%, 78% 3%, 93% 11%, 100% 4%, 99.7% 89%, 84% 100%, 64% 88%, 45% 96%, 24% 87%, 9% 100%, 0 91%);
}
#zineApp[data-press-build="platen"] .press-guide-left,
#zineApp[data-press-build="platen"] .press-guide-right {
  top: 3px;
  bottom: auto;
  height: calc((100% - var(--transport-gauge-height) - var(--transport-lip-overlap)) / 4 - 1px);
  width: 14px;
}
#zineApp[data-press-build="platen"] .press-guide-left {
  clip-path: polygon(8% 0, 94% 1%, 100% 21%, 88% 49%, 95% 72%, 88% 100%, 4% 100%, 0 72%, 7% 42%, 0 15%);
}
#zineApp[data-press-build="platen"] .press-guide-right {
  clip-path: polygon(4% 0, 92% 0, 100% 31%, 92% 54%, 98% 79%, 87% 100%, 0 99%, 8% 68%, 0 38%, 7% 14%);
}
/* The existing timer IS the active frame's fixed lower rail. It remains
   visible throughout every feed, in front of the moving printed paper.
   Only this narrow physical strip occludes passing ink; row locations and
   sheet dimensions stay unchanged. No feed mask or fade belongs on the lip. */
#zineApp[data-press-build="platen"] .press-current::after {
  content: none;
}
#zineApp[data-press-build="platen"] .press-guide-bottom {
  inset: calc((100% - var(--transport-gauge-height) - var(--transport-lip-overlap)) / 4 - 4px) 0 auto;
  height: var(--active-gauge-height);
  z-index: 1;
  opacity: 1;
  clip-path: polygon(0 5%, 13% 0, 31% 5%, 46% 0, 65% 7%, 83% 1%, 100% 6%, 99.7% 89%, 86% 100%, 67% 93%, 48% 100%, 28% 92%, 11% 100%, .3% 91%);
}
#zineApp[data-press-build="platen"] .time-paper {
  width: min(82%, 620px);
  height: calc(var(--active-gauge-height) - 4px);
}
/* A printed reverse stamp uses the existing empty margin left of the cells.
   Its own cue never hides or moves the permanent timer underneath it. */
#zineApp[data-press-build="platen"] .press-guide-bottom::before {
  content: "";
  position: absolute;
  top: 3px;
  left: clamp(8px, 1vw, 13px);
  width: clamp(14px, 1.4vw, 18px);
  height: calc(var(--active-gauge-height) - 6px);
  background: var(--ink) var(--xerox) 20px 100px / 360px;
  clip-path: polygon(0 50%, 45% 0, 45% 100%, 0 50%, 50% 50%, 95% 0, 95% 100%, 50% 50%);
  visibility: hidden;
  pointer-events: none;
}
#zineApp[data-press-build="platen"][data-rewind-cue="used"] .press-guide-bottom::before {
  visibility: visible;
  animation: wordstream-guide-reverse-stamp 640ms steps(1, end) both;
}
@keyframes wordstream-guide-reverse-stamp {
  0%, 12.5% { opacity: 0; transform: translateY(1px) rotate(-4deg); }
  25% { opacity: 1; transform: translateY(0) rotate(-2deg); }
  37.5% { opacity: 1; transform: translateY(-1px) rotate(1deg); }
  50%, 62.5%, 75% { opacity: 1; transform: translateY(0) rotate(-1deg); }
  87.5%, 100% { opacity: 0; transform: none; }
}
/* The stock's pigment and natural side fibres share a cumulative offset.
   Row perforations belong to the moving printed rows; a separate repeating
   perforation mask would have a different pitch once the gauge is reserved. */
html #zineApp[data-press-build="platen"] .press-stock::before {
  mask-image: url("assets/nachtzine/all-assets-2026-09-13/global/paper-edge-left-v3.webp"), linear-gradient(#000, #000), url("assets/nachtzine/all-assets-2026-09-13/global/paper-edge-right-v3.webp");
  mask-size: 28px 274px, calc(100% - 54px) 100%, 28px 274px;
  mask-position: left var(--press-paper-offset, 0px), center, right var(--press-paper-offset, 0px);
  mask-repeat: repeat-y, no-repeat, repeat-y;
  mask-composite: add, add;
}
/* The mechanical axle is fixed to the housing. Previous deadline decoration
   moved/rotated this whole parent, making a correctly registered IMG wobble.
   The platen can still respond to pressure independently of the axle. */
html #zineApp[data-word-press][data-press-build="platen"][data-phase] .press-drive {
  translate: none;
  rotate: none;
  transition: none;
}
html #zineApp[data-press-build="platen"] #pressWheel {
  translate: none;
  rotate: none;
  scale: none;
}
@media (max-width: 900px), (max-height: 560px) {
  #zineApp[data-press-build="platen"] {
    --transport-gauge-height: 24px;
    --transport-lip-overlap: calc(var(--feed-height) * .4);
  }
  #zineApp[data-press-build="platen"] .paper-row,
  #zineApp[data-press-build="platen"] [data-word-index]:not([data-word-index="0"]) .paper-row { padding: 9px 24px; }
  #zineApp[data-press-build="platen"] .word-text,
  #zineApp[data-press-build="platen"] [data-word-index]:not([data-word-index="0"]) .word-text { translate: 0 2px; }
}
@media (forced-colors: active) {
  html #zineApp[data-press-build="platen"] .press-stock::before { mask: none; }
  #zineApp[data-press-build="platen"] .press-current { border: 0; filter: none; }
  #zineApp[data-press-build="platen"] .press-current > .press-guide-top,
  #zineApp[data-press-build="platen"] .press-current > .press-guide-left,
  #zineApp[data-press-build="platen"] .press-current > .press-guide-right,
  #zineApp[data-press-build="platen"] .press-current > .press-guide-bottom { background: Canvas; box-shadow: none; }
  #zineApp[data-press-build="platen"] .press-guide-bottom { outline: 1px solid CanvasText; }
  #zineApp[data-press-build="platen"] .press-guide-bottom::before { background: CanvasText; }
}
@media (prefers-reduced-motion: reduce) {
  #zineApp[data-press-build="platen"][data-rewind-cue="used"] .press-guide-bottom::before {
    animation: none;
    opacity: 1;
    transform: none;
  }
}