/* Generated by scripts/build-watermarks.mjs — edit the script, not this file.
   Contextual watermarks: two fixed, masked layers in the section's ink. js/watermarks.js puts
   the next section's motif on the hidden layer and crossfades (opacity only: composited, no
   repaint on scroll). A second mask keeps the imprint in the margins and fades it behind the
   reading column, so foreground content reads against it, never through it. */
html[data-lettering] {
  --wm-strength: var(--watermark-strength, .12);
}
html[data-theme="light"][data-lettering] {
  /* Light pages need more ink for the same presence: the imprint sits on near-white. */
  --wm-strength: var(--watermark-strength-light, .145);
}
html[data-lettering]::before,
html[data-lettering]::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: var(--letter-face);
  opacity: 0;
  transition: opacity .9s ease;
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
html[data-lettering]::before {
  -webkit-mask: var(--wm-a) repeat 0 0 / var(--wm-a-size, 180px), linear-gradient(90deg, #000 0 10%, rgb(0 0 0 / .38) 32% 68%, #000 90%);
  mask: var(--wm-a) repeat 0 0 / var(--wm-a-size, 180px), linear-gradient(90deg, #000 0 10%, rgb(0 0 0 / .38) 32% 68%, #000 90%);
  opacity: var(--wm-strength);
}
html[data-lettering]::after {
  -webkit-mask: var(--wm-b) repeat 0 0 / var(--wm-b-size, 180px), linear-gradient(90deg, #000 0 10%, rgb(0 0 0 / .38) 32% 68%, #000 90%);
  mask: var(--wm-b) repeat 0 0 / var(--wm-b-size, 180px), linear-gradient(90deg, #000 0 10%, rgb(0 0 0 / .38) 32% 68%, #000 90%);
}
html[data-lettering][data-wm-front="b"]::before { opacity: 0; }
html[data-lettering][data-wm-front="b"]::after { opacity: var(--wm-strength); }
@media (max-width: 700px) {
  /* Phones have no margins to hold the imprint; keep it faint and even. */
  html[data-lettering] { --wm-strength: .08; }
  html[data-theme="light"][data-lettering] { --wm-strength: .11; }
  html[data-lettering]::before { -webkit-mask: var(--wm-a) repeat 0 0 / var(--wm-a-size, 180px); mask: var(--wm-a) repeat 0 0 / var(--wm-a-size, 180px); }
  html[data-lettering]::after { -webkit-mask: var(--wm-b) repeat 0 0 / var(--wm-b-size, 180px); mask: var(--wm-b) repeat 0 0 / var(--wm-b-size, 180px); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-lettering]::before, html[data-lettering]::after { transition-duration: .2s; }
}
@media (forced-colors: active), print {
  html[data-lettering]::before, html[data-lettering]::after { display: none; }
}
/* Motif table: layer A starts on the page default; the runtime names the motif per layer. */
html:not([data-wm-a])[data-watermark="circuit"], html[data-wm-a="circuit"] { --wm-a: url('/img/watermarks/lab-circuit.svg?v=340353db1d'); --wm-a-size: 160px; }
html[data-wm-b="circuit"] { --wm-b: url('/img/watermarks/lab-circuit.svg?v=340353db1d'); --wm-b-size: 160px; }
html:not([data-wm-a])[data-watermark="molecule"], html[data-wm-a="molecule"] { --wm-a: url('/img/watermarks/lab-molecule.svg?v=804ecb9072'); --wm-a-size: 138.6px 160px; }
html[data-wm-b="molecule"] { --wm-b: url('/img/watermarks/lab-molecule.svg?v=804ecb9072'); --wm-b-size: 138.6px 160px; }
html:not([data-wm-a])[data-watermark="editorial"], html[data-wm-a="editorial"] { --wm-a: url('/img/watermarks/editorial-ruled.svg?v=c29424011c'); --wm-a-size: 200px 120px; }
html[data-wm-b="editorial"] { --wm-b: url('/img/watermarks/editorial-ruled.svg?v=c29424011c'); --wm-b-size: 200px 120px; }
html:not([data-wm-a])[data-watermark="curl"], html[data-wm-a="curl"] { --wm-a: url('/img/watermarks/enamel-curl.svg?v=cc35becd4e'); --wm-a-size: 160px; }
html[data-wm-b="curl"] { --wm-b: url('/img/watermarks/enamel-curl.svg?v=cc35becd4e'); --wm-b-size: 160px; }
html:not([data-wm-a])[data-watermark="qa"], html[data-wm-a="qa"] { --wm-a: url('/img/watermarks/motif-qa.svg?v=0861650905'); --wm-a-size: 180px; }
html[data-wm-b="qa"] { --wm-b: url('/img/watermarks/motif-qa.svg?v=0861650905'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="metrics"], html[data-wm-a="metrics"] { --wm-a: url('/img/watermarks/motif-metrics.svg?v=cee7ccb8a4'); --wm-a-size: 180px; }
html[data-wm-b="metrics"] { --wm-b: url('/img/watermarks/motif-metrics.svg?v=cee7ccb8a4'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="toolkit"], html[data-wm-a="toolkit"] { --wm-a: url('/img/watermarks/motif-toolkit.svg?v=546a2ba2fe'); --wm-a-size: 180px; }
html[data-wm-b="toolkit"] { --wm-b: url('/img/watermarks/motif-toolkit.svg?v=546a2ba2fe'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="connect"], html[data-wm-a="connect"] { --wm-a: url('/img/watermarks/motif-connect.svg?v=ebd9a12df2'); --wm-a-size: 180px; }
html[data-wm-b="connect"] { --wm-b: url('/img/watermarks/motif-connect.svg?v=ebd9a12df2'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="workbench"], html[data-wm-a="workbench"] { --wm-a: url('/img/watermarks/motif-workbench.svg?v=b9e8f3c0ef'); --wm-a-size: 180px; }
html[data-wm-b="workbench"] { --wm-b: url('/img/watermarks/motif-workbench.svg?v=b9e8f3c0ef'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="gallery"], html[data-wm-a="gallery"] { --wm-a: url('/img/watermarks/motif-gallery.svg?v=a8d7dfcd71'); --wm-a-size: 180px; }
html[data-wm-b="gallery"] { --wm-b: url('/img/watermarks/motif-gallery.svg?v=a8d7dfcd71'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="archive"], html[data-wm-a="archive"] { --wm-a: url('/img/watermarks/motif-archive.svg?v=7def5f8d9f'); --wm-a-size: 180px; }
html[data-wm-b="archive"] { --wm-b: url('/img/watermarks/motif-archive.svg?v=7def5f8d9f'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="neural"], html[data-wm-a="neural"] { --wm-a: url('/img/watermarks/motif-neural.svg?v=88fc7057ba'); --wm-a-size: 180px; }
html[data-wm-b="neural"] { --wm-b: url('/img/watermarks/motif-neural.svg?v=88fc7057ba'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="notes"], html[data-wm-a="notes"] { --wm-a: url('/img/watermarks/motif-notes.svg?v=dd6be5329a'); --wm-a-size: 180px; }
html[data-wm-b="notes"] { --wm-b: url('/img/watermarks/motif-notes.svg?v=dd6be5329a'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="playground"], html[data-wm-a="playground"] { --wm-a: url('/img/watermarks/motif-playground.svg?v=be92f32bef'); --wm-a-size: 180px; }
html[data-wm-b="playground"] { --wm-b: url('/img/watermarks/motif-playground.svg?v=be92f32bef'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="social"], html[data-wm-a="social"] { --wm-a: url('/img/watermarks/motif-social.svg?v=4d8a8818f3'); --wm-a-size: 180px; }
html[data-wm-b="social"] { --wm-b: url('/img/watermarks/motif-social.svg?v=4d8a8818f3'); --wm-b-size: 180px; }
html:not([data-wm-a])[data-watermark="cafe"], html[data-wm-a="cafe"] { --wm-a: url('/img/watermarks/motif-cafe.svg?v=152f286a35'); --wm-a-size: 180px; }
html[data-wm-b="cafe"] { --wm-b: url('/img/watermarks/motif-cafe.svg?v=152f286a35'); --wm-b-size: 180px; }
