/* WordPlace / Woordstroom: one reading axis, separate navigation and controls.
   The paper carries ink; it no longer carries the whole interface. Existing
   photographs, print faces and native four-pose transport remain the material. */
html[data-session-release] #zineApp[data-word-press] {
  --press-stage-width: min(76vw, 1450px);
  --press-stage-height: clamp(380px, calc(100svh - 226px), 870px);
  --press-rest-height: var(--press-stage-height);
  --drive-stage-width: clamp(188px, 20vw, 310px);
  --cassette-stage-width: clamp(185px, 16.5vw, 260px);
  --roller-height: clamp(64px, 8.5vh, 90px);
  --active-gauge-height: clamp(21px, 2.6vh, 27px);
  --press-stage-top: 104px;
  --sheet-inset: clamp(24px, 3vw, 48px);
  --sheet-block-inset: 20px;
  --sheet-min-height: 0px;
  --wordstream-header-space: 0px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 54px minmax(0, 1fr);
  align-content: start;
  gap: 28px;
  height: auto;
  min-height: 100svh;
  max-height: none;
  padding: 22px 28px 40px;
}
#zineApp .wordstream-topline {
  position: relative;
  z-index: 12;
  grid-area: 1 / 1;
  display: flex;
  align-items: center;
  gap: 24px;
  width: min(91vw, 1740px);
  max-width: 100%;
  margin-inline: auto;
}
html[data-session-release] #zineApp[data-word-press] .wordstream-topline .zine-heading {
  position: static;
  display: block;
  inset: auto;
  padding: 0;
  margin: 0;
}
html[data-session-release] #zineApp[data-word-press] #zineGameHeading {
  padding: 0;
  margin: 0;
  color: var(--paper);
  font: 900 clamp(27px, 2.6vw, 39px)/1 var(--print-face);
  transform: none;
  rotate: none;
}
#zineApp .wordstream-topline #zineGameHeading::before { content: none; }
#zineApp[data-run-mode="challenge"][data-phase] .game-name { visibility: visible; }
#zineApp #wordstreamGamesOpen {
  --button-paper: var(--paper);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: .5em;
  min-height: 44px;
  padding: .6rem 1rem .7rem;
  font: 400 21px/1 var(--print-face);
  color: var(--ink);
  transform: none;
}
#zineApp #wordstreamGamesOpen:focus-visible { outline-color: var(--paper); }
html[data-session-release] #zineApp[data-word-press] .zine-game {
  grid-area: 2 / 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: var(--press-stage-height) auto;
  align-content: start;
  width: var(--press-stage-width);
  margin-inline: auto;
  gap: 18px;
  min-height: 0;
}
#zineApp .wordstream-status {
  position: absolute;
  inset: 0;
  z-index: 9;
  pointer-events: none;
}
#zineApp #wordstreamScore {
  position: relative;
  isolation: isolate;
  margin: 0 0 0 auto;
  padding: .55rem 1rem .65rem;
  color: var(--ink);
  font: 900 clamp(24px, 2.3vw, 34px)/1 var(--print-face);
  filter: drop-shadow(1px 2px 1px #1c122744);
}
#zineApp #wordstreamScore::before {
  content: "";
  position: absolute;
  inset: -3px -8px;
  z-index: -1;
  background: url("assets/nachtzine/all-assets-2026-09-13/global/score-paper-v2.webp") center / 100% 100% no-repeat;
}
#zineApp #wordstreamScore #zineLiveScore { position: static; inset: auto; font: inherit; }
#zineApp .wordstream-status #zineRewindBadge {
  position: absolute;
  inset: auto max(24px, calc((100% - 1650px) / 2)) auto auto;
  top: calc(var(--press-stage-top) + var(--press-stage-height) + 24px - var(--cassette-stage-width) * .64574);
  width: var(--cassette-stage-width);
  max-width: none;
  height: auto;
  min-height: 0;
  margin: 0;
}
#zineApp .rewind-read-cue {
  position: absolute;
  z-index: 10;
  top: calc(var(--press-stage-top) + 4px);
  left: 50%;
  translate: -50% 0;
  width: min(330px, 45vw);
  max-height: calc(var(--roller-height) - 6px);
  pointer-events: none;
}
html[data-session-release] #zineApp[data-word-press] .press-assembly {
  grid-area: 1 / 1;
  display: grid;
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
  height: var(--press-stage-height);
  min-height: 0;
}
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet {
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
  min-height: 0;
  padding: 22px var(--sheet-inset) 0;
  gap: 0;
  width: auto;
}
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet > .press-window { min-height: 0; }
html[data-session-release] #zineApp[data-word-press] .zine-game > .zine-controls {
  grid-area: 2 / 1;
  position: relative;
  z-index: 9;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 350px) auto minmax(0, 1fr);
  justify-content: center;
  align-items: center;
  min-height: 58px;
  padding: 0;
  gap: 20px;
}
html[data-session-release] #zineApp[data-word-press] .zine-game > .zine-controls .zine-button {
  width: auto;
  min-width: 0;
  min-height: 54px;
  max-width: 100%;
  padding: .65rem 1.4rem .8rem;
  font: 900 clamp(27px, 2.35vw, 36px)/1.1 var(--print-face);
  white-space: normal;
}
html[data-session-release] #zineApp[data-word-press] .zine-controls .main-action { grid-area: 1 / 2; }
html[data-session-release] #zineApp[data-word-press] .zine-controls :is(.pause-action, .stop-action) {
  grid-area: 1 / 3;
  justify-self: start;
  font-size: clamp(22px, 1.9vw, 28px);
  font-weight: 400;
}
#zineApp .zine-controls .zine-button:focus-visible { outline-color: var(--paper); }
/* A theatre has a floor: operator, wheel and cassette share the lower stage.
   Only their silhouettes overlap the paper margin; never its reading axis. */
