/*
 * Icons — Phosphor (https://phosphoricons.com, MIT), self-hosted in
 * app/assets/images/icons. The glyph is a CSS mask painted with currentColor, so
 * `icon_tag` emits a bare <span> and no SVG reaches the HTML (our lesson pages
 * render ~20 icons and are cached — inlining them would bloat every cache entry).
 *
 * Size comes from --icon-size, defaulting to 1em: an icon in a line of text
 * scales with the text and needs no rule of its own. Set --icon-size on the
 * CONTEXT, never on the icon.
 *
 * Weight is part of the name, and follows one rule: a filled glyph reads heavier
 * than our type, so anything ≥32px (profession/chapter emblems) uses `-light`,
 * everything smaller uses regular. `-fill` is reserved for STATE — done, active,
 * saved — never for decoration.
 */

.icon {
  background-color: currentColor;
  block-size: var(--icon-size, 1em);
  display: inline-block;
  flex-shrink: 0;
  inline-size: var(--icon-size, 1em);
  mask-image: var(--svg);
  /* content-box, not the default border-box: where padding is a hit area (the
     sheet's ✕), a border-box mask would blow the glyph up to fill it. Padding
     stays padding. */
  mask-origin: content-box;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  pointer-events: none;
  user-select: none;
  /* Sits an icon on the text baseline in plain inline context; flex rows ignore it. */
  vertical-align: -0.125em;
}

