/* ============================================================
   site-icons.css  --  SITE-WIDE
   Inline-icon sizing for the shared SVG symbol sprite
   (images/elements/site-icons-sprite.svg -- an EXTERNAL cached
   asset; no longer inlined into each page's HTML).
   Icons are referenced as:
     <svg class="icon" aria-hidden="true"><use href="/images/elements/site-icons-sprite.svg#ico-NAME"/></svg>
   currentColor lives on each <symbol>, so an icon inherits its
   container's text colour -- e.g. the S3 icon tiles tint it
   #2c3e2d, the S8 checks tint it fern -- exactly like the
   previous inline SVGs. No per-page icon CSS required.
   ASCII-clean (SmarterASP.NET upload filter).
   ============================================================ */
.icon { width: 1em; height: 1em; display: inline-block; vertical-align: middle; }

/* ============================================================
   AUTHORING NOTE -- making an icon fill its box exactly
   ------------------------------------------------------------
   When a symbol's visible edge must line up with the CSS box
   size (e.g. a ring/circle that should measure a true 30px in a
   30px box), draw the edge as a FILLED shape, not a STROKE.

   Why: a stroke straddles its path -- half its width sits
   outside the path radius. So a stroked circle at r=13.5 with
   stroke-width 3 has a path (centre-line) diameter of 27, and
   dev tools / measuring tools report that 27, leaving an
   apparent gap to the 30px box. You cannot make both the path
   diameter AND the outer stroke edge equal the box at once.

   Fix that works reliably: build the ring as a filled path with
   fill-rule:evenodd -- an outer circle at r = boxSize/2 (so the
   fill reaches the box edge exactly) minus an inner circle whose
   radius sets the ring thickness. Example (ico-checkmark-in-circle,
   30-unit viewBox): outer r=15, inner r=12 -> a 3px-thick ring
   that measures a true 30/30.
     - Ring thickness = outer radius - inner radius.
     - Keep the viewBox number equal to the intended pixel size;
       do NOT pad the viewBox to make room for a stroke -- a
       33-unit viewBox rendered in a 30px box scales everything
       by 30/33 (0.909) and silently shrinks the icon.
   The inner glyph (e.g. the check tick) can stay a stroke; only
   the box-filling outer edge needs to be a fill.
   ============================================================ */
