/* Round 9: the brush. The page's brush was one downstroke of the wordmark's M, 140 pixels high, stretched over the
   buttons and across the footer ("way too pixelated"). Then strokes drawn by a script (brush_r9.mjs) were turned
   down ("less AI slop"). Now it is real ink: the character 一, "one", written by Zen calligraphers, lifted off museum
   scans in the public domain (CC0) and laid in the brand's red, its own edges, dry streaks and grain kept
   (samura-planning/v17/brush_scan_r9.mjs): Jiun Onkō's (late 18th century, The Met), the owner's choice over Yueshan
   Daozong's. ?brush=old shows the old one. One stroke for the buttons (-s, 900 pixels wide) and the footer (2400). */
#samura{--brush:url(./assets/v17/brush/jiun.webp);--brush-s:url(./assets/v17/brush/jiun-s.webp)}

/* The buttons: the stroke is the picture itself; the wet sweep on hover is masked by it, as before. */
#samura:not([data-brush=old]) .primary-cta::before,#samura:not([data-brush=old]) .nav-cta::before{background:var(--brush-s) center/100% 100% no-repeat;-webkit-mask:none;mask:none}
#samura:not([data-brush=old]) .primary-cta::after,#samura:not([data-brush=old]) .nav-cta::after{-webkit-mask-image:var(--brush-s);mask-image:var(--brush-s)}

/* The ink footer: the stroke at its own proportion behind the wordmark, painted in with a soft, wet front instead of
   a hard edge sweeping across. */
@property --paint{syntax:'<percentage>';inherits:false;initial-value:0%}
#samura:not([data-brush=old]) .ink-stroke{left:5%;right:5%;top:50%;height:auto;aspect-ratio:4/1;background:var(--brush) center/100% 100% no-repeat;transform:translateY(-58%) rotate(-3deg);clip-path:none;
  -webkit-mask:linear-gradient(90deg,#000 calc(var(--paint) - 22%),#0000 var(--paint)) 0 0/100% 100% no-repeat;mask:linear-gradient(90deg,#000 calc(var(--paint) - 22%),#0000 var(--paint)) 0 0/100% 100% no-repeat;
  --paint:0%;transition:--paint 1s cubic-bezier(.55,0,.2,1)}
#samura:not([data-brush=old]) .ink.is-painted .ink-stroke{--paint:122%}
@media(max-width:760px){#samura:not([data-brush=old]) .ink-stroke{left:-4%;right:-4%;top:50%;height:auto}}
@media(prefers-reduced-motion:reduce){#samura:not([data-brush=old]) .ink-stroke{transition:none}}
/* In the night ending the closing's button paints its stroke in as it comes into view (v17-ending.js, `is-inked`). */
#samura.is-night:not([data-brush=old]) .product-section .primary-cta::before{-webkit-mask:linear-gradient(90deg,#000 calc(var(--paint) - 22%),#0000 var(--paint)) 0 0/100% 100% no-repeat;mask:linear-gradient(90deg,#000 calc(var(--paint) - 22%),#0000 var(--paint)) 0 0/100% 100% no-repeat;--paint:0%;transition:--paint .75s cubic-bezier(.55,0,.2,1),filter .2s,transform .25s cubic-bezier(.2,.75,.3,1)}
#samura.is-night:not([data-brush=old]) .product-section .primary-cta.is-inked::before{--paint:122%}
@media(prefers-reduced-motion:reduce){#samura.is-night:not([data-brush=old]) .product-section .primary-cta::before{transition:none}}