/* ── Service glyphs (regular) ──────────────────────────────────────────────── */
.icon--arrow-left { --svg: url("/assets/icons/arrow-left-ee149c3d.svg"); }
.icon--arrow-right { --svg: url("/assets/icons/arrow-right-c306f7c3.svg"); }
.icon--arrow-up-right { --svg: url("/assets/icons/arrow-up-right-948ec083.svg"); }
.icon--arrows-in { --svg: url("/assets/icons/arrows-in-0a645fd9.svg"); }
.icon--arrows-out { --svg: url("/assets/icons/arrows-out-006b7104.svg"); }
.icon--book-bookmark { --svg: url("/assets/icons/book-bookmark-0a6bf6b3.svg"); }
.icon--book-open { --svg: url("/assets/icons/book-open-58d520dc.svg"); }
.icon--bookmark-simple { --svg: url("/assets/icons/bookmark-simple-9d4aff36.svg"); }
.icon--calculator { --svg: url("/assets/icons/calculator-cb8ccd0a.svg"); }
.icon--caret-down { --svg: url("/assets/icons/caret-down-f054a768.svg"); }
.icon--caret-left { --svg: url("/assets/icons/caret-left-d8b7722f.svg"); }
.icon--caret-right { --svg: url("/assets/icons/caret-right-8261adee.svg"); }
.icon--chat-circle-dots { --svg: url("/assets/icons/chat-circle-dots-ddc8b4c9.svg"); }
.icon--check { --svg: url("/assets/icons/check-2860ca24.svg"); }
.icon--check-circle { --svg: url("/assets/icons/check-circle-41a7d219.svg"); }
.icon--clipboard { --svg: url("/assets/icons/clipboard-da204da7.svg"); }
.icon--clipboard-text { --svg: url("/assets/icons/clipboard-text-d8770da4.svg"); }
.icon--clock { --svg: url("/assets/icons/clock-4299d584.svg"); }
.icon--copy { --svg: url("/assets/icons/copy-6d5a05a5.svg"); }
.icon--cpu { --svg: url("/assets/icons/cpu-6750daeb.svg"); }
.icon--download-simple { --svg: url("/assets/icons/download-simple-41c9a833.svg"); }
.icon--file-text { --svg: url("/assets/icons/file-text-d31dd685.svg"); }
.icon--gear-six { --svg: url("/assets/icons/gear-six-83e753d7.svg"); }
.icon--graduation-cap { --svg: url("/assets/icons/graduation-cap-8c88f4d0.svg"); }
.icon--heart { --svg: url("/assets/icons/heart-45df7013.svg"); }
.icon--house { --svg: url("/assets/icons/house-f795e46a.svg"); }
.icon--info { --svg: url("/assets/icons/info-2214e1e6.svg"); }
.icon--lightbulb { --svg: url("/assets/icons/lightbulb-fdfe3981.svg"); }
.icon--link { --svg: url("/assets/icons/link-02f1fc26.svg"); }
.icon--list { --svg: url("/assets/icons/list-0780bee9.svg"); }
.icon--lock { --svg: url("/assets/icons/lock-ce9750d9.svg"); }
.icon--magnifying-glass { --svg: url("/assets/icons/magnifying-glass-91e57114.svg"); }
.icon--map-trifold { --svg: url("/assets/icons/map-trifold-4e5238ab.svg"); }
.icon--minus-circle { --svg: url("/assets/icons/minus-circle-4f1df6db.svg"); }
.icon--newspaper { --svg: url("/assets/icons/newspaper-5b9acc16.svg"); }
.icon--paper-plane-tilt { --svg: url("/assets/icons/paper-plane-tilt-523380bc.svg"); }
.icon--pencil-simple { --svg: url("/assets/icons/pencil-simple-93aa2dea.svg"); }
.icon--plus { --svg: url("/assets/icons/plus-16bc97ef.svg"); }
.icon--plus-circle { --svg: url("/assets/icons/plus-circle-3a156eea.svg"); }
.icon--question { --svg: url("/assets/icons/question-b16c265a.svg"); }
.icon--sign-in { --svg: url("/assets/icons/sign-in-af02abce.svg"); }
.icon--sign-out { --svg: url("/assets/icons/sign-out-bf7515d6.svg"); }
.icon--star { --svg: url("/assets/icons/star-bf1fbc57.svg"); }
.icon--trash { --svg: url("/assets/icons/trash-7bb9e444.svg"); }
.icon--user-circle { --svg: url("/assets/icons/user-circle-e7e2648d.svg"); }
.icon--user-plus { --svg: url("/assets/icons/user-plus-6e80eb85.svg"); }
.icon--users { --svg: url("/assets/icons/users-2180a0c6.svg"); }
.icon--video-camera { --svg: url("/assets/icons/video-camera-52ea7a87.svg"); }
.icon--warning { --svg: url("/assets/icons/warning-5d28462b.svg"); }
.icon--wrench { --svg: url("/assets/icons/wrench-b79fe2cb.svg"); }
.icon--x { --svg: url("/assets/icons/x-985b382b.svg"); }

/* ── State (fill) ──────────────────────────────────────────────────────────── */
.icon--bookmark-simple-fill { --svg: url("/assets/icons/bookmark-simple-fill-b30d0279.svg"); }
.icon--check-circle-fill { --svg: url("/assets/icons/check-circle-fill-f1da117b.svg"); }
.icon--heart-fill { --svg: url("/assets/icons/heart-fill-be6ca82b.svg"); }

