/* The "3D printed" look (Joseph Sr 2026-09-28: "would it be even cooler if everything has a 3D printed look / feel / texture?").
   On every Crew Country page since 2026-09-28: body.look-printed, switched on per area in tools/landctl.py (LOOKS).
   Layer lines on the chunky things, the layer-line headings (kit .h-printed), honeycomb infill, and pictures that print in layer by layer.
   Body text, prices and the toy pictures themselves stay plain: lines across text hurt reading, and the art already has print texture.
   The page background stays plain for now (audit T58): the dot paper comes back once the toys are alpha cut-outs. */
.look-printed{
  --lp-lines:repeating-linear-gradient(180deg,rgba(43,35,68,.10) 0 1px,rgba(255,255,255,.16) 1px 2px,transparent 2px 3.4px);
  --lp-lines-soft:repeating-linear-gradient(180deg,rgba(43,35,68,.06) 0 1px,rgba(255,255,255,.12) 1px 2px,transparent 2px 3.4px);
  --lp-wall:inset 0 0 0 2px rgba(255,255,255,.3);
  --lp-hot:#ffb347;
}
body.look-printed{background-image:none}

/* layer lines: every chunky printed-looking button (the kit's shadows and press stay as they are) */
.look-printed .btn,.look-printed .cc-btn,.look-printed .ts-btn,.look-printed .cc-chip,.look-printed .cc-tape,.look-printed .cc-code{background-image:var(--lp-lines)}
.look-printed .btn:not(:hover):not(:active),.look-printed .cc-btn{box-shadow:var(--lp-wall),var(--sh-2)}

/* honeycomb infill inside the passport, like a print cut open */
.look-printed .cc-passport{
  background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='48.5' viewBox='0 0 28 48.5'%3E%3Cpath d='M14 0l14 8.08v16.17L14 32.33 0 24.25V8.08zM14 32.33v16.17M0 48.5' fill='none' stroke='%232b2344' stroke-opacity='.07' stroke-width='1.5'/%3E%3C/svg%3E")}

/* print-in: a picture grows from the bed up, one layer at a time, under a hot nozzle line. Once per tab session (printed.js
   remembers it); armed by the head script, so without JS, with reduced motion or with Calm every picture is simply there. */
.look-printed .cc-banner.is-free,.look-printed .cc-face{position:relative}
.lp-armed .look-printed .cc-banner.is-free .cc-scene > img:not(.lp-go),.lp-armed .look-printed img.cc-toy:not(.lp-go){clip-path:inset(100% 0 0 0)}
.look-printed .lp-go{animation:lp-grow var(--lp-t,1.8s) steps(var(--lp-layers,36),end) both}
@keyframes lp-grow{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
.look-printed .lp-nozzle{position:absolute;left:4%;right:4%;height:3px;border-radius:2px;pointer-events:none;z-index:3;
  background:linear-gradient(90deg,transparent,var(--lp-hot) 12%,var(--coral) 50%,var(--lp-hot) 88%,transparent);
  box-shadow:0 0 10px 2px rgba(255,179,71,.75);animation:lp-sweep var(--lp-t,1.8s) steps(var(--lp-layers,36),end) both}
@keyframes lp-sweep{from{bottom:0;opacity:1}96%{opacity:1}to{bottom:100%;opacity:0}}
.look-printed .lp-status{position:absolute;left:2%;bottom:6%;z-index:3;background:var(--ink);color:#fff;font:800 var(--fs-label)/1 var(--f-body);
  letter-spacing:.04em;border-radius:999px;padding:7px 12px;background-image:var(--lp-lines-soft);transition:opacity .6s}
.look-printed .lp-status.is-done{opacity:0}
@media (prefers-reduced-motion:reduce){.lp-armed .look-printed img{clip-path:none!important}.look-printed .lp-go,.look-printed .lp-nozzle{animation:none}.look-printed .lp-nozzle,.look-printed .lp-status{display:none}}
html.calm .lp-nozzle,html.calm .lp-status{display:none}