/* =====================================================================
   swpcview — icon system (single source of truth for every page)

   Why CSS masks and not <svg> markup or an icon font:
   this app has no build step and no npm (CLAUDE.md), and its markup is built
   three different ways — static HTML, a cloned <template> (#card-tpl), and
   innerHTML string rebuilds inside app.js/console.js. A JS hydration pass
   would have to re-run after every one of those rebuilds and would silently
   miss any it wasn't wired into. A mask is inert CSS: it paints wherever the
   class lands, including inside a clone that was never in the document when
   the page loaded, and including markup built by a function nobody remembered
   to call back into.

   The glyph is painted with background-color, so it inherits currentColor —
   one .ic rule covers enabled/hover/disabled/danger without a second copy of
   the artwork per state, which is exactly what the emoji it replaces could
   never do (an emoji is full-colour and ignores the button's text colour).

   Geometry: every icon is drawn on the same 24x24 grid with a 2px round
   stroke and ~2px of optical margin, so mixed icons share a weight. Size
   comes from font-size (width/height are 1em), so an icon beside text tracks
   that text instead of needing a size class per context.

   These are our own drawings in the common stroke-icon idiom. No icon library
   is vendored, downloaded or depended on (see vendor/VENDOR.md for what this
   project does vendor, and why).

   CSP: img-src allows data: (server/main.py:635), so the inline data URIs
   here are policy-clean. Keep them single-quoted and '#'-free — a literal #
   ends a data URI, so use colour keywords ('black'), never hex.
   ===================================================================== */

.ic{
  display:inline-block; width:1em; height:1em; flex:none;
  background-color:currentColor;
  -webkit-mask:var(--ic) center/contain no-repeat;
          mask:var(--ic) center/contain no-repeat;
  vertical-align:-.135em;      /* optical baseline next to 13-15px UI text */
}
.ic-lg{ font-size:18px }
.ic-xl{ font-size:22px }
.ic-empty{ font-size:34px; opacity:.45 }   /* empty-state illustration size */