html[data-session-release] #zineApp[data-word-press] .zine-poster {
  position: absolute;
  z-index: 7;
  width: var(--drive-stage-width);
  height: calc(var(--drive-stage-width) * .8552);
  left: max(24px, calc((100% - 1650px) / 2));
  right: auto;
  top: calc(var(--press-stage-top) + var(--press-stage-height) - var(--drive-stage-width) * .8552 + 24px);
  bottom: auto;
  margin: 0;
  container-type: normal;
}
html[data-session-release] #zineApp[data-word-press] .zine-poster::before { content: none; }
html[data-session-release] #zineApp[data-word-press] .press-drive {
  width: 100%;
  bottom: 0;
  right: 0;
}
html[data-session-release] #zineApp[data-word-press] .zine-character { width: 55%; left: 8%; top: -39%; }
/* Reuse the authored ring, not the regenerated tube. NO cast shadow belongs
   to the grip or any carrier that includes it, in any interaction state.
   The existing bare wheel, fixed light and counter-rotation remain intact. */
html #zineApp[data-word-press] .press-grip {
  left: 43%; top: 87%; width: 14%; aspect-ratio: 1;
  border-radius: 48% 51% 49% 50%;
  background: #cae851 var(--stock) 12px 19px / 58px;
  background-blend-mode: multiply;
  box-shadow: inset 1px 1px 0 #f3ff9c, inset -1px -2px 0 #6a791e;
  filter: none;
  transform-origin: 50% 50%;
}
html #zineApp[data-word-press] .press-grip::after {
  content: ""; position: absolute; inset: 25%; border-radius: 50%;
  background: #252721 var(--stock) 21px 27px / 100px;
  background-blend-mode: multiply;
  box-shadow: none;
}
html #zineApp[data-word-press] .press-crank,
html #zineApp[data-word-press] .press-crank:not(:disabled):is(:hover, :active),
html #zineApp[data-word-press] .press-grip-orbit { filter: none; }
html[data-session-release] #zineApp[data-word-press] .press-roller-top::before { content: none; }
html[data-session-release] #zineApp[data-word-press] .press-assembly::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 12px;
  bottom: 6px;
  left: -4px;
  width: 22px;
  background: url("assets/nachtzine/asset-direction-2026-09-13/upright-middle-v2.webp") center top / 100% auto repeat-y;
  filter: drop-shadow(1px 3px 1px #170f2370) drop-shadow(6px 8px 5px #170f2330);
  pointer-events: none;
}
/* The two kraft clamps are the only deadline actors on the reading guide.
   Material stays photographic, the black circle is its small mounting bolt. */
