/* The banlist icons (components/isback-banlist.js): a card element with data-ban="banned |
   limited1 | limited2 | limited3" gets a round red icon in its top-right corner, a little over
   the card's edge (like a printed list). The element has to be positioned (relative/absolute)
   and must not clip its overflow; --rk-ban-size overrides the size (default 22% of its width). */
[data-ban]::after {
  content: '';
  position: absolute;
  top: calc(var(--rk-ban-size, 22%) * -0.12);
  right: calc(var(--rk-ban-size, 22%) * -0.16);
  width: var(--rk-ban-size, 22%);
  aspect-ratio: 1;
  background: center / contain no-repeat;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.65));
  pointer-events: none;
  z-index: 3;
}
[data-ban="banned"]::after, .rk-ban-ico[data-cat="banned"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='47' fill='%23000'/%3E%3Ccircle cx='50' cy='50' r='38' fill='%23121212' stroke='%23e8141c' stroke-width='12'/%3E%3Cline x1='24' y1='24' x2='76' y2='76' stroke='%23e8141c' stroke-width='12'/%3E%3C/svg%3E"); }
[data-ban="limited1"]::after, .rk-ban-ico[data-cat="limited1"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='47' fill='%23000'/%3E%3Ccircle cx='50' cy='50' r='38' fill='%23121212' stroke='%23e8141c' stroke-width='12'/%3E%3Ctext x='50' y='69' text-anchor='middle' font-family='Arial Black,Arial,Helvetica,sans-serif' font-weight='900' font-size='54' fill='%23ffd21a' stroke='%23000' stroke-width='4' paint-order='stroke'%3E1%3C/text%3E%3C/svg%3E"); }
[data-ban="limited2"]::after, .rk-ban-ico[data-cat="limited2"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='47' fill='%23000'/%3E%3Ccircle cx='50' cy='50' r='38' fill='%23121212' stroke='%23e8141c' stroke-width='12'/%3E%3Ctext x='50' y='69' text-anchor='middle' font-family='Arial Black,Arial,Helvetica,sans-serif' font-weight='900' font-size='54' fill='%23ffd21a' stroke='%23000' stroke-width='4' paint-order='stroke'%3E2%3C/text%3E%3C/svg%3E"); }
[data-ban="limited3"]::after, .rk-ban-ico[data-cat="limited3"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='47' fill='%23000'/%3E%3Ccircle cx='50' cy='50' r='38' fill='%23121212' stroke='%23e8141c' stroke-width='12'/%3E%3Ctext x='50' y='69' text-anchor='middle' font-family='Arial Black,Arial,Helvetica,sans-serif' font-weight='900' font-size='54' fill='%23ffd21a' stroke='%23000' stroke-width='4' paint-order='stroke'%3E3%3C/text%3E%3C/svg%3E"); }

/* A small icon inline in text (badges, deck errors, the Banlist tab). */
.rk-ban-ico {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  vertical-align: -0.2em;
  background: center / contain no-repeat;
  flex: none;
}

/* .rk-ban-in: inside the card's corner instead, for a host that clips its overflow (a rounded
   card face): clear of a ~12% / 8.6% corner rounding. */
.rk-ban-in[data-ban]::after { top: 2.2%; right: 2.8%; width: var(--rk-ban-size, 20%); }

/* "Unlisted" (back to normal) in the Banlist view: a green check in the same ring. */
.rk-ban-ico[data-cat="unlisted"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='47' fill='%23000'/%3E%3Ccircle cx='50' cy='50' r='38' fill='%231f8f3a' stroke='%232ea043' stroke-width='12'/%3E%3Cpath d='M31 51 L44 64 L70 37' fill='none' stroke='%23fff' stroke-width='11' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }