/* ── KH Peel — corner-peel flap + Read tag for news cards ──
   Pairs with js/kh_peel.js (Task P3 engine). Sharp corners only, no
   border-radius anywhere. The legacy slide-up .news-under survives
   everywhere peel cannot run: it is hidden only on armed cards, so any
   failure (no WebGL2, reduced motion, context loss) falls back live.
   .news-card is already position: relative (css/kh_news.css), so the
   corner-anchored nodes need no new positioning. Both injected nodes
   are click-through (pointer-events: none): the whole-card link wins. */

.peel-canvas {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 208px;
  height: 168px;
  z-index: 2;
  pointer-events: none;
}

/* Read tag: dark text riding ON the gold flap (same 208x168 corner box
   as the canvas). clip-path wipes it in sync with the fold edge;
   z-index 3 above the canvas, pointer-events none so the card link
   wins clicks. */
.peel-read {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 208px;
  height: 168px;
  z-index: 3;
  pointer-events: none;
  color: #1a1024;
  font-family: Roboto, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 0 20px 18px 0;
  clip-path: polygon(0 0, 0 0, 0 0);
}

/* Armed cards show the flap's own Read tag instead of the slide-up. */
.news-card.has-peel .news-under {
  display: none;
}