.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    min-width: 1em;
    min-height: 1em;

    background-color: currentColor;
    color: currentColor;

    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;

    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.icon-xxxs { font-size: 12px; }
.icon-xxs { font-size: 16px; }
.icon-xs { font-size: 20px; }
.icon-sm { font-size: 24px; }
.icon-md { font-size: 28px; }

.icon-graduation {
    --icon-mask-image: url('/images/graduation.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-trophy {
    --icon-mask-image: url('/images/trophy.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-answers {
    --icon-mask-image: url('/images/answers.svg?v=d0efb3a304df');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.stats-page .icon-schedule {
    --icon-mask-image: url('/images/app-dock-dates.svg?v=90eebbe8f7c4');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-progress {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'>\
<path d='M3 3V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H21' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M7 17L7 15' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M15 17L15 9' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M11 17L11 12' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
<path d='M19 17L19 6' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-arena {
    --icon-mask-image: url('/images/blitz.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-kanji {
    --icon-mask-image: url('/images/app-dock-kanji.svg?v=cf67e01d72d0');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-dates-info {
    --icon-mask-image: url('/images/about.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-route {
    --icon-mask-image: url('/images/route.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

@media (max-width: 768px) {
.icon-xxs { font-size: 12px; }
.icon-xs { font-size: 16px; }
.icon-sm { font-size: 20px; }
.icon-md { font-size: 24px; }
}

.icon-plus {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'>\
<path fill='black' fill-rule='evenodd' clip-rule='evenodd' d='M10 0C11.6759 0 13.308 .152572 14.8646 .327315L14.8676 .327657C16.0994 .469886 17.2469 1.0253 18.1227 1.90328C18.9985 2.78128 19.5509 3.93008 19.6899 5.16234L19.6905 5.16752C19.8566 6.71442 20 8.33556 20 10C20 11.6645 19.8566 13.2842 19.6907 14.8324L19.6899 14.8377C19.5509 16.0699 18.9985 17.2187 18.1227 18.0968C17.2469 18.9747 16.0994 19.5301 14.8676 19.6724L14.8644 19.6728C13.3065 19.8474 11.6759 20 10 20C8.32408 20 6.69204 19.8474 5.13543 19.6728L5.13244 19.6724C3.90053 19.5301 2.75314 18.9747 1.87737 18.0968C1.0016 17.2187 .449124 16.0699 .310019 14.8377L.309429 14.8324C.143391 13.2842 0 11.663 0 10C0 8.33701 .143391 6.71585 .309429 5.16627L.310019 5.1609C.449124 3.92863 1.0016 2.77983 1.87737 1.90185C2.75314 1.02385 3.90053 .468439 5.13244 .32621L5.13728 .325657C6.69299 .154095 8.32392 0 10 0ZM8.80949 5.2381C8.80949 4.58061 9.34249 4.04762 9.99996 4.04762C10.6574 4.04762 11.1904 4.58061 11.1904 5.2381V8.80952H14.7619C15.4194 8.80952 15.9524 9.34251 15.9524 10C15.9524 10.6575 15.4194 11.1905 14.7619 11.1905H11.1904V14.7619C11.1904 15.4194 10.6574 15.9524 9.99996 15.9524C9.34249 15.9524 8.80949 15.4194 8.80949 14.7619V11.1905H5.2381C4.58061 11.1905 4.04762 10.6575 4.04762 10C4.04762 9.34251 4.58061 8.80952 5.2381 8.80952H8.80949V5.2381Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-home {
    --icon-mask-image: url("/images/app-dock-home.svg?v=2b89f4439e18");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-holiday {
    --icon-mask-image: url('/images/holiday.svg?v=36c5c3752a02');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-schedule {
    --icon-mask-image: url('/images/app-dock-dates.svg?v=90eebbe8f7c4');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-saved {
    --icon-mask-image: url("/images/app-dock-saved.svg?v=ef3ec958b02c");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-search {
    --icon-mask-image: url("/images/app-dock-find.svg?v=a287ad9bdfd0");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-prime {
    --icon-mask-image: url('/images/crown.svg?v=e7453709cf68');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-done {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='black' d='M9.38547 23.6229C8.60335 23.6229 7.94413 23.2933 7.40782 22.6341L.586592 14.1369C.374302 13.8799 .223464 13.6341 .134078 13.3994C.0446927 13.1536 0 12.9022 0 12.6452C0 12.0754 .189944 11.6061 .569832 11.2374C.949721 10.8575 1.43575 10.6676 2.02793 10.6676C2.68715 10.6676 3.24022 10.9525 3.68715 11.5223L9.31844 18.7625L20.2123 1.43294C20.4693 1.05305 20.7318 .784896 21 .628472C21.2682 .460874 21.6034 .377075 22.0056 .377075C22.5866 .377075 23.0615 .561433 23.4302 .930148C23.8101 1.28769 24 1.75138 24 2.32121C24 2.54467 23.9609 2.77372 23.8827 3.00836C23.8156 3.243 23.6983 3.48881 23.5307 3.74579L11.3631 22.5838C10.8939 23.2765 10.2346 23.6229 9.38547 23.6229Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-idea {
    --icon-mask-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M12.0002%202V3.5M1.16992%2012H2.66992M21.2513%2012H22.7513M4.48776%204.70386L5.60665%205.82275M19.6283%204.70386L18.5094%205.82275M6.00017%2012.7143C6.00017%209.55837%208.68646%207%2012.0002%207C15.3139%207%2018.0002%209.55837%2018.0002%2012.7143C18.0002%2014.5456%2017.0956%2016.1758%2015.6888%2017.2215C15.0202%2017.7185%2014.686%2017.9669%2014.558%2018.1346C14.4113%2018.3268%2014.375%2018.3988%2014.3084%2018.6311C14.2502%2018.8339%2014.2502%2019.1093%2014.2502%2019.6601V20.08C14.2502%2020.7521%2014.2502%2021.0881%2014.1194%2021.3448C14.0043%2021.5706%2013.8208%2021.7542%2013.595%2021.8692C13.3383%2022%2013.0022%2022%2012.3302%2022H11.6702C10.9981%2022%2010.6621%2022%2010.4054%2021.8692C10.1796%2021.7542%209.99601%2021.5706%209.88096%2021.3448C9.75017%2021.0881%209.75017%2020.7521%209.75017%2020.08V19.6601C9.75017%2019.1093%209.75017%2018.8339%209.69197%2018.6311C9.62529%2018.3988%209.58909%2018.3268%209.44239%2018.1346C9.31436%2017.9669%208.98009%2017.7185%208.31157%2017.2215C6.90474%2016.1758%206.00017%2014.5456%206.00017%2012.7143Z%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-words {
    --icon-mask-image: url('/images/words.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-warning {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='black' d='M23.0916 15.8367L15.0054 3.06709C14.3252 2.08668 13.1942 1.49609 12.0032 1.49609C10.8122 1.49609 9.68168 2.07636 8.971 3.09711L.925123 15.8166C-.0956225 17.2778-.285605 19.0289 .424601 20.3799C1.12496 21.7309 2.59603 22.5016 4.43769 22.5016H19.5687C21.4203 22.5016 22.881 21.7309 23.5818 20.3799C24.2822 19.0289 24.0922 17.2876 23.0916 15.8367ZM11.0026 7.50048C11.0026 6.95023 11.453 6.49991 12.0032 6.49991C12.5535 6.49991 13.0038 6.95023 13.0038 7.50048V13.5049C13.0038 14.0551 12.5535 14.5054 12.0032 14.5054C11.453 14.5054 11.0026 14.0551 11.0026 13.5049V7.50048ZM12.0032 19.5093C11.1725 19.5093 10.5021 18.8389 10.5021 18.0082C10.5021 17.1774 11.1725 16.5071 12.0032 16.5071C12.834 16.5071 13.5043 17.1774 13.5043 18.0082C13.5043 18.8389 12.834 19.5093 12.0032 19.5093Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-like-active {
    --icon-mask-image: url("/images/bookmark-added.svg?v=8aa74693f9a4");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-like {
    --icon-mask-image: url("/images/bookmark.svg?v=5120ec48004c");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-finished {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='none' stroke='black' stroke-width='1.84212' stroke-linecap='round' stroke-linejoin='round' d='M1.95634 18.5595C1.90527 16.7811 3.46283 13.7374 10.2804 14.943'/>\
<path fill='none' stroke='black' stroke-width='1.84212' stroke-linecap='round' stroke-linejoin='round' d='M12.0228 15.1298C15.5811 15.5469 19.2429 15.9762 21.5665 13.9745C21.5665 13.9745 22.3833 12.3249 22.3833 7.91679C22.3833 3.50874 21.0715 .922362 21.0715 .922362C19.1135 2.78649 15.5895 2.64803 12.0739 2.50989C7.6233 2.33502 3.18608 2.16069 1.95623 6.05061C1.51041 10.0442 1.50777 14.5286 1.9407 18.5246C1.94539 18.5082 1.95012 18.4917 1.9549 18.4754C1.95477 16.6957 3.55352 13.7836 10.1858 14.9263C10.79 14.9852 11.4048 15.0573 12.0228 15.1298Z'/>\
<path fill='none' stroke='black' stroke-width='1.82659' stroke-linecap='round' stroke-linejoin='round' d='M1.78827 17.0059C1.78827 17.0059 2.18649 21.1168 2.50364 23.0874'/>\
<path fill='black' d='M8.60364 8.5258C4.41613 8.18867 2.42296 9.47951 1.94982 10.1671L1.4397 8.10438L3.39149 3.97899C4.81098 3.2175 7.75642 1.93405 8.18226 2.8922C8.71457 4.0899 8.71457 7.35028 8.60364 8.5258Z'/>\
<path fill='black' d='M16.0338 9.10247C19.1389 9.2799 21.4234 8.23008 22.1775 7.68299L21.1351 1.67236C19.0428 1.73151 14.9825 2.06271 15.4793 2.91441C16.1003 3.97902 16.1447 7.54992 16.0338 9.10247Z'/>\
<path fill='black' d='M8.60363 8.48138C8.35521 10.788 8.70714 13.3017 8.91415 14.2703C11.5757 14.8395 16.8012 15.8184 16.4108 15.1796C15.9229 14.3812 15.9517 10.7896 16.0405 9.10393C13.3302 9.10393 10.4889 8.76975 8.60363 8.48138Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

/* *** MENU ITEM ICONS *** */

.icon-close {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'>\
<path d='M7 7L12 12M12 12L17 17M12 12L17 7M12 12L7 17' stroke='black' stroke-width='2' stroke-linecap='round'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-unread {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.8 23.9'>\
<path d='M7.2,2.6h9.3c1.5,0,2.8,1.3,2.8,2.8v7h0v4.2l1.9,1.9s0,0,0,0V5.4c0-2.6-2.1-4.7-4.7-4.7H7.2c-1,0-2,.3-2.7.9l1.3,1.3c.4-.2.9-.4,1.4-.4Z'/>\
<path d='M16.5,21.2H6.3c-1,0-1.9-.8-1.9-1.9s.8-1.9,1.9-1.9h8.3l-1.9-1.9h-6.5c-.7,0-1.3.2-1.9.5V7.3l-1.9-1.9s0,0,0,0v14c0,2.1,1.7,3.7,3.7,3.7h10.2c1,0,2-.3,2.7-.9l-1.3-1.3c-.4.2-.9.4-1.4.4Z'/>\
<path d='M23.5,22.2L1.7.3c-.4-.4-1-.4-1.4,0-.4.4-.4,1,0,1.4l21.8,21.9c.2.2.5.3.7.3s.5,0,.7-.3c.4-.4.4-1,0-1.4Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

/* Learning-library tile controls. The masks are bundled so every tile does
   not spend another HTTP request on a decorative SVG. */

.icon-brain,
.icon-brain-added {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M5.33615 9.59326C4.85833 9.29182 4.43823 8.90058 4.10472 8.43559C3.77121 7.9706 3.52107 7.43185 3.38639 6.83858C3.2517 6.24532 3.24529 5.65205 3.3447 5.08765C3.44411 4.52324 3.65576 3.9877 3.9572 3.50988C4.25865 3.03206 4.64988 2.61197 5.11487 2.27846C5.57987 1.94494 6.11862 1.69481 6.71188 1.56012C7.30515 1.42544 7.89841 1.41902 8.46282 1.51843C9.02722 1.61785 9.56276 1.8295 10.0406 2.13094C10.5184 2.43238 10.9385 2.82362 11.272 3.28861C11.6055 3.7536 11.8557 4.29235 11.9903 4.88562'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M3.24527 16.1128C2.03309 14.9006 1.28268 13.2234 1.28268 11.3699C1.28268 9.51632 2.03309 7.84235 3.24527 6.62695'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M5.33615 14.5029C4.85833 14.8044 4.43823 15.1956 4.10472 15.6606C3.77121 16.1256 3.52107 16.6643 3.38639 17.2576C3.2517 17.8509 3.24529 18.4441 3.3447 19.0085C3.44411 19.5729 3.65576 20.1085 3.9572 20.5863C4.25865 21.0641 4.64988 21.4842 5.11487 21.8177C5.57987 22.1512 6.11862 22.4014 6.71188 22.5361C7.30515 22.6708 7.89841 22.6772 8.46282 22.5778C9.02722 22.4783 9.56276 22.2667 10.0406 21.9653C10.5184 21.6638 10.9385 21.2726 11.272 20.8076C11.6055 20.3426 11.8557 19.8038 11.9903 19.2106'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M12.0096 4.90491V19.0246'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M9.2132 13.3998C9.73912 13.1914 10.2234 12.8867 10.6402 12.4891C11.0571 12.0914 11.4003 11.6104 11.644 11.0524C11.8877 10.4944 12.0064 9.91078 12.0096 9.33997'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M18.6637 9.49707C19.1416 9.19563 19.5617 8.80439 19.8952 8.3394C20.2287 7.87441 20.4788 7.33566 20.6135 6.74239C20.7482 6.14913 20.7546 5.55586 20.6552 4.99146C20.5558 4.42705 20.3441 3.89151 20.0427 3.41369C19.7412 2.93587 19.35 2.51578 18.885 2.18226C18.42 1.84875 17.8813 1.59862 17.288 1.46393C16.6947 1.32924 16.1015 1.32283 15.5371 1.42224C14.9727 1.52165 14.4371 1.73331 13.9593 2.03475C13.4815 2.33619 13.0614 2.72743 12.7279 3.19242C12.3944 3.65741 12.1442 4.19616 12.0096 4.78943'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M20.7546 16.0134C21.9668 14.8012 22.7172 13.1241 22.7172 11.2705C22.7172 9.42016 21.9668 7.74298 20.7546 6.52759'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M18.6637 14.4067C19.1416 14.7082 19.5617 15.0994 19.8952 15.5644C20.2287 16.0294 20.4788 16.5681 20.6135 17.1614C20.7482 17.7547 20.7546 18.3479 20.6552 18.9124C20.5558 19.4768 20.3441 20.0123 20.0427 20.4901C19.7412 20.9679 19.35 21.388 18.885 21.7215C18.42 22.0551 17.8813 22.3052 17.288 22.4399C16.6947 22.5746 16.1015 22.581 15.5371 22.4816C14.9727 22.3822 14.4371 22.1705 13.9593 21.8691C13.4815 21.5676 13.0614 21.1764 12.7279 20.7114C12.3944 20.2464 12.1442 19.7076 12.0096 19.1144'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M11.9903 4.80554V18.9253'/>\
<path fill='none' stroke='black' stroke-width='2.56547' stroke-linecap='round' stroke-linejoin='round' d='M14.7867 13.3036C14.2608 13.0952 13.7765 12.7905 13.3596 12.3929C12.9428 11.9952 12.5996 11.5142 12.3559 10.9562C12.1122 10.3982 11.9935 9.81459 11.9903 9.24377'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-brain {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M5.32931 9.69757C4.8543 9.41925 4.43264 9.05163 4.09296 8.60941C3.75327 8.16719 3.49243 7.65046 3.34229 7.07695C3.19215 6.50344 3.16695 5.92583 3.24573 5.37295C3.32452 4.82007 3.51354 4.29171 3.79186 3.8167C4.07018 3.3417 4.4378 2.92004 4.88002 2.58035C5.32224 2.24066 5.83897 1.97983 6.41248 1.82969C6.98599 1.67955 7.56359 1.65434 8.11647 1.73312C8.66936 1.81191 9.19771 2.00093 9.67272 2.27925C10.1477 2.55757 10.5694 2.92519 10.9091 3.36742C11.2488 3.80964 11.5096 4.32636 11.6597 4.89987'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M3.16049 15.9793C1.97924 14.7981 1.24799 13.1637 1.24799 11.3575C1.24799 9.55122 1.97924 7.91997 3.16049 6.7356'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M5.19799 14.4106C4.73236 14.7044 4.32299 15.0856 3.99799 15.5388C3.67299 15.9919 3.42924 16.5169 3.29799 17.095C3.16674 17.6731 3.16049 18.2513 3.25736 18.8013C3.35424 19.3513 3.56049 19.8731 3.85424 20.3388C4.14799 20.8044 4.52924 21.2138 4.98236 21.5388C5.43549 21.8638 5.96049 22.1075 6.53861 22.2388C7.11674 22.37 7.69486 22.3763 8.24486 22.2794C8.79486 22.1825 9.31674 21.9763 9.78236 21.6825C10.248 21.3888 10.6574 21.0075 10.9824 20.5544C11.3074 20.1013 11.5511 19.5763 11.6824 18.9981'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M11.7011 5.0575V18.8169'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M8.97614 13.3356C9.48864 13.1325 9.96051 12.8356 10.3668 12.4481C10.773 12.0606 11.1074 11.5919 11.3449 11.0481C11.5824 10.5044 11.698 9.93564 11.7011 9.37939'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M20.223 15.8857C20.8136 15.295 21.2917 14.5888 21.623 13.8075C21.9542 13.0263 22.1355 12.1669 22.1355 11.2638'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M18.1855 14.3169C18.6511 14.6106 19.0605 14.9919 19.3855 15.445C19.7105 15.8981 19.9542 16.4231 20.0855 17.0013C20.2167 17.5794 20.223 18.1575 20.1261 18.7075C20.0292 19.2575 19.823 19.7794 19.5292 20.245C19.2355 20.7106 18.8542 21.12 18.4011 21.445C17.948 21.77 17.423 22.0138 16.8449 22.145C16.2667 22.2763 15.6886 22.2825 15.1386 22.1856C14.5886 22.0888 14.0667 21.8825 13.6011 21.5888C13.1355 21.295 12.7261 20.9138 12.4011 20.4606C12.0761 20.0075 11.8324 19.4825 11.7011 18.9044'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M11.6824 5.47546V18.7199'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M14.4074 13.2419C13.8949 13.0388 13.423 12.7419 13.0167 12.3544C12.6105 11.9669 12.2761 11.4981 12.0386 10.9544C11.8011 10.4106 11.6855 9.84189 11.6824 9.28564'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M15.1058 5.77441H22.748'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M18.9269 1.65442V9.29659'/>\
</svg>");
}

.icon-preview {
    --icon-mask-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 24'>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' fill-rule='evenodd' clip-rule='evenodd' d='M15.9594 12.0001C15.9594 14.076 14.2759 15.7595 12.2 15.7595C10.1241 15.7595 8.44058 14.076 8.44058 12.0001C8.44058 9.92306 10.1241 8.24072 12.2 8.24072C14.2759 8.24072 15.9594 9.92306 15.9594 12.0001Z'/>\
<path fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' fill-rule='evenodd' clip-rule='evenodd' d='M1.20001 12.0001C1.20001 15.8998 6.12457 20.6816 12.2 20.6816C18.2743 20.6816 23.2 15.9033 23.2 12.0001C23.2 8.0968 18.2743 3.31848 12.2 3.31848C6.12457 3.31848 1.20001 8.10037 1.20001 12.0001Z'/>\
</svg>");
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-delete {
    --icon-mask-image: url('/images/trash.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

/* Shared glyphs: route styles only control size and color. */

.icon-timer {
    --icon-mask-image: url('/images/practice-timer.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-tutorial {
    --icon-mask-image: url('/images/lobby/tutorial.svg?v=f9eaca5e1af2');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-tile-checked {
    --icon-mask-image: url('/images/tile-checked.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-question-circle {
    --icon-mask-image: url('/images/home-question-circle.svg');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-file-edit {
    --icon-mask-image: url('/images/home-file-edit.svg?v=d187bdd0dc04');
    -webkit-mask-image: var(--icon-mask-image);
    mask-image: var(--icon-mask-image);
}

.icon-subscribe { --icon-mask-image: url('/images/premium-subscribe.svg'); -webkit-mask-image: var(--icon-mask-image); mask-image: var(--icon-mask-image); }
.icon-unsubscribe { --icon-mask-image: url('/images/premium-unsubscribe.svg'); -webkit-mask-image: var(--icon-mask-image); mask-image: var(--icon-mask-image); }
.icon-receipt { --icon-mask-image: url('/images/premium-receipt.svg'); -webkit-mask-image: var(--icon-mask-image); mask-image: var(--icon-mask-image); }
.icon-lock { --icon-mask-image: url('/images/premium-lock.svg'); -webkit-mask-image: var(--icon-mask-image); mask-image: var(--icon-mask-image); }