/* Icons: Fizzy's stencil trick. The SVG is a mask, currentColor the
   paint — an icon takes the text color beside it for free, and one knob
   (--icon-size) sets its measure. */
@layer components {

.icon {
  display: inline-block;
  flex: none;
  inline-size: var(--icon-size, 1.1em);
  block-size: var(--icon-size, 1.1em);
  background-color: currentColor;
  -webkit-mask: var(--svg) no-repeat center / contain;
  mask: var(--svg) no-repeat center / contain;
}
.icon--arrow-left { --svg: url("/assets/icons/arrow-left-551652c3.svg"); }
.icon--gear { --svg: url("/assets/icons/gear-bd201bc2.svg"); }
.icon--house { --svg: url("/assets/icons/house-64f97034.svg"); }
.icon--sun { --svg: url("/assets/icons/sun-3cd0d14e.svg"); }
.icon--calendar-week { --svg: url("/assets/icons/calendar-week-a34c7fb8.svg"); }
.icon--calendar-month { --svg: url("/assets/icons/calendar-month-cd65ef14.svg"); }
.icon--history { --svg: url("/assets/icons/history-65791a3d.svg"); }
.icon--sparkle { --svg: url("/assets/icons/sparkle-3023a5a7.svg"); }
.icon--users { --svg: url("/assets/icons/users-7215e7c2.svg"); }
.icon--plus { --svg: url("/assets/icons/plus-cea32dba.svg"); }
.icon--book { --svg: url("/assets/icons/book-d9df25d0.svg"); }
.icon--wheel { --svg: url("/assets/icons/wheel-01197941.svg"); }
.icon--sectors { --svg: url("/assets/icons/sectors-f0d0a4ca.svg"); }
.icon--pencil { --svg: url("/assets/icons/pencil-397b2f97.svg"); }
.icon--account { --svg: url("/assets/icons/account-7de3f6ae.svg"); }
.icon--key { --svg: url("/assets/icons/key-497acc17.svg"); }
.icon--exit { --svg: url("/assets/icons/exit-d69d9f0e.svg"); }

}
