/* ========================================================================== Custom lightweight icons — replaces the Font Awesome CDN library. 10 icons actually used across the site, each ~200-500 bytes inline as a CSS mask, versus loading the full all.min.css for the same 10. Original/generic glyphs, not traced copies of brand logo artwork. ========================================================================== */ .fixrn-icon { display: inline-block; width: 1em; height: 1em; background-color: currentColor; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; vertical-align: -0.125em; } .fixrn-icon-arrow-left { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M20%2011H7.8l5.6-5.6L12%204l-8%208%208%208%201.4-1.4L7.8%2013H20z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M20%2011H7.8l5.6-5.6L12%204l-8%208%208%208%201.4-1.4L7.8%2013H20z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-envelope { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M2%204h20v16H2V4zm2%202.5V7l8%206.5L20%207v-.5H4zm16%203L12.6%2016a1%201%200%2001-1.2%200L4%209.5V18h16V9.5z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M2%204h20v16H2V4zm2%202.5V7l8%206.5L20%207v-.5H4zm16%203L12.6%2016a1%201%200%2001-1.2%200L4%209.5V18h16V9.5z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-phone { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6.6%2010.8c1.4%202.8%203.8%205.2%206.6%206.6l2.2-2.2c.3-.3.7-.4%201-.2%201.1.4%202.3.6%203.6.6.6%200%201%20.4%201%201V20c0%20.6-.4%201-1%201C10.6%2021%203%2013.4%203%204c0-.6.4-1%201-1h3.2c.6%200%201%20.4%201%201%200%201.3.2%202.5.6%203.6.1.3%200%20.7-.2%201L6.6%2010.8z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6.6%2010.8c1.4%202.8%203.8%205.2%206.6%206.6l2.2-2.2c.3-.3.7-.4%201-.2%201.1.4%202.3.6%203.6.6.6%200%201%20.4%201%201V20c0%20.6-.4%201-1%201C10.6%2021%203%2013.4%203%204c0-.6.4-1%201-1h3.2c.6%200%201%20.4%201%201%200%201.3.2%202.5.6%203.6.1.3%200%20.7-.2%201L6.6%2010.8z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-triangle-exclamation { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%203L2%2021h20L12%203zm0%206.5a1%201%200%20011%201V15a1%201%200%2001-2%200v-4.5a1%201%200%20011-1zM12%2018a1.25%201.25%200%20110-2.5%201.25%201.25%200%20010%202.5z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%203L2%2021h20L12%203zm0%206.5a1%201%200%20011%201V15a1%201%200%2001-2%200v-4.5a1%201%200%20011-1zM12%2018a1.25%201.25%200%20110-2.5%201.25%201.25%200%20010%202.5z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-wrench { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M21%206.8a5%205%200%2001-6.4%204.8L8%2018.2l-2.2-2.2%206.6-6.6A5%205%200%200117%203l-2.8%202.8%201.4%201.4L18.2%204.4A5%205%200%200121%206.8z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M21%206.8a5%205%200%2001-6.4%204.8L8%2018.2l-2.2-2.2%206.6-6.6A5%205%200%200117%203l-2.8%202.8%201.4%201.4L18.2%204.4A5%205%200%200121%206.8z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-rss { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4%204v3a13%2013%200%200113%2013h3A16%2016%200%20004%204zm0%206v3a7%207%200%20017%207h3a10%2010%200%2000-10-10zm2%207a2%202%200%20100%204%202%202%200%20000-4z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4%204v3a13%2013%200%200113%2013h3A16%2016%200%20004%204zm0%206v3a7%207%200%20017%207h3a10%2010%200%2000-10-10zm2%207a2%202%200%20100%204%202%202%200%20000-4z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-facebook-f { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ctext%20x%3D%2212%22%20y%3D%2218%22%20font-size%3D%2217%22%20font-weight%3D%22700%22%20text-anchor%3D%22middle%22%20font-family%3D%22Arial%2Csans-serif%22%3Ef%3C%2Ftext%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ctext%20x%3D%2212%22%20y%3D%2218%22%20font-size%3D%2217%22%20font-weight%3D%22700%22%20text-anchor%3D%22middle%22%20font-family%3D%22Arial%2Csans-serif%22%3Ef%3C%2Ftext%3E%3C%2Fsvg%3E"); } .fixrn-icon-x-twitter { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4.3%204h3l4.8%206.4L17%204h2.7l-6.2%207.3L20%2020h-3l-5.2-6.9L6.3%2020H3.6l6.6-7.8z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4.3%204h3l4.8%206.4L17%204h2.7l-6.2%207.3L20%2020h-3l-5.2-6.9L6.3%2020H3.6l6.6-7.8z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-pinterest-p { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ctext%20x%3D%2212%22%20y%3D%2218%22%20font-size%3D%2216%22%20font-weight%3D%22700%22%20text-anchor%3D%22middle%22%20font-family%3D%22Arial%2Csans-serif%22%3EP%3C%2Ftext%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ctext%20x%3D%2212%22%20y%3D%2218%22%20font-size%3D%2216%22%20font-weight%3D%22700%22%20text-anchor%3D%22middle%22%20font-family%3D%22Arial%2Csans-serif%22%3EP%3C%2Ftext%3E%3C%2Fsvg%3E"); } .fixrn-icon-reddit-alien { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%227%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2212%22%20r%3D%221.3%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2212%22%20r%3D%221.3%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M12%203v3M9%2016c1%201%205%201%206%200%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213%22%20r%3D%227%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2212%22%20r%3D%221.3%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2212%22%20r%3D%221.3%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M12%203v3M9%2016c1%201%205%201%206%200%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.4%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-whatsapp { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%203a9%209%200%2000-7.8%2013.5L3%2021l4.7-1.2A9%209%200%201012%203zm4.7%2012.4c-.2.6-1.2%201.1-1.7%201.2-.4.1-1%20.1-1.6-.1-.4-.1-.9-.3-1.5-.6-2.7-1.2-4.4-3.9-4.6-4.1-.1-.2-1.1-1.4-1.1-2.7%200-1.3.7-1.9%201-2.2.2-.2.5-.3.8-.3h.5c.2%200%20.4%200%20.5.4l.9%202.1c.1.2.1.4%200%20.5l-.4.6c-.1.2-.2.3-.1.5.3.6%201%201.4%201.6%201.9.7.6%201.2.8%201.4.9.2.1.3.1.5-.1l.6-.8c.2-.2.3-.2.5-.1l2%201c.2.1.3.1.4.2%200%20.2%200%20.5-.2%201.1z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%203a9%209%200%2000-7.8%2013.5L3%2021l4.7-1.2A9%209%200%201012%203zm4.7%2012.4c-.2.6-1.2%201.1-1.7%201.2-.4.1-1%20.1-1.6-.1-.4-.1-.9-.3-1.5-.6-2.7-1.2-4.4-3.9-4.6-4.1-.1-.2-1.1-1.4-1.1-2.7%200-1.3.7-1.9%201-2.2.2-.2.5-.3.8-.3h.5c.2%200%20.4%200%20.5.4l.9%202.1c.1.2.1.4%200%20.5l-.4.6c-.1.2-.2.3-.1.5.3.6%201%201.4%201.6%201.9.7.6%201.2.8%201.4.9.2.1.3.1.5-.1l.6-.8c.2-.2.3-.2.5-.1l2%201c.2.1.3.1.4.2%200%20.2%200%20.5-.2%201.1z%22%2F%3E%3C%2Fsvg%3E"); } /* Audio-read controls (play/pause/stop) — added for the article read-aloud feature */ .fixrn-icon-play { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M8%205v14l11-7z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M8%205v14l11-7z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-pause { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6%205h4v14H6zM14%205h4v14h-4z%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6%205h4v14H6zM14%205h4v14h-4z%22%2F%3E%3C%2Fsvg%3E"); } .fixrn-icon-stop { -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Crect%20x%3D%226%22%20y%3D%226%22%20width%3D%2212%22%20height%3D%2212%22%2F%3E%3C%2Fsvg%3E"); mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Crect%20x%3D%226%22%20y%3D%226%22%20width%3D%2212%22%20height%3D%2212%22%2F%3E%3C%2Fsvg%3E"); }