/* ICS badge component (P56, owner 2026-11-05): ONE sticker badge for every card label.
   Look: torn-label sticker, top-left over the thumb, tilted (-2deg odd / +2deg even cards), black text on pink, 1px hard edge, 2px hard shadow, no radius.
   Tokens live only in :root below: change the design here, nowhere else.
   Applied by selector to the existing label classes inside torn cards (no Bricks markup change).
   Excluded on purpose: .ics-member cards (roles stay plain text), page-level filter pills, form labels, single-page labels outside cards.
   Card paper inset (--ics-badge-pad) = distance card edge to thumb, scales with --text-scale: 16px (news/events/jobs/bios/search), 24px (place rows), 12px (library), 0 (document grid).
   Flip cards: the front face only (back face chips are excluded). */
:root {
  --ics-badge-bg: var(--pink-500);
  --ics-badge-fg: var(--neutral-1000);
  --ics-badge-edge: var(--neutral-1000);
  --ics-badge-edge-w: 1px;
  --ics-badge-shadow: 2px;
  --ics-badge-tilt: -2deg;
  --ics-badge-tilt-alt: 2deg;
  --ics-badge-inset: 10px;
  --ics-badge-max-share: 70%;
  --ics-badge-font-size: var(--fs-xs);
  --ics-badge-pad-y: var(--sp-2xs);
  --ics-badge-pad-x: var(--sp-xs);
  --ics-badge-z: 2;
}
html body .ics-torn-card:not(.ics-member) {
  --ics-badge-pad: calc(16px * var(--text-scale, 1));
}
html body .ics-card--panel.ics-torn-card:not(.ics-member) {
  --ics-badge-pad: calc(12px * var(--text-scale, 1));
}
html body #brxe-dcgrid .ics-torn-card:not(.ics-member) {
  --ics-badge-pad: 0px;
}
/* place directory rows (/ho-tro/, /en/support/): horizontal card, thumb is the left column inset 24px */
html body .ics-torn-card.ics-pl-row:not(.ics-member) {
  --ics-badge-pad: calc(24px * var(--text-scale, 1));
}
html body .ics-torn-card:not(.ics-member) :is(.nw-chip, .ics-tag, .ev-badge, .ev-chip, .dc-chip, .tm-role, .jb-tag, .ics-pl-chip, .ics-badge):not(.ics-flip__nb *),
html body :is(.ics-tag, .ics-ev-chip):not(.ics-torn-card *):not(.ics-member *):not(header *):not(footer *):not(nav *):not([class*="filter"] *):not([class*="pill"] *):not(.ics-flip__nb *) {
  width: auto !important;
  margin: 0 !important;
  padding: var(--ics-badge-pad-y) var(--ics-badge-pad-x) !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  font-size: calc(var(--ics-badge-font-size) * var(--text-scale, 1)) !important;
  line-height: var(--lh-xs) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  font-weight: 500 !important;
  background: var(--ics-badge-bg) !important;
  color: var(--ics-badge-fg) !important;
  border: var(--ics-badge-edge-w) solid var(--ics-badge-edge) !important;
  border-radius: 0 !important;
  box-shadow: var(--ics-badge-shadow) var(--ics-badge-shadow) 0 var(--ics-badge-edge) !important;
  transform: rotate(var(--ics-badge-tilt)) !important;
}
html body .ics-torn-card:not(.ics-member) :is(.nw-chip, .ics-tag, .ev-badge, .ev-chip, .dc-chip, .tm-role, .jb-tag, .ics-pl-chip, .ics-badge):not(.ics-flip__nb *) {
  position: absolute !important;
  top: calc(var(--ics-badge-pad) + var(--ics-badge-inset)) !important;
  left: calc(var(--ics-badge-pad) + var(--ics-badge-inset)) !important;
  right: auto !important;
  bottom: auto !important;
  z-index: var(--ics-badge-z) !important;
  display: block !important;
  flex: none !important;
  align-self: flex-start !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  max-width: calc((100% - 2 * var(--ics-badge-pad)) * var(--ics-badge-max-share)) !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: normal !important;
}
html body :is(.ics-tag, .ics-ev-chip):not(.ics-torn-card *):not(.ics-member *):not(header *):not(footer *):not(nav *):not([class*="filter"] *):not([class*="pill"] *):not(.ics-flip__nb *) {
  position: static !important;
  display: inline-block !important;
  max-width: 100% !important;
}
html body .ics-torn-card:not(.ics-member):nth-child(even) :is(.ics-tag, .ev-badge, .ev-chip, .dc-chip, .tm-role, .jb-tag, .ics-pl-chip, .ics-badge, .nw-chip):not(.ics-flip__nb *) {
  transform: rotate(var(--ics-badge-tilt-alt)) !important;
}
html body .ics-torn-card:not(.ics-member) :is(.ics-tag, .ev-badge, .ev-chip, .dc-chip, .tm-role, .jb-tag, .ics-pl-chip, .ics-badge, .nw-chip):not(.ics-flip__nb *):empty {
  display: none !important;
}
/* events: the status chip sits in a .ev-top wrapper; the wrapper must not keep a row of its own */
html body .ics-torn-card:not(.ics-member) .ev-top:has(> .nw-chip, > .ev-chip, > .ev-badge) {
  display: contents;
}
@media (prefers-reduced-motion: reduce) {
  html body .ics-torn-card:not(.ics-member) :is(.ics-tag, .ev-badge, .ev-chip, .dc-chip, .tm-role, .jb-tag, .ics-pl-chip, .ics-badge, .nw-chip):not(.ics-flip__nb *) {
    transition: none !important;
    animation: none !important;
  }
}
/* H97: ONE shared declaration block above serves card stickers and the in-flow variant (single-page labels outside cards: article/event/job/document heads, event status chip; excluded: filter pills, nav, header/footer, member cards, form labels). Only position/display/max-width differ per variant. */
