/* tonic-icons.css
   Hand-drawn raster icons that replace inline emoji in icon slots.
   Each <img class="tn-ico"> degrades gracefully: if the file fails to
   load, an inline onerror handler swaps it for the original emoji, so
   layout and meaning are preserved with no JS dependency. */

.tn-ico{
  display:inline-block;
  object-fit:contain;
  vertical-align:middle;
  /* slight lift so the drop-shadow sticker art sits visually centred */
  -webkit-user-select:none; user-select:none; pointer-events:none;
}

/* --- Main menu (music-theory-menu.html) --- */
.mc-path .mc-icon-wrap .tn-ico{ width:42px; height:42px; }
.mc-explore .me-icon .tn-ico{ width:34px; height:34px; }
.mc-test .mt-icon .tn-ico{ width:30px; height:30px; }
.mc-util .mu-icon .tn-ico{ width:30px; height:30px; }

/* --- About page (music-theory-about.html) --- */
.feature-ico .tn-ico{ width:32px; height:32px; }
.sell-ico .tn-ico{ width:28px; height:28px; }
/* inline icon prepended to a heading */
.tn-ico-h2{ width:26px; height:26px; margin-right:9px; transform:translateY(-1px); }