/* WordPlace / material craft. Existing six-game compositions and palettes stay.
   This layer owns substrates/contact only; flowbot-print-craft owns the ink.
   No new motion loop, layout track, transformed 3-D ancestor, or rasterised text. */
:root {
  --material-fibre: url("assets/nachtzine/all-assets-2026-09-13/global/score-paper-v2.webp");
  --material-sheet-flat: url("assets/nachtzine/all-assets-2026-09-13/story-post/note-a-matte-v1.webp");
  --material-contact: #231b2547;
  --material-rest: drop-shadow(.5px 1px .5px #231b2540);
  --material-slip: drop-shadow(.6px 1.2px .6px #231b2554) drop-shadow(1.6px 3px 2px #231b2521);
  --material-object: drop-shadow(1px 2.2px .8px #231b2566) drop-shadow(3px 7px 4px #231b2533);
}

/* One flat photographic sheet, not an enlarged curled book leaf. The first
   nine-slice trial left a ruler-straight highlight at its seams; the final
   surface uses the quiet centre at its original ratio and the real fibrous
   alpha contour separately. No baked fold or bevel can stretch. This pseudo
   remains part of the same departure clone as the printed words. */
.fs-stage :is(.fs-sandbox-words,.fs-letter)::before {
  background: var(--material-sheet-flat) center / cover no-repeat;
  mask: var(--material-sheet-flat) center / 100% 100% no-repeat;
  filter: var(--material-rest);
}
.fs-stage :is(.fs-sandbox-words,.fs-letter)::after {
  /* Opaque recovery underneath the photo, not another visible sheet. */
  inset: 16px;
}
.fs-stage .fs-paper-art { filter: var(--material-object); }
.fs-stage .fs-action { filter: var(--material-slip); }
.fs-stage .fs-action:not(:disabled):active { filter: var(--material-rest); }

/* Small controls must keep their own ripped edge. The previous four additive
   masks overlapped and filled each other's left/right tears on narrow pills,
   producing a square digital OPEN tile. Broad action strips use the shared
   height-scaled tears in shipping-controls; only option chips stretch a cut. */
.fs-stage .fs-choice::before {
  mask: var(--material-fibre) center / 100% 100% no-repeat;
}
.fs-stage :is(.fs-choice,.fs-action)::before { box-shadow: none; }
.fs-stage .fs-choice { filter: var(--material-slip); }
.fs-stage .fs-choice[aria-pressed="true"] { filter: var(--material-rest); }
.fs-stage .fs-choice[aria-pressed="true"]::after {
  height: 3px;
  clip-path: polygon(0 24%,22% 0,59% 20%,100% 5%,99% 85%,69% 100%,28% 76%,0 90%);
}
#zineEstafetteApp .fs-player::before {
  /* Accented names print above the capital line. Expand only their blue
     substrate, not the stable name track or the word area beneath it. */
  top: -.12em;
  bottom: -.03em;
}

/* Tickets have real fibre contours, not ruler-straight polygon wedges.
   Keep native focus/hit areas outside the material. Their existing small
   rotation/selection slide moves ink, number and stock as one paper ticket. */
#zineGameMenu .game-poster::before {
  clip-path: none;
  mask: var(--material-fibre) center / 100% 100% no-repeat;
}
#zineGameMenu .game-poster { filter: var(--material-slip); }
#zineGameMenu .gallery-feature { filter: var(--material-object); }

@media (min-width: 1000px) and (min-height: 561px) {
  /* Ragged stock needs a small trim allowance around the printed ticket
     number; the click target, grid and text positions are unchanged. */
  #zineGameMenu .game-poster::before { inset-inline: -12px -5px; }
}

@media (min-width: 901px) and (min-height: 561px) {
  /* Flat identification slips, lifted actions and supporting boards have
     different heights. No secondary global shadow on existing baked folds. */
  #zineStoryApp .story-desk::before { filter: var(--material-object); }
  #zineStoryApp .story-paper-lift { filter: var(--material-rest); }
  #zineCaseApp .case-folder-base {
    filter: drop-shadow(1px var(--case-contact-y, 2.2px) .8px rgb(35 27 37 / var(--case-contact-alpha, .4))) drop-shadow(3px 7px 4px #231b2533);
  }
  #zineCaseApp .case-levels button { filter: var(--material-slip); }
  #zineCaseApp .case-levels button[aria-pressed="true"] { filter: var(--material-rest); }
  #zineCaseApp .case-levels button[aria-pressed="true"] .case-choice-paper {
    /* Dyed stock, not an opaque ink slab. A single photographic layer in
       soft-light retains fibre relief instead of double-multiplying it away. */
    background-color: #2c2924;
    background-image: var(--stock);
    background-size: 520px;
    background-blend-mode: soft-light;
  }
  #zineCaseApp .case-note:nth-child(n) { filter: var(--material-slip); }
  #zineApp .zine-controls :is(.main-action,.pause-action,.stop-action),
  #zineStoryApp :is(.main-action,.story-back-action),
  #zineCaseApp .main-action { filter: var(--material-slip); }
  #zineApp .zine-controls :is(.main-action,.pause-action,.stop-action):active,
  #zineStoryApp :is(.main-action,.story-back-action):active,
  #zineCaseApp .main-action:active { filter: var(--material-rest); }
}