/* ── Profession / chapter emblems (light, always ≥32px) ────────────────────── */
.icon--aperture-light { --svg: url("/assets/icons/aperture-light-1180e26c.svg"); }
.icon--atom-light { --svg: url("/assets/icons/atom-light-77779d3b.svg"); }
.icon--battery-charging-light { --svg: url("/assets/icons/battery-charging-light-f7c63511.svg"); }
.icon--book-bookmark-light { --svg: url("/assets/icons/book-bookmark-light-e02d814e.svg"); }
.icon--camera-light { --svg: url("/assets/icons/camera-light-0ec60d51.svg"); }
.icon--certificate-light { --svg: url("/assets/icons/certificate-light-474775e2.svg"); }
.icon--chart-line-up-light { --svg: url("/assets/icons/chart-line-up-light-35f76104.svg"); }
.icon--circuitry-light { --svg: url("/assets/icons/circuitry-light-a25c1003.svg"); }
.icon--code-light { --svg: url("/assets/icons/code-light-20a70dd3.svg"); }
.icon--cpu-light { --svg: url("/assets/icons/cpu-light-4ef3525b.svg"); }
.icon--cube-light { --svg: url("/assets/icons/cube-light-1e7cf229.svg"); }
.icon--drop-light { --svg: url("/assets/icons/drop-light-a58bfd94.svg"); }
.icon--engine-light { --svg: url("/assets/icons/engine-light-f38e4a4f.svg"); }
.icon--eye-light { --svg: url("/assets/icons/eye-light-0f0beba7.svg"); }
.icon--factory-light { --svg: url("/assets/icons/factory-light-7f7dfcf1.svg"); }
.icon--file-text-light { --svg: url("/assets/icons/file-text-light-1276affa.svg"); }
.icon--film-slate-light { --svg: url("/assets/icons/film-slate-light-0089d54a.svg"); }
.icon--frame-corners-light { --svg: url("/assets/icons/frame-corners-light-3f2b2233.svg"); }
.icon--gauge-light { --svg: url("/assets/icons/gauge-light-95801b87.svg"); }
.icon--gear-light { --svg: url("/assets/icons/gear-light-c9f626a6.svg"); }
.icon--grid-four-light { --svg: url("/assets/icons/grid-four-light-8f165eaf.svg"); }
.icon--hand-heart-light { --svg: url("/assets/icons/hand-heart-light-45ca764b.svg"); }
.icon--hard-drives-light { --svg: url("/assets/icons/hard-drives-light-8a2c05d5.svg"); }
.icon--hard-hat-light { --svg: url("/assets/icons/hard-hat-light-7db914b0.svg"); }
.icon--house-light { --svg: url("/assets/icons/house-light-91f2add4.svg"); }
.icon--lightning-light { --svg: url("/assets/icons/lightning-light-dad22263.svg"); }
.icon--list-checks-light { --svg: url("/assets/icons/list-checks-light-4a3d733c.svg"); }
.icon--magnifying-glass-light { --svg: url("/assets/icons/magnifying-glass-light-e194a7f7.svg"); }
.icon--monitor-light { --svg: url("/assets/icons/monitor-light-f5139c1a.svg"); }
.icon--motorcycle-light { --svg: url("/assets/icons/motorcycle-light-d3b58cd0.svg"); }
.icon--pipe-light { --svg: url("/assets/icons/pipe-light-6b5833f5.svg"); }
.icon--pipe-wrench-light { --svg: url("/assets/icons/pipe-wrench-light-32040c0d.svg"); }
.icon--radioactive-light { --svg: url("/assets/icons/radioactive-light-5c171729.svg"); }
.icon--ruler-light { --svg: url("/assets/icons/ruler-light-746233ae.svg"); }
.icon--seal-check-light { --svg: url("/assets/icons/seal-check-light-4305a5a2.svg"); }
.icon--shield-check-light { --svg: url("/assets/icons/shield-check-light-14faa1cf.svg"); }
.icon--sliders-light { --svg: url("/assets/icons/sliders-light-852c498b.svg"); }
.icon--sun-light { --svg: url("/assets/icons/sun-light-d34f414e.svg"); }
.icon--thermometer-light { --svg: url("/assets/icons/thermometer-light-9adbb07c.svg"); }
.icon--toilet-light { --svg: url("/assets/icons/toilet-light-cf9d8fe1.svg"); }
.icon--toolbox-light { --svg: url("/assets/icons/toolbox-light-dc6f2a67.svg"); }
.icon--tree-structure-light { --svg: url("/assets/icons/tree-structure-light-80032e8d.svg"); }
.icon--waveform-light { --svg: url("/assets/icons/waveform-light-34d65dee.svg"); }
.icon--wrench-light { --svg: url("/assets/icons/wrench-light-911d24a0.svg"); }