/* -74, the striped word (P4, locked: Olya 26 Oct ~12:09Z on spec-type/_qa/home-p4/p4-home1440L.png, «да классная версия»;
   decision 13, L1 in the coordinator's LOCKED-BY-OLYA.md; her reference ORRYX OPS «the unseen», S28). Ported by the site
   lead from the typographer's comp (spec-type/css/type-comp.css: «The striped word», «The scan-in», «P4, locked», «P4c»,
   the footer block). One word per hero phrase rests in horizontal stripes in the headline's own ink in every state, reduced
   motion and stills included; it prints row by row once as its phrase lands. js/type-stripe-74.js wraps the words and sets
   the stripe rule per word (pitch and bar on whole device pixels). Off under ?type=73 (html.type73). */

/* fallbacks until the script measures the word: 7 px pitch from 640 up, 5 px below (the creative director, 26 Oct) */
html:not(.type73){--st-pitch:7px;--st-ink:5px}
@media (max-width:639px){html:not(.type73){--st-pitch:5px;--st-ink:3.4px}}

/* Real text: the glyphs keep their colour for selection, translation and forced colours; only the fill is the stripes */
html:not(.type73) .t-stripe{-webkit-text-fill-color:transparent;
  background-image:repeating-linear-gradient(180deg,currentColor 0 var(--st-ink),transparent var(--st-ink) var(--st-pitch));
  background-size:100% var(--st-pitch);background-position:0 var(--st-y,0px);-webkit-background-clip:text;background-clip:text;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
html:not(.type73) .t-stripe::selection{-webkit-text-fill-color:currentColor}
@media (forced-colors:active){html .t-stripe{-webkit-text-fill-color:currentColor;background:none}}

/* The print: the rows come in top first, each row left to right, over 280 ms on the site's clear curve; --scan runs over
   the rows that hold ink and the mask shows the rows printed and the part of the current row. The word waits hidden
   (.is-waiting) only while a print is due; it never rests flat */
@property --scan{syntax:'<number>';inherits:false;initial-value:0}
html.stripe-scan:not(.type73) .t-stripe.is-scanning{
  --row:round(down,var(--scan),1);--fr:mod(var(--scan),1);
  -webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(90deg,#000 calc(var(--fr)*100%),transparent 0);
  mask-image:linear-gradient(#000 0 0),linear-gradient(90deg,#000 calc(var(--fr)*100%),transparent 0);
  -webkit-mask-size:100% calc(var(--row)*var(--st-pitch) + var(--st-y,0px)),100% var(--st-pitch);mask-size:100% calc(var(--row)*var(--st-pitch) + var(--st-y,0px)),100% var(--st-pitch);
  -webkit-mask-position:0 0,0 calc(var(--row)*var(--st-pitch) + var(--st-y,0px));mask-position:0 0,0 calc(var(--row)*var(--st-pitch) + var(--st-y,0px));
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  animation:t-scan var(--scan-dur,280ms) cubic-bezier(.16,1,.3,1) var(--scan-delay,0ms) both}
@keyframes t-scan{from{--scan:var(--scan-from,0)}to{--scan:var(--scan-to,12)}}
html.stripe-scan:not(.type73) .t-stripe.is-waiting{-webkit-text-fill-color:transparent;background:none}
/* (ou2, 2 Nov) the stop after the word (.t-stop, js/type-stripe-74.js) waits with it and lands as the print starts the
   word's last row, 38 % into the scan (the curve has printed ~94 % of the rows by then; at the scan's end it came ~170 ms
   after the word read whole, a beat of its own); a stop in the word's own letter box (.t-solid) waits with it and prints in
   its row. Its landing is a visibility step, which runs on the main thread with the print: an opacity step ran on the
   compositor and landed alone while a busy main thread held the word back */
html.stripe-scan:not(.type73) .t-stripe.is-waiting~.t-stop,html.stripe-scan:not(.type73) .t-stripe.is-waiting .t-solid{opacity:0}
html.stripe-scan:not(.type73) .t-stripe.is-scanning~.t-stop{animation:t-stop calc(var(--scan-dur,280ms)*.38) steps(1,end) var(--scan-delay,0ms) both}
@keyframes t-stop{from{visibility:hidden}to{visibility:visible}}
@media (prefers-reduced-motion:reduce){html .t-stripe.is-scanning{animation:none;-webkit-mask-image:none;mask-image:none}}

/* P4c, the signal word (the coordinator, 26 Oct ~11:20Z; S29): its rest stripe keeps the pitch at about 85 % fill
   (--st-rest), heavier than a headline's 60-66 %, so the lemon holds 5.9:1 on the olive */
html:not(.type73) .t-stripe.t-rest{
  background-image:repeating-linear-gradient(180deg,currentColor var(--st-y,0px) calc(var(--st-y,0px) + var(--st-rest)),transparent calc(var(--st-y,0px) + var(--st-rest)) calc(var(--st-y,0px) + var(--st-pitch)));
  background-size:auto;background-position:0 0}
@media (forced-colors:active){html .t-stripe.t-rest{-webkit-text-fill-color:currentColor;background:none}}

/* P4c in place (R-007), on the colour grounds only (js/chapter-ground.js puts html.ground): the footer headline's
   «complex» is the page's signal word, in the accent, alone on its line at every width. The footer's olive is the
   creative director's (css/palette-74.css) */
html.ground:not(.type73) #footer .footer-top h2 .t-signal:not(#_1):not(#_2){color:var(--cool-signal,var(--cool-ink,currentColor));display:block;width:fit-content}
/* opus-223D (the owner on /approach: the yellow «complex» was unrelated to the purple/pink family): the word prints in its
   family's print ink, --cool-signal (js/chapter-ground.js: palette v3 r3 stepped to 4.5:1), the headline's ink where none */
html.ground:not(.type73) #footer .footer-top h2 .t-signal+br{display:none}

/* -74 (S90, ONE-SYSTEM rule 2, L1 on every page): js/type-stripe-74.js stripes one word in every display heading. A heading
   another script has cut into boxes (SplitText words, the caustic titles' letters, the case title's letters) holds its
   glyphs in those boxes, so the boxes that hold the glyphs take the stripes and the word's own box paints none. The ids
   outweigh the caustic title's solid ink (css/home-2026.css) */
html:not(.type73) .t-stripe:has(.mt-word,.mt-char,.letter-mask){background:none!important}
html:not(.type73) .t-stripe .mt-word:not(:has(.mt-char)):not(#_s):not(#_t):not(#_v),html:not(.type73) .t-stripe .mt-char:not(#_s):not(#_t):not(#_v):not(._pz),html:not(.type73) .t-stripe :where(span):is(.mt-word:not(:has(.mt-char)),.mt-char,.letter-mask>span):not(#_s):not(#_t):not(#_v){
  -webkit-text-fill-color:transparent!important;
  background-image:repeating-linear-gradient(180deg,currentColor 0 var(--st-ink),transparent var(--st-ink) var(--st-pitch))!important;
  background-size:100% var(--st-pitch)!important;background-position:0 var(--st-y,0px)!important;
  -webkit-background-clip:text!important;background-clip:text!important}
html.stripe-scan:not(.type73) .t-stripe.is-waiting .mt-word:not(#_s):not(#_t):not(#_v):not(z-pz),html.stripe-scan:not(.type73) .t-stripe.is-waiting .mt-char:not(#_s):not(#_t):not(#_v):not(z-pz),html.stripe-scan:not(.type73) .t-stripe.is-waiting :where(span):is(.letter-mask>span):not(#_s):not(#_t):not(#_v){background:none!important}
/* the word only (the coordinator, 27 Oct ~12:15Z): a stop or comma in its own letter box stays solid ink */
html:not(.type73) .t-stripe .mt-char.t-solid:not(#_s):not(#_t):not(#_v):not(#_w){-webkit-text-fill-color:currentColor!important;background:none!important}
@media (forced-colors:active){html .t-stripe .mt-word:not(#_s):not(#_t):not(#_v):not(#_w):not(z-pz),html .t-stripe .mt-char:not(#_s):not(#_t):not(#_v):not(#_w):not(z-pz),html .t-stripe :where(span):is(.letter-mask>span):not(#_s):not(#_t):not(#_v):not(#_w){-webkit-text-fill-color:currentColor!important;background:none!important}}
/* the word's own box holds the glyphs (a SplitText word box, or a heading the print era inks with !important, #pass-title) */
html:not(.type73) .t-stripe:not(:has(.mt-word,.mt-char,.letter-mask)):not(#_s):not(#_t):not(#_v){-webkit-text-fill-color:transparent!important}
html.stripe-scan:not(.type73) .t-stripe.is-waiting:not(#_s):not(#_t):not(#_v){background:none!important}
@media (forced-colors:active){html .t-stripe:not(#_s):not(#_t):not(#_v):not(#_w){-webkit-text-fill-color:currentColor!important;background:none!important}}
/* the stripes are a background clipped to the text, so a glyph that overhangs its box (r's arm at a word's end under the
   tight display tracking) lost the overhang: «together» read «togethei». The painting boxes reach .1em past the word on
   each side with the same negative margin, so nothing moves (the coordinator, 27 Oct ~12:25Z). The case title's letter
   masks clip on their own and are left as they are */
html:not(.type73) .t-stripe:not(:has(.mt-word,.mt-char,.letter-mask)),
html:not(.type73) .t-stripe .mt-word:not(:has(.mt-char)),html:not(.type73) .t-stripe .mt-char:not(._pz){padding-inline:.1em;margin-inline:-.1em}
/* the stop keeps to its word (js/type-stripe-74.js wraps the striped word and its stop; the coordinator, 27 Oct ~12:32Z) */
html .t-nobr{white-space:nowrap}
/* (QA's 74c-A2, the coordinator, 28 Oct 2026) the stripes are a background, and browsers print without backgrounds by default:
   the striped words came out blank on the printed /cv («Core ▯.»). On paper they take their heading's solid ink */
@media print{html .t-stripe:not(#_s):not(#_t):not(#_v):not(#_w),html .t-stripe .mt-word:not(#_s):not(#_t):not(#_v):not(#_w):not(z-pz),html .t-stripe .mt-char:not(#_s):not(#_t):not(#_v):not(#_w):not(z-pz),html .t-stripe :where(span):is(.letter-mask>span):not(#_s):not(#_t):not(#_v):not(#_w){color:inherit!important;-webkit-text-fill-color:currentColor!important;background:none!important}}