/* Asset-first direction, 13 September: the approved matte board photograph
   is the production object, not just an unused mood reference. New sources
   have real alpha and share the old spindle/canvas contract. Native carriers,
   timers and motion poses are deliberately unchanged. */
#zineSandboxApp:not([data-material-state="fallback"]) {
  --fs-object: url("assets/nachtzine/asset-direction-2026-09-13/sandbox-notebook-v2.webp");
}
#zineCaseApp:not([data-material-state="fallback"]) .case-folder-stock {
  background-image: url("assets/nachtzine/asset-direction-2026-09-13/folder-cover-v2.webp");
}
#zineCaseApp:not([data-material-state="fallback"]) .case-cover-back .case-folder-stock {
  background-image: linear-gradient(105deg, #79602a24, transparent 24%, #fff1c01c 62%, #75552714), url("assets/nachtzine/asset-direction-2026-09-13/folder-cover-v2.webp");
  mask-image: url("assets/nachtzine/asset-direction-2026-09-13/folder-cover-v2.webp");
}

@media (min-width: 901px) and (min-height: 561px) {
  #zineSandboxApp:not([data-material-state="fallback"]) .fs-sandbox-words::before {
    /* The native carrier is inset 9/7/8/13% in the book: register its material
       back to the full 1536x1024 canvas (80% wide, 83% high), without moving
       text or duplicating the binding. This is the actual top page extracted
       from the same photograph, not a smaller rectangle laid on the book.
       The departure clone inherits this exact material and registration. */
    inset: -10.843373494% -8.75% -9.638554217% -16.25%;
    background: url("assets/nachtzine/asset-direction-2026-09-13/sandbox-page-v2.webp") center / 100% 100% no-repeat;
    mask: none;
    filter: none;
  }
  html #zineApp[data-word-press]:not([data-material-state="fallback"]) .press-roller-top span {
    background-image: url("assets/nachtzine/asset-direction-2026-09-13/platen-v2.webp");
  }
  html #zineApp[data-word-press]:not([data-material-state="fallback"]) .press-roller-top span:nth-child(2),
  html #zineApp[data-word-press]:not([data-material-state="fallback"]) .press-roller-top::before {
    background-image: url("assets/nachtzine/asset-direction-2026-09-13/platen-middle-v2.webp");
  }
  html #zineApp[data-word-press]:not([data-material-state="fallback"]) :is(.zine-poster,.press-assembly)::before {
    background-image: url("assets/nachtzine/asset-direction-2026-09-13/upright-middle-v2.webp");
  }
  #zineApp[data-word-press]:not([data-material-state="fallback"]) .press-housing {
    /* Preserve the chosen image's pigment. The earlier .78 brightness was
       compensation for the rejected coarse surface, not a brand colour. */
    filter: drop-shadow(1px 2px 1px #1c142b75) drop-shadow(3px 6px 4px #1c142b36);
  }
}

/* Offline recovery uses embedded matte paper silhouettes, not rejected old
   photos. These occupy the same native IMG and axle; the wheel still turns.
   Never use a failed external photo as its own recovery dependency. */
