/* One optical grid for every interface icon. Artwork and brand marks keep their
   own dimensions; UI glyphs inherit the control's color and disabled state. */
.ui-icon {
  display: inline-block;
  width: 1.125em;
  height: 1.125em;
  flex: 0 0 auto;
  vertical-align: -.18em;
  overflow: visible;
  pointer-events: none;
}
.sk-icon .ui-icon { width: 22px; height: 22px; }
.sk-icon.big .ui-icon { width: 30px; height: 30px; }
.cv-card-icon .ui-icon { width: 28px; height: 28px; }
.px-cp-ico .ui-icon { width: 19px; height: 19px; }
.plugin-point-icon .ui-icon { width: 21px; height: 21px; }
.px-btn-ico, .px-mention-kind { display: inline-flex; align-items: center; justify-content: center; }
.px-btn-ico .ui-icon { width: 16px; height: 16px; }
.icon-picker { display: flex; flex-wrap: wrap; gap: 8px; }
.icon-picker button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 8px;
  border: 1px solid var(--border, #343947);
  border-radius: 9px;
  background: var(--card, #171b24);
  color: var(--text-2, #b9bfcc);
  cursor: pointer;
}
.icon-picker button .ui-icon { width: 20px; height: 20px; }
.icon-picker button[aria-pressed="true"] {
  border-color: #a4b8df;
  background: #28354b;
  color: #f2f6ff;
}
.icon-picker button:focus-visible { outline: 2px solid #a4b8df; outline-offset: 3px; }
.icon-field { display: grid; gap: 8px; }
.ui-icon[data-icon="loader"] { animation: ui-icon-spin 1s linear infinite; }
@keyframes ui-icon-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .ui-icon[data-icon="loader"] { animation: none; }
}

/* Pseudo-element badges use the same local vectors. */
.work-card[data-duck] .media::before { content: ""; width: 28px; height: 26px; box-sizing: border-box; background-image: url("data:image/svg+xml,%3Csvg%20class%3D%22ui-icon%22%20data-icon%3D%22duck%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23dec7a6%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M4%2013h7V8a4%204%200%201%201%208%200l3%202-4%202c0%205-3%208-8%208-5%200-8-3-8-7l2%200Z%22%2F%3E%3Cpath%20d%3D%22M7%2015h5%22%2F%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%227%22%20r%3D%22.5%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: center; background-size: 17px 17px; }
.batch-cell.no-asset::after { content: ""; width: 12px; height: 12px; background: currentColor; mask: url("data:image/svg+xml,%3Csvg%20class%3D%22ui-icon%22%20data-icon%3D%22link%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23dec7a6%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22m10%2013%204-4M8%2016l-1%201a4%204%200%200%201-6-6l4-4a4%204%200%200%201%206%200M16%208l1-1a4%204%200%200%201%206%206l-4%204a4%204%200%200%201-6%200%22%20transform%3D%22translate(1%200)%20scale(.92%201)%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; }
.media-vc-remix ul.is-risk { list-style: none; }
.media-vc-remix ul.is-risk li::marker { content: ""; }
.media-vc-remix ul.is-risk li::before { content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 6px; vertical-align: -.15em; background: currentColor; mask: url("data:image/svg+xml,%3Csvg%20class%3D%22ui-icon%22%20data-icon%3D%22warning%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23dec7a6%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22m10.3%204-8%2014A2%202%200%200%200%204%2021h16a2%202%200%200%200%201.7-3l-8-14a2%202%200%200%200-3.4%200Z%22%2F%3E%3Cpath%20d%3D%22M12%209v4M12%2017h.01%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; }