/* ==========================================================================
   TDSH Giallo 1.1.0-dev10: moving "static" (old film / TV static), calm and placed
   A coarse noise tile (assets/img/static.png: specks, dust, a few scratch lines) in small hard-edged
   patches BEHIND the big display headings only:
     - the homepage masthead wordmark (THE DARK SIDE OF HUMANITY.)
     - title band headings: category, tag, author, date and 404 (FILE NOT FOUND); not search results,
       whose title already uses ::before for "Query:"
     - the page title (Docket and other pages)
     - the Crime Ledger archive hero title (THE CRIME LEDGER.)
     - THE DARK DISPATCH heading on the homepage
     - the footer wordmark
   Each patch is the heading's own box (the heading is shrunk to its text, so on one-line titles the
   patch ends where the words end; wrapped titles keep their column width), with two square notches
   cut out of opposite corners. It sits under the letters (z-index -1 inside the heading), so the type
   stays crisp; the headings' ink mask distresses it like the type.
   Not on body copy, cards, the inner masthead, the nav row or the Evidence Locker.
   14% on the yellow grounds, 12% on black and red, stepped through 13 positions in 2.2s (about
   6 fps). No flicker.
   background-position steps only: no gradients, soft masks, blur, filters, blend modes or script.
   One keyframes rule (tdsh-static), one declaration using it.
   Off under prefers-reduced-motion: reduce (no patch at all), and not printed.
   Off switch: add_filter( 'tdsh_giallo_static_grain', '__return_false' ) (inc/finish.php).
   ========================================================================== */

/* the headings shrink to their words (same line breaks and place: all are left aligned), so the patch
   behind a one-line title is no wider than the type. Outside the motion query so layout never depends on it. */
body.tdsh-front .main_header56 .text-logo,
body.tdsh-giallo:not(.search) .titlebar56 .titlebar56__title,
body.tdsh-giallo.page:not(.tdsh-front) .page56__header .page56__title,
body.tdsh-giallo .tg-ledger-archive__head .tg-ledger-archive__h,
body.tdsh-front .tg-sub h2.tg-display,
body.tdsh-giallo .tg-foot .tg-foot__brand{width:fit-content;max-width:100%;box-sizing:border-box}

@media screen and (prefers-reduced-motion:no-preference){
  body.tdsh-front .main_header56 .text-logo,
  body.tdsh-giallo:not(.search) .titlebar56 .titlebar56__title,
  body.tdsh-giallo.page:not(.tdsh-front) .page56__header .page56__title,
  body.tdsh-giallo .tg-ledger-archive__head .tg-ledger-archive__h,
  body.tdsh-front .tg-sub h2.tg-display,
  body.tdsh-giallo .tg-foot .tg-foot__brand{position:relative;isolation:isolate}

  body.tdsh-front .main_header56 .text-logo::before,
  body.tdsh-giallo:not(.search) .titlebar56 .titlebar56__title::before,
  body.tdsh-giallo.page:not(.tdsh-front) .page56__header .page56__title::before,
  body.tdsh-giallo .tg-ledger-archive__head .tg-ledger-archive__h::before,
  body.tdsh-front .tg-sub h2.tg-display::before,
  body.tdsh-giallo .tg-foot .tg-foot__brand::before{
    --tdsh-so:.14;
    content:"";display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:url(../img/static.png) repeat,url(../img/static.png) repeat;
    background-size:400px 400px,200px 200px;background-position:0 0,97px 53px;
    image-rendering:pixelated;
    clip-path:polygon(0 0,calc(100% - 28px) 0,calc(100% - 28px) 9px,100% 9px,100% 100%,28px 100%,28px calc(100% - 9px),0 calc(100% - 9px));
    opacity:var(--tdsh-so);
    animation:tdsh-static 2.2s steps(1,end) infinite;
  }
  /* light specks read stronger on the black and red grounds than on yellow */
  body.tdsh-giallo.page:not(.tdsh-front) .page56__header .page56__title::before,
  body.tdsh-giallo .tg-ledger-archive__head .tg-ledger-archive__h::before,
  body.tdsh-giallo .tg-foot .tg-foot__brand::before{--tdsh-so:.12}

  @keyframes tdsh-static{
    0%{background-position:0 0,97px 53px}
    7.69%{background-position:-151px 67px,31px -88px}
    15.38%{background-position:93px -183px,-127px 19px}
    23.08%{background-position:-237px -41px,163px 141px}
    30.77%{background-position:181px 129px,-59px -171px}
    38.46%{background-position:-73px 211px,113px -23px}
    46.15%{background-position:261px -117px,-191px 77px}
    53.85%{background-position:-199px 173px,47px 187px}
    61.54%{background-position:37px -253px,-83px -139px}
    69.23%{background-position:-283px 101px,179px -61px}
    76.92%{background-position:129px 239px,-149px 113px}
    84.62%{background-position:-19px -149px,71px -197px}
    92.31%{background-position:223px -7px,-37px 157px}
    100%{background-position:0 0,97px 53px}
  }
}