/* ============================================================
   TG-26 — DEVICES / TEXTURE
   The decal kit as shippable CSS. Texture is material: grain,
   dither, halftone, registration crosses — never scanlines,
   never glow, never full-screen filters. Maximum two decal
   devices per zone. Each device re-inks per shader because it
   draws from --ink / --reg / --signal / --plate.
   ============================================================ */

:root{
  /* grain — SVG turbulence, used as a material at ~5%   @kind other */
  --tex-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");  /* @kind other */

  /* phosphor bloom multiplier — the world carries the correction, not the author */
  --tg-wmul:1; /* @kind other */

  /* scattered registration crosses — a mask tile so they re-ink per shader */
  --tex-crosses:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cg fill='none' stroke='%23000' stroke-width='1'%3E%3Cpath d='M30 42h10M35 37v10'/%3E%3Cpath d='M152 22h8M156 18v8'/%3E%3Cpath d='M82 152h10M87 147v10'/%3E%3Cpath d='M192 122h8M196 118v8'/%3E%3Cpath d='M122 202h8M126 198v8'/%3E%3C/g%3E%3C/svg%3E");  /* @kind other */
}

/* ---- grain layer — drop into any positioned container ---- */
.tg-grain{
  position:absolute; inset:0; pointer-events:none; z-index:1;
  mix-blend-mode:var(--grainblend); opacity:var(--grainop);
  background-image:var(--tex-grain);
}

/* ---- scattered crosses — felt before seen ---- */
.tg-marks{
  position:absolute; inset:0; pointer-events:none; z-index:1;
  background:var(--ink); opacity:.07;
  -webkit-mask-image:var(--tex-crosses); mask-image:var(--tex-crosses);
  -webkit-mask-size:var(--mark-tile) var(--mark-tile); mask-size:var(--mark-tile) var(--mark-tile);
}

/* ---- halftone-fade rule — a row of ink dots dissolving left→right ---- */
.tg-halftone{
  height:5px; opacity:.55;
  background:radial-gradient(circle, var(--ink) 1px, transparent 1.1px) 0 50%/5px 5px repeat-x;
  -webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.12));
  mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.12));
}

/* ---- barcode strip — irregular bars in --ink ---- */
.tg-barcode{
  height:13px;
  background:repeating-linear-gradient(90deg,
    var(--ink) 0 2px, transparent 2px 4px,
    var(--ink) 4px 5px, transparent 5px 9px,
    var(--ink) 9px 12px, transparent 12px 14px,
    var(--ink) 14px 15px, transparent 15px 18px);
}

/* ---- hazard hatching — diagonal line-fill (website latitude, sparingly) ---- */
.tg-hazard{
  background:repeating-linear-gradient(-45deg,
    var(--signal) 0 8px, transparent 8px 18px);
}

/* ---- posterized / banded dither — stepped transition between fields ---- */
.tg-poster{
  background:repeating-linear-gradient(180deg,
    var(--panel) 0 6px, var(--bg) 6px 12px);
}


/* ============================================================
   THE PHOSPHOR SHELL (ratified TG-26.3 · 02 AUG 2026)
   The Tier-1 display treatment. SCREEN REGISTER ONLY — this is
   light, and light does not print. The statement sits in the
   working accent, carries a persistence bloom, and ends in an
   underscore blinking on the system beat.
   AMENDS DEPRECATION 11 (no glow) at bloom > 0, argued as
   phosphor physics, not decoration. At bloom 0 it is fully legal
   under existing law and still correct — dry is a real state.
   Every value sizes in em so the shell holds at 34px and 132px
   alike. --tg-wmul carries the light-world correction, so the
   author never hand-tunes per world.
   ============================================================ */
.tg-phos{position:relative; display:block; color:var(--uv);
  /* clearance clamp — the shell can never touch a neighbour */
  padding-right:.14em; padding-bottom:.1em;}
.tg-phos-halo{position:absolute; inset:0; display:block; pointer-events:none; z-index:0;
  filter:blur(.5em); opacity:calc(var(--tg-bloom,.5) * .34 * var(--tg-wmul,1));}
.tg-phos-glow{position:absolute; inset:0; display:block; pointer-events:none; z-index:1;
  filter:blur(.17em); opacity:calc(var(--tg-bloom,.5) * .62 * var(--tg-wmul,1));}
.tg-phos-smear{position:absolute; inset:0; display:block; pointer-events:none; z-index:1;
  transform:translateX(2px); opacity:calc(var(--tg-bloom,.5) * .26);}
.tg-phos-ink{position:relative; z-index:2; display:block;}
/* volt glow on bone goes muddy — the light world attenuates the bloom */
[data-world="millennium"],
[data-world="ghost"]{--tg-wmul:.42; /* @kind other */}

/* the underscore — 0.5Hz system beat, steps(1), never a fade */
.tg-cur{display:inline-block; width:.46ch; background:var(--fill); margin-left:.14em; vertical-align:baseline;
  animation:tg-beat var(--amb-beat,2s) steps(1,end) infinite;}
.tg-cur-underscore{height:.085em;}
.tg-cur-block{height:.72em; transform:translateY(.06em);}
@keyframes tg-beat{0%,49%{opacity:1;} 50%,100%{opacity:0;}}
@media (prefers-reduced-motion: reduce){ .tg-cur{animation:none; opacity:1;} }


/* ============================================================
   THE PLATE SCREEN (TG-26.1 · RETIRED TG-26.3 — 02 AUG 2026)
   ARCHIVED, PARKED NOT DELETED. Superseded at Tier 1 by the
   phosphor shell: at display scale the dot screen read as polka,
   not process, and the plate escaped its line-box into
   neighbouring text. Still valid as PRINT-REGISTER material on
   figures and rules; never again the display-type default.
   The signature misregistration plate is VOLT + SCREEN: the
   --plate underprint softened through a RISO dot-screen mask so
   it sits with the ink instead of slamming. Apply the mask to
   the PLATE COPY ONLY (the offset duplicate), never the ink.
   Scale law (C2): the screen is the default at every scale;
   textured shells (punch / hatch) are HERO-SCALE ONLY, opted in
   per instance — never the global default.
   ============================================================ */
:root{
  --plate-screen-mask:radial-gradient(circle, #000 40%, rgba(0,0,0,.42) 48%); /* @kind other */
  --plate-screen-size:9px 9px; /* @kind other */
}
.tg-plate-screen{
  -webkit-mask-image:var(--plate-screen-mask); mask-image:var(--plate-screen-mask);
  -webkit-mask-size:var(--plate-screen-size); mask-size:var(--plate-screen-size);
}