#zineApp[data-press-build="platen"] .press-current > .press-clamp {
  position: absolute;
  z-index: 4;
  top: calc((100% - var(--transport-gauge-height) - var(--transport-lip-overlap)) / 8 - 24px);
  width: clamp(24px, 2.3vw, 38px);
  height: 52px;
  background: #b36a25 var(--stock) 72px 23px / 430px;
  background-blend-mode: multiply;
  border: 1px solid #e1ab65;
  box-shadow: inset 1px 0 0 #efc38a, inset -3px 0 1px #62371666, 2px 3px 2px #281a1870;
}
#zineApp .press-clamp-left { left: -9px; }
#zineApp .press-clamp-right { right: -9px; }
#zineApp .press-clamp::after {
  content: "";
  position: absolute;
  width: 14px; height: 14px;
  left: calc(50% - 7px); top: calc(50% - 7px);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 47%, #392819 0 2px, transparent 2.5px), #d1a569 var(--stock) 20px 30px / 340px;
  box-shadow: inset 1px 1px 0 #f3d49a, 1px 2px 1px #33201588;
}
#zineApp .press-guide-left::after, #zineApp .press-guide-right::after { content: none; }
/* Empty cells remain readable as printed outlines. The previous material
   override reduced them to faint pigment: the countdown lost its track.
   Outline and ink share one straight cell; do not retain the older rotated,
   polygon-cut silhouette underneath this rectangular printed treatment. */
html #zineApp[data-word-press] #zineFill > span {
  border: 2px solid #292329;
  background: #f2e6bf;
  mask: none;
  transform: none;
  clip-path: none;
  opacity: 1;
}
/* The old lime insert covered the outline and stayed green on a red lip.
   Keep only a neutral paper well underneath the existing black ink fill. */
html #zineApp[data-word-press] #zineFill > span::before { content: none; }
/* Result content may not grow the apparatus. Compact the printed result,
   not the viewport; only opening the explicit participant list can grow it. */
html[data-session-release] #zineApp[data-word-press]:is([data-phase="idle"], [data-phase="ending"], [data-phase="ended"]) .zine-game {
  grid-template-rows: var(--press-stage-height) auto;
}
html[data-session-release] #zineApp[data-word-press]:is([data-phase="idle"], [data-phase="ending"], [data-phase="ended"]) .press-assembly {
  height: var(--press-stage-height);
  min-height: 0;
}
html[data-session-release] #zineApp[data-word-press]:is([data-phase="idle"], [data-phase="ending"], [data-phase="ended"]) .wordstream-sheet {
  width: auto;
  justify-self: stretch;
  padding: clamp(18px, 2.7vh, 30px) clamp(24px, 4vw, 60px);
}
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .challenge-scene { min-height: 0; }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-content {
  width: min(100%, 760px);
  min-height: 0;
  gap: 12px;
  align-content: center;
}
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-title {
  max-width: 12ch;
  font-size: clamp(48px, 5.1vw, 76px);
  line-height: .98;
}
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-hint { font-size: clamp(22px, 1.9vw, 28px); }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-best { font-size: 21px; padding-top: 14px; }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .score-category { display: block; margin: .4em 0 0; font-size: 18px; }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-score strong { font-size: min(clamp(90px, 10vw, 150px), calc(140cqw / var(--score-length, 2))); }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-missed { max-width: 100%; }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-missed strong { font-size: clamp(21px, 1.8vw, 27px); }
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .session-participant { margin-top: 12px; }
/* A small name slip, not an edge-to-edge form underline. */
html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .session-participant {
  width: min(100%, 410px);
  align-items: center;
  margin-bottom: 0;
  font-size: 18px;
}
#zineApp[data-word-press] .session-participant > label { padding-top: 0; }
#zineApp[data-word-press] .participant-trigger {
  position: relative; isolation: isolate;
  border: 0; padding: .5rem 1rem; font-size: 22px;
  filter: drop-shadow(1px 2px 1px #211d242e);
}
#zineApp[data-word-press] .participant-trigger::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--accent) var(--stock) 31px 53px / 410px;
  background-blend-mode: multiply;
  clip-path: polygon(1% 4%, 33% 0, 68% 3%, 99% 0, 100% 91%, 74% 100%, 31% 95%, 0 100%);
}
@media (min-width: 901px) and (min-height: 561px) {
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-content {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    column-gap: 32px; row-gap: clamp(8px, 1.5vh, 16px);
  }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-title { grid-area: 1 / 1 / 2 / -1; }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-score {
    grid-area: 2 / 1 / 4 / 2; align-self: center;
  }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-score strong {
    font-size: min(clamp(82px, 14vh, 140px), calc(140cqw / var(--score-length, 2)));
  }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-missed { grid-area: 2 / 2; align-self: end; }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .scene-best { grid-area: 3 / 2; align-self: start; padding-top: 0; }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="ending"], [data-phase="ended"]) .wordstream-sheet .session-participant { grid-area: 4 / 1 / 5 / -1; }
  #zineApp[data-word-press][data-press-build="platen"] [data-word-index]:not([data-word-index="0"]) .word-text { font-size: calc(var(--word-size, 76px) * .76); }
}
/* Open party names are a real flow, never a clipped popover at the edge. */
html[data-session-release] #zineApp[data-word-press]:has(.participant-options:not([hidden])) .zine-game {
  grid-template-rows: minmax(var(--press-stage-height), auto) auto;
}
html[data-session-release] #zineApp[data-word-press]:has(.participant-options:not([hidden])) .press-assembly { height: auto; min-height: var(--press-stage-height); }
html[data-session-release] #zineApp[data-word-press]:has(.participant-options:not([hidden])) .wordstream-sheet,
html[data-session-release] #zineApp[data-word-press]:has(.participant-options:not([hidden])) .scene-content { min-height: min-content; }
/* Existing photographed cardboard gets thickness at its fixed edges. No
   stretched endcap, shiny plastic highlight or new bitmap is necessary. */