/* ---------- navigation / chrome ---------- */
.ic-search{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><path d='m20.5 20.5-4-4'/></svg>")}
.ic-more{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'><circle cx='12' cy='5' r='1.7'/><circle cx='12' cy='12' r='1.7'/><circle cx='12' cy='19' r='1.7'/></svg>")}
.ic-menu{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><path d='M3 6h18M3 12h18M3 18h18'/></svg>")}
.ic-x{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><path d='M18 6 6 18M6 6l12 12'/></svg>")}
.ic-chev-down{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>")}
.ic-chev-right{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m9 6 6 6-6 6'/></svg>")}
.ic-chev-left{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m15 6-6 6 6 6'/></svg>")}
.ic-arrow-left{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M19 12H5m6-7-7 7 7 7'/></svg>")}
.ic-arrow-up{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 19V5m-7 7 7-7 7 7'/></svg>")}
.ic-sun{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='4'/><path d='M12 2v2M12 20v2M4.9 4.9l1.5 1.5M17.6 17.6l1.5 1.5M2 12h2M20 12h2M4.9 19.1l1.5-1.5M17.6 6.4l1.5-1.5'/></svg>")}
.ic-moon{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20.5 14.3A8.5 8.5 0 0 1 9.7 3.5a8.5 8.5 0 1 0 10.8 10.8Z'/></svg>")}
.ic-logout{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><path d='m16 17 5-5-5-5M21 12H9'/></svg>")}
.ic-mail{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2.5' y='5' width='19' height='14' rx='2'/><path d='m3 7 9 6 9-6'/></svg>")}
.ic-settings{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 4h-7M10 4H3M21 12h-9M8 12H3M21 20h-5M12 20H3'/><path d='M14 2v4M8 10v4M16 18v4'/></svg>")}

/* ---------- monitoring actions ---------- */
.ic-camera{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9.4 4h5.2l1.4 2.4H20a2 2 0 0 1 2 2V18a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8.4a2 2 0 0 1 2-2h4z'/><circle cx='12' cy='13' r='3.4'/></svg>")}
.ic-record{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><circle cx='12' cy='12' r='8.6'/><circle cx='12' cy='12' r='4' fill='black' stroke='none'/></svg>")}
.ic-stop{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'><circle cx='12' cy='12' r='8.6'/><rect x='9' y='9' width='6' height='6' rx='1.2' fill='black' stroke='none'/></svg>")}
.ic-bell{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M18 8.5a6 6 0 1 0-12 0c0 5.2-2 6.5-2 6.5h16s-2-1.3-2-6.5'/><path d='M13.7 19a2 2 0 0 1-3.4 0'/></svg>")}
.ic-megaphone{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m3 11 18-6v14L3 14z'/><path d='M3 11H2.4a1.4 1.4 0 0 0 0 3H3z'/><path d='M11.5 16.6a2.8 2.8 0 0 1-5.4-1.2'/></svg>")}
.ic-siren{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 18v-5a5 5 0 0 1 10 0v5'/><rect x='4' y='18' width='16' height='3.5' rx='1.2'/><path d='M12 3v1.8M4.6 6.2l1.3 1.3M19.4 6.2l-1.3 1.3'/></svg>")}
.ic-control{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4.2 8.5h15.6a2 2 0 0 1 2 2.3l-.9 5.4a2.4 2.4 0 0 1-4.2 1.2L14.4 15H9.6l-2.3 2.4a2.4 2.4 0 0 1-4.2-1.2l-.9-5.4a2 2 0 0 1 2-2.3Z'/><path d='M6.2 11.8h2.4M7.4 10.6v2.4'/><circle cx='16' cy='11.4' r='1'/><circle cx='18' cy='13.4' r='1'/></svg>")}
.ic-timer{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='13.5' r='7.5'/><path d='M12 10v3.5l2.2 1.6M9.5 2.5h5'/></svg>")}
.ic-chart{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 21h18'/><path d='M6.5 21v-7M12 21V5.5M17.5 21v-10'/></svg>")}
.ic-activity{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2.5 12h4l3-8 5 16 3-8h4'/></svg>")}
.ic-pin{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 16.5V22'/><path d='M8.2 3h7.6l-.9 6.2 3.1 3.1v1.7H6V12.3l3.1-3.1z'/></svg>")}
.ic-trash{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3.5 6h17M9 6V4.2A1.2 1.2 0 0 1 10.2 3h3.6A1.2 1.2 0 0 1 15 4.2V6'/><path d='M5.8 6.3 6.7 19a2 2 0 0 0 2 1.9h6.6a2 2 0 0 0 2-1.9l.9-12.7'/><path d='M10.2 10.5v6M13.8 10.5v6'/></svg>")}
.ic-archive{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2.5' y='3.5' width='19' height='4.5' rx='1.4'/><path d='M4.5 8v11a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V8'/><path d='M10 12.2h4'/></svg>")}
.ic-expand{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M14.5 3H21v6.5M21 3l-7.5 7.5'/><path d='M9.5 21H3v-6.5M3 21l7.5-7.5'/></svg>")}
.ic-monitor{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2.5' y='3.5' width='19' height='13' rx='2'/><path d='M8.5 21h7M12 16.5V21'/></svg>")}
.ic-refresh{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20.5 11.5a8.5 8.5 0 1 0-.9 5'/><path d='M21 4.5V11h-6.5'/></svg>")}
.ic-power{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v9'/><path d='M6.8 6.8a8 8 0 1 0 10.4 0'/></svg>")}
.ic-rotate-device{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><rect x='2.5' y='10' width='19' height='11.5' rx='2.2'/><path d='M6.5 15.8h11'/><path d='M6.6 7.4A8.2 8.2 0 0 1 17.4 5.2'/><path d='m15.2 3.1 2.9 2.2-2.2 2.6'/></svg>")}

/* ---------- files / transfer ---------- */
.ic-folder{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 19.5a1.5 1.5 0 0 1-1.5-1.5V6a1.5 1.5 0 0 1 1.5-1.5h5.2l2.1 3h10.7A1.5 1.5 0 0 1 22.5 9v9a1.5 1.5 0 0 1-1.5 1.5z'/></svg>")}
.ic-file{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/></svg>")}
.ic-file-image{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><circle cx='9.3' cy='12.2' r='1.2'/><path d='m6 19 3.4-3.4 2.6 2.6 1.8-1.8L17.6 19'/></svg>")}
.ic-file-video{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><path d='m10 13 4 2.4-4 2.4z'/></svg>")}
.ic-file-audio{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><path d='M9 17.6v-4.3l5-1.1v4.3'/><circle cx='7.9' cy='17.7' r='1.3'/><circle cx='12.9' cy='16.5' r='1.3'/></svg>")}
.ic-file-zip{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><path d='M10.3 4.5h1.4M10.3 7h1.4M10.3 9.5h1.4M10.3 12h1.4'/><rect x='9.4' y='14.6' width='3.2' height='4' rx='1'/></svg>")}
.ic-file-text{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><path d='M8.5 13h7M8.5 16.5h7M8.5 9.5h2'/></svg>")}
.ic-file-exe{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M13.5 2.5H7A2 2 0 0 0 5 4.5v15a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/><path d='M13.5 2.5V8H19'/><path d='m12.4 11.5-3 3.3h3.2l-3 3.3'/></svg>")}
.ic-download{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v12'/><path d='m7.5 10.5 4.5 4.5 4.5-4.5'/><path d='M3.5 20.5h17'/></svg>")}
.ic-upload{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 15.5V3.5'/><path d='m7.5 8 4.5-4.5L16.5 8'/><path d='M3.5 20.5h17'/></svg>")}
.ic-save{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4.5 3.5h11l5 5v12a1 1 0 0 1-1 1h-15a1 1 0 0 1-1-1v-16a1 1 0 0 1 1-1Z'/><path d='M8 3.5v5h7v-5'/><path d='M7.5 21.5v-6h9v6'/></svg>")}
.ic-plus{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'><path d='M12 5v14M5 12h14'/></svg>")}
.ic-check{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m4.5 12.5 5 5 10-11'/></svg>")}
.ic-copy{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='8.5' y='8.5' width='12' height='12' rx='2'/><path d='M4.5 15.5A2 2 0 0 1 3.5 14V5.5a2 2 0 0 1 2-2H14a2 2 0 0 1 1.5 1'/></svg>")}
.ic-link{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M10 13.5a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7l-1.7 1.7'/><path d='M14 10.5a4 4 0 0 0-5.7 0l-3 3a4 4 0 0 0 5.7 5.7l1.7-1.7'/></svg>")}
.ic-play{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M7 4.8 19 12 7 19.2z'/></svg>")}
.ic-pause{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 4.5v15M15 4.5v15'/></svg>")}

/* ---------- status / feedback ---------- */
.ic-warn{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M10.3 3.8 1.9 18a2 2 0 0 0 1.7 3h16.8a2 2 0 0 0 1.7-3L13.7 3.8a2 2 0 0 0-3.4 0Z'/><path d='M12 9v4.5M12 17.2h.01'/></svg>")}
.ic-ban{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><path d='m5.6 5.6 12.8 12.8'/></svg>")}
.ic-info{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><path d='M12 11v5M12 7.8h.01'/></svg>")}
.ic-shield{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 2.5 4.5 5.6v6.1c0 4.6 3.2 8.9 7.5 10 4.3-1.1 7.5-5.4 7.5-10V5.6z'/></svg>")}
.ic-lock{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='10.5' width='16' height='10.5' rx='2'/><path d='M7.8 10.5V7.2a4.2 4.2 0 0 1 8.4 0v3.3'/></svg>")}
.ic-key{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7.5' cy='16.5' r='4'/><path d='m10.4 13.6 8.1-8.1M16 8l2.5 2.5M19 5l2 2'/></svg>")}
.ic-eye{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M1.8 12S5.5 5.5 12 5.5 22.2 12 22.2 12 18.5 18.5 12 18.5 1.8 12 1.8 12Z'/><circle cx='12' cy='12' r='3.2'/></svg>")}
.ic-eye-off{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9.6 5.9A9.6 9.6 0 0 1 12 5.5c6.5 0 10.2 6.5 10.2 6.5a18 18 0 0 1-3.3 4.2'/><path d='M6.3 7.8A17.6 17.6 0 0 0 1.8 12S5.5 18.5 12 18.5a9.7 9.7 0 0 0 4-.8'/><path d='M10 10.1a3.2 3.2 0 0 0 4.3 4.3'/><path d='M3 3l18 18'/></svg>")}
.ic-pencil{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M16.4 3.6a2.3 2.3 0 0 1 3.2 3.2L7.4 19H4v-3.4z'/><path d='m14.6 5.4 3.2 3.2'/></svg>")}
.ic-clock{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9'/><path d='M12 7v5.3l3.3 2'/></svg>")}
.ic-history{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3.5 12a8.5 8.5 0 1 0 2.3-5.8'/><path d='M3 4v4.5h4.5'/><path d='M12 7.5V12l3 1.8'/></svg>")}

/* ---------- console / admin ---------- */
.ic-grid{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7.5' height='7.5' rx='1.6'/><rect x='13.5' y='3' width='7.5' height='7.5' rx='1.6'/><rect x='3' y='13.5' width='7.5' height='7.5' rx='1.6'/><rect x='13.5' y='13.5' width='7.5' height='7.5' rx='1.6'/></svg>")}
.ic-users{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M15.5 20.5v-1.8a3.6 3.6 0 0 0-3.6-3.6H6.1a3.6 3.6 0 0 0-3.6 3.6v1.8'/><circle cx='9' cy='7.5' r='3.6'/><path d='M21.5 20.5v-1.8a3.6 3.6 0 0 0-2.7-3.5'/><path d='M16 4.1a3.6 3.6 0 0 1 0 6.9'/></svg>")}
.ic-user{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M19.5 20.5v-2a4 4 0 0 0-4-4h-7a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7.5' r='4'/></svg>")}
.ic-building{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 21V4.5a1.5 1.5 0 0 1 1.5-1.5h8a1.5 1.5 0 0 1 1.5 1.5V21'/><path d='M15 9.5h3.5A1.5 1.5 0 0 1 20 11v10'/><path d='M2.5 21h19'/><path d='M7.5 7h4M7.5 11h4M7.5 15h4'/></svg>")}
.ic-card{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2.5' y='5' width='19' height='14' rx='2'/><path d='M2.5 10h19'/><path d='M6.5 14.5h3'/></svg>")}
.ic-list{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M8.5 6h12M8.5 12h12M8.5 18h12'/><path d='M3.6 6h.01M3.6 12h.01M3.6 18h.01'/></svg>")}
.ic-cloud{--ic:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M17.5 19.5a4.5 4.5 0 0 0 .6-8.96 6.5 6.5 0 0 0-12.5 1.7A4 4 0 0 0 6.5 19.5Z'/></svg>")}