#zineApp[data-material-state="fallback"] .press-housing {
  content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221250%22%20height%3D%221069%22%20viewBox%3D%220%200%201250%201069%22%3E%3Cpath%20fill%3D%22%23a17d48%22%20d%3D%22M12%201050%2016%20907%20125%20857%20282%20333Q338%20166%20496%20168L919%20168%20921%2016%201139%2018%201186%20872%201237%20935%201238%201051Z%22%2F%3E%3Cpath%20fill%3D%22%2324221e%22%20d%3D%22M20%201044%2024%20912%20133%20862%20290%20335Q344%20174%20497%20176L927%20176%20929%2024%201131%2026%201178%20875%201230%20938%201230%201044Z%22%2F%3E%3Cpath%20fill%3D%22%23332c23%22%20d%3D%22m21%20913%201210%2025v14L22%20927Z%22%2F%3E%3Cg%20fill%3D%22%23bd9961%22%3E%3Cpath%20d%3D%22m49%20937%2041-13%2033%2026-6%2037-37%2019-35-22Z%22%2F%3E%3Cpath%20d%3D%22m1101%20948%2040-13%2032%2028-9%2034-35%2017-33-22Z%22%2F%3E%3Ccircle%20cx%3D%22649.925625%22%20cy%3D%22502.553%22%20r%3D%2228%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
#zineApp[data-material-state="fallback"] #pressWheel {
  content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22688%22%20height%3D%22688%22%20viewBox%3D%220%200%20688%20688%22%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22344%22%20r%3D%22324%22%20fill%3D%22none%22%20stroke%3D%22%239c7c4c%22%20stroke-width%3D%2242%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22344%22%20r%3D%22324%22%20fill%3D%22none%22%20stroke%3D%22%2325231f%22%20stroke-width%3D%2234%22%2F%3E%3Cg%20stroke%3D%22%2325231f%22%20stroke-width%3D%2248%22%3E%3Cpath%20d%3D%22M344%20344%20344%2039M344%20344%20634%20250M344%20344%20523%20591M344%20344%20165%20591M344%20344%2054%20250%22%2F%3E%3C%2Fg%3E%3Cpath%20fill%3D%22%23ab874e%22%20d%3D%22m312%20302%2044-6%2036%2039-13%2042-45%2014-37-30Z%22%2F%3E%3Ccircle%20cx%3D%22344%22%20cy%3D%22344%22%20r%3D%2214%22%20fill%3D%22%2325231f%22%2F%3E%3C%2Fsvg%3E");
}

/* Material gates retain an opaque readable page when optional photo files
   fail. Never allow a failed photo/mask to be the only substrate. */
.fs-stage[data-material-state="fallback"] :is(.fs-sandbox-words,.fs-letter)::before {
  mask: none;
  background: var(--paper);
  filter: none;
}
.fs-stage[data-material-state="fallback"] :is(.fs-choice,.fs-action)::before { mask: none; }

@media (forced-colors: active) {
  #zineSandboxApp:not([data-material-state="fallback"]) .fs-sandbox-words::before {
    inset: 0;
    background: Canvas;
  }
  #zineCaseApp:not([data-material-state="fallback"]) .case-folder-stock,
  #zineCaseApp:not([data-material-state="fallback"]) .case-cover-back .case-folder-stock {
    background-image: none;
    mask-image: none;
  }
  #zineApp[data-word-press]:not([data-material-state="fallback"]) .press-housing { filter: none; }
  .fs-stage :is(.fs-sandbox-words,.fs-letter)::before {
    mask: none;
    background: Canvas;
    filter: none;
  }
  .fs-stage :is(.fs-choice,.fs-action)::before,
  #zineGameMenu .game-poster::before { mask: none; }
  .fs-stage :is(.fs-action,.fs-choice),
  #zineGameMenu :is(.game-poster,.gallery-feature),
  #zineStoryApp :is(.story-desk::before,.story-paper-lift,.main-action,.story-back-action),
  #zineCaseApp :is(.case-folder-base,.case-levels button,.case-note,.main-action),
  #zineApp .zine-controls :is(.main-action,.pause-action,.stop-action) { filter: none !important; }
  #zineCaseApp .case-levels button[aria-pressed="true"] .case-choice-paper { background: Highlight; }
}