html #zineApp[data-word-press] .press-roller-top span:nth-child(2) {
  position: relative;
  box-shadow: inset 0 3px 1px #efdfb626, inset 0 -7px 3px #100e1266;
}
html #zineApp[data-word-press] .press-roller-top span:nth-child(2)::after {
  content: ""; position: absolute; inset: 9% 0 7%; pointer-events: none;
  background: linear-gradient(180deg, #f6e3bb14, transparent 30%, #100d132e 85%, #100d1366);
}
/* One stationary floor and three short contact patches place the apparatus
   in one set. They are not children of the rotating wheel or its grip. */
#zineApp[data-word-press] .wordstream-floor {
  position: absolute; z-index: -1; pointer-events: none;
  top: calc(var(--press-stage-top) + var(--press-stage-height) - 8px);
  inset-inline: 0; bottom: 0; min-height: 100px;
  background: linear-gradient(178deg, #88697e, #594063 45%, #3c2a50), var(--stock);
  background-size: auto, 640px; background-blend-mode: multiply;
  mask-image: linear-gradient(transparent, #000 32px);
}
#zineApp .wordstream-floor-shade {
  position: absolute; inset: 0; pointer-events: none;
  background: #140b1d;
  opacity: var(--wordstream-floor-dim, 0);
  transition: opacity 520ms linear;
}
#zineApp[data-moment-world-state="exiting"] .wordstream-floor-shade {
  transition: opacity 700ms cubic-bezier(.22, .61, .36, 1) 280ms;
}
#zineApp[data-moment-world-state="off"] .wordstream-floor-shade { transition: none; }
#zineApp .wordstream-floor::before {
  content: ""; position: absolute; top: 8px; left: 12%; right: 12%; height: 28px;
  background: radial-gradient(ellipse at 50% 25%, #140c22a3, #140c2254 43%, transparent 72%);
}
#zineApp .wordstream-floor::after {
  content: ""; position: absolute; top: 17px; inset-inline: 22px; height: 38px;
  background: radial-gradient(ellipse at center, #100b1b9c, transparent 70%) left center / var(--drive-stage-width) 100% no-repeat;
}
#zineApp:has(#zineRewindBadge:not([hidden])) .wordstream-floor::after {
  background: radial-gradient(ellipse at center, #100b1b9c, transparent 70%) left center / var(--drive-stage-width) 100% no-repeat,
    radial-gradient(ellipse at center, #100b1b9c, transparent 70%) right center / var(--cassette-stage-width) 100% no-repeat;
}
/* Never bounce the sheet to signal a deadline: transport owns the paper. */
#zineApp[data-word-press] #wordstreamSheet { animation: none; }
@media (max-width: 1100px) {
  html[data-session-release] #zineApp[data-word-press] { --press-stage-width: calc(100% - 130px); --drive-stage-width: 170px; }
}
@media (max-width: 900px), (max-height: 560px) {
  html[data-session-release] #zineApp[data-word-press] {
    --press-stage-width: 100%; --press-stage-height: clamp(340px, calc(100svh - 235px), 620px);
    --press-rest-height: 380px; --press-stage-top: 106px;
    --roller-height: 46px; --feed-height: 34px;
    padding: 16px 18px 140px; grid-template-rows: 70px auto; gap: 20px;
  }
  html[data-session-release] #zineApp[data-word-press] .zine-poster { display: none; }
  html[data-session-release] #zineApp[data-word-press] .zine-game { grid-template-rows: var(--press-stage-height) auto; gap: 12px; }
  #zineApp .wordstream-topline { gap: 12px; flex-wrap: wrap; align-content: center; }
  html[data-session-release] #zineApp[data-word-press] #zineGameHeading { font-size: clamp(24px, 4vw, 34px); }
  #zineApp #wordstreamGamesOpen { font-size: 18px; padding-inline: 12px; }
  #zineApp .wordstream-status #zineRewindBadge { top: auto; bottom: 18px; right: 24px; width: 125px; }
  #zineApp .rewind-read-cue { width: min(300px, calc(100% - 40px)); }
  #zineApp #wordstreamScore { font-size: 22px; padding: .45rem .6rem; white-space: nowrap; }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet { padding-top: 10px; }
  html[data-session-release] #zineApp[data-word-press] .zine-game > .zine-controls { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  html[data-session-release] #zineApp[data-word-press] .zine-controls .main-action { grid-column: 1; }
  html[data-session-release] #zineApp[data-word-press] .zine-controls :is(.pause-action, .stop-action) { grid-column: 2; }
  html[data-session-release] #zineApp[data-word-press] .zine-game > .zine-controls .zine-button { font-size: 24px; min-height: 50px; padding: .6rem 1rem .8rem; }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-title { font-size: clamp(40px, 7vw, 64px); }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-hint { font-size: 22px; }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-best { font-size: 19px; padding-top: 4px; }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-content { gap: 10px; }
  html[data-session-release] #zineApp[data-word-press] .wordstream-sheet .scene-score strong { font-size: min(100px, calc(140cqw / var(--score-length, 2))); }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="idle"], [data-phase="ending"], [data-phase="ended"]) .press-assembly { height: auto; min-height: var(--press-rest-height); }
  html[data-session-release] #zineApp[data-word-press]:is([data-phase="idle"], [data-phase="ending"], [data-phase="ended"]) .zine-game { grid-template-rows: minmax(var(--press-rest-height), auto) auto; }
  #zineApp[data-word-press] .wordstream-floor { display: none; }
  html[data-session-release] #zineApp[data-word-press] .press-assembly::after { content: none; }
  #zineApp[data-press-build="platen"] .press-current > .press-clamp { width: 21px; height: 38px; top: calc((100% - var(--transport-gauge-height) - var(--transport-lip-overlap)) / 8 - 17px); }
}
@media (forced-colors: active) {
  html #zineApp[data-word-press] #zineFill > span { border-color: CanvasText; background: Canvas; clip-path: none; }
  html #zineApp[data-word-press] #zineFill > span::after { background: Highlight; }
  #zineApp .wordstream-topline #zineGameHeading { color: CanvasText; }
  #zineApp #wordstreamScore { color: CanvasText; background: Canvas; border: 1px solid CanvasText; filter: none; }
  #zineApp #wordstreamScore::before { content: none; }
  #zineApp #wordstreamGamesOpen:focus-visible, #zineApp .zine-controls .zine-button:focus-visible { outline-color: Highlight; }
  #zineApp .press-clamp, #zineApp .press-assembly::after { display: none; }
  #zineApp .wordstream-floor { display: none; }
  #zineApp .participant-trigger::before { background: Canvas; clip-path: none; border: 1px solid CanvasText; }
}
