@font-face {
    font-family: "Fixel";
    src: url('/FixelDisplay-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: fallback;
} 
@font-face {
    font-family: "Fixel";
    src: url('/FixelDisplay-RegularItalic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
    font-display: fallback;
} 
@font-face {
    font-family: "Fixel";
    src: url('/FixelDisplay-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: fallback;
}
@font-face {
    font-family: "Fixel";
    src: url('/FixelDisplay-BoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: fallback;
}
:root {
    --system-ui: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: auto; 
    --link-color: #FF9933; 
    --link-hover-color: #FFB84D; 
    --link-active-color: #CC6600;
    --link-underline-color: rgba(255, 153, 51, 0.45);
    --link-underline-hover-color: rgba(255, 184, 77, 0.7); 
    --main-font-color: #EAE6E2;
    --supporting-text: #AAA4A0; 
}
html {
    scroll-behavior: smooth;
}
body {
    font-family: "Fixel", var(--system-ui);
    color: var(--main-font-color); 
    max-width: 1000px;
    font-size: 19px;
    line-height: 1.5em;
    margin: 0 auto;
    background-color:#181B1A;
}
@media (max-width: 1024px) {
    body {
        max-width: 90%;
    }
}
@media (max-width: 768px) {
    body {
        max-width: 95%;
    }
}
@media (max-width: 480px) {
    body {
        max-width: 100%;
        padding: 0 20px;
    }
}
img {
    max-width: 100%;
    height: auto;
}
.content-img {
    text-align: center;
    margin-bottom: 1em; 
}
.content-img:has(.with-shadow) {
    margin-bottom: 1.5em;
}
.rounded-corners {
    display: inline-block; 
    border-radius: 12px; 
    overflow: hidden; 
}
.with-shadow {
    display: inline-block;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
}
.rounded-corners img, .with-shadow img {
    display: block; 
    width: 100%;
    height: auto; 
}
.site-header {
    display: flex;
    justify-content: space-between;
    margin-top: 2em;
    margin-bottom: 3.5em;
    align-items: flex-start;
}
.site-header a,
.site-header a:hover,
.site-header a:active,
.site-header a:visited {
    text-decoration: none;
}
.sidenotes-header {
    margin-top: 2em;
}
.site-header-sidenotes {
    height: 115px;
}
.topnav {
    font-size: 0.90em;
    display: flex;
}
.topnav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    gap: 1.5em 1em;
    flex-wrap: wrap;
}
.topnav ul a, 
.topnav ul a:hover, 
.topnav ul a:active,
.topnav ul a:visited {
    text-decoration: none;
}
@media (max-width : 700px) {
    .site-header {
        flex-direction: column;
        gap: 0.55em;
    }
    .topnav {
        justify-content: flex-start;
        gap: 0.5em 1em;
        font-size: 0.75em;
    }
}
h1 {
    line-height: 1.1em;
}
h2 {
    font-size: 2.1em;
    line-height: 1.1em;
    font-weight: bold;
    margin-bottom: 0.1em;
}
.h2-sidenote-title {
    font-size: 1.75em;
}
h3 {
    font-size: 1.35em; 
    line-height: 1.2em;
    font-weight: bold;
}
h4 {
    font-size: 1.5em;
    font-weight: normal;
    padding-top: 1em;
    margin-block-start: 0;
    margin-block-end: 0.7em;
    display: block;
}
.no-bottom-margin {
    margin-block-end: 0;
}
.h4-description { 
    display: block; 
    text-align: center;
    font-size: 1.25em;
    margin-bottom: 1em;
    color: #818589;
}
h5 {
    font-size: 1.25em;
    font-weight: normal;
    padding-top: 1em;
    margin-block-start: 0;
    margin-block-end: 1em;
    display: block;
}
.h5-centered {
    text-align: center;
}
.centered-element {
    text-align: center;
}
.h5-centered a:link,
.h5-centered a:hover,
.h5-centered a:visited,
.h5-centered a:focus,  
.h5-centered a:active {
    text-decoration: none;
    color: inherit;
    text-shadow: none;
}
.h4-centered {
    text-align: center;
}
.centered-element {
    text-align: center;
}
.h4-centered a:link, 
.h4-centered a:visited, 
.h4-centered a:active,
.h4-centered a:focus {
    text-decoration: none;
    color: inherit; 
    text-shadow: none;
}
.fragment {
    position: relative;
}
.fragment::after {
    content: '#';
    font-size: 0.8em;
    color: lightgrey;
    position: absolute;
    right: -1.2em; 
    top: 0.1em;
    opacity: 0;
    transition: opacity 0.3s ease;
}
/* Show the # on hover */
.fragment:hover::after {
    opacity: 1;
}
/* Hide the # fragment on small screens */
@media screen and (max-width: 480px) {
    .fragment::after {
        display: none;
    }
}
a.post-header:link, 
a.post-header:visited { 
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.3s ease, color 0.3s ease;
}
a.post-header:hover {
    text-shadow: 0px 0px 7px rgba(234, 230, 226, 0.7);
}
a.post-header:active {
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
    transform: scale(0.98);
}
.title-n-date {
    text-align: center;
    margin-bottom: 0.75em;
    padding-top: 2.0em;
}
.post-date {
    font-size: 0.85em;
    color: var(--supporting-text);
}
a, a:link, a:visited {
    color: var(--link-color);
    text-decoration: underline; 
    text-decoration-thickness: 1.5px;
    text-underline-offset: 2px;
    text-decoration-color: var(--link-underline-color);
    transition: color 0.3s ease, text-decoration-color 0.3s ease;
}
a:hover, a:focus {
    color: var(--link-hover-color); 
    text-decoration-color: var(--link-underline-hover-color);
    text-shadow: 0 0 6px rgba(245, 166, 35, 0.6);
}
a:active {
    color: var(--link-active-color); 
    text-decoration: none;
}
article {
    margin-bottom: 4.5em;
}
.full-post {
    margin-bottom: 5.5em;
}
a.readfull-button:link, a.readfull-button:visited {
    border-radius: 5px;
    padding: 15px 19px;
    border: 1px solid rgba(255, 153, 51, 0.4);
    text-decoration: none;
    font-size: inherit;
    background-color: rgba(255, 153, 51, 0.12);
    color: #FF9933;
    transition: background-color 0.23s ease-in, color 0.23s ease-in, border-color 0.23s ease-in;
}
a.readfull-button:hover {
    background-color: rgba(255, 153, 51, 0.25);
    border-color: #FF9933;
    color: #ffbb66; 
}
a.readfull-button:active {
    box-shadow: 2px 2px 4px -1px rgba(0,0,0,0.6) inset;
    background-color: rgba(255, 153, 51, 0.35);
}
.read-full-container {
    text-align: center;
    margin-top: 2.25em;
}
.tag-container {
    padding-bottom: 1em;
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em 15px;
    justify-content: center;
    align-items: center;
}
.tag-container a:link, 
.tag-container a:visited,
.all-tags-container a:link,
.all-tags-container a:visited {
    display: inline-block;
    border-radius: 4px; 
    padding: 8px 15px;
    border: 1px solid rgba(73, 214, 200, 0.4); 
    background-color: rgba(73, 214, 200, 0.12);
    color: #49d6c8; 
    text-decoration: none;
    transition: background-color 0.23s ease-in, color 0.23s ease-in, border-color 0.23s ease-in;
} 
.tag-container a:hover,
.all-tags-container a:hover {
    background-color: rgba(73, 214, 200, 0.25);
    border-color: #49d6c8;
    color: #6ef0e4; 
    text-shadow: none;
}
.tag-container a:active,
.all-tags-container a:active {
    box-shadow: 2px 2px 4px -1px rgba(0,0,0,0.6) inset;
    background-color: rgba(73, 214, 200, 0.35);
}
.metadata { 
    font-size: 0.85em;
    display: flex;
    gap: 20px; 
    align-items: center;
    margin-bottom: 1.25em;
    padding-top: 1em;
}
@media (max-width : 400px) {
    .metadata {
        flex-direction: column;
    }
}
.metadata .icon {
    width: 45px;
    fill: var(--main-font-color);
    flex-shrink: 0;
}
.metadata-container {
    padding-bottom: 1.5em; 
}
.footer {
    border-top: 1px solid rgba(234, 230, 226, 0.3);
    padding-top: 2em;
    padding-bottom: 2.5em;
    display: flex;
    justify-content: space-between;
    font-size: 0.85em;
    gap: 25px 1.5em;
}
.footer a {
    text-decoration: none;
}
.paginator {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 4.5em;
}
@media (max-width : 500px) {
    .paginator {
        display: flex; 
        flex-direction: column;
        text-align: center;
        gap: 1.5em;
    }
}
.paginator a {
    text-decoration: none;
}
.bottomnav {
    display: flex;
    flex-wrap: nowrap;
    gap: 25px;
}
@media (max-width : 635px) {
    .footer {
    flex-wrap: wrap; 
    flex-direction: column;
    justify-content: center;
    text-align: center;
    }
    .bottomnav {
        text-align: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.5em 1em;
    }
}
.photo-comment { 
	display: inline-block;
	font-size: 0.85em;
    border-radius: 6px;
	padding: 2px 6px; 
	background-color: #F6F4F1;
    text-align: center;
}
/* CSS for the /posts page */
.page-list {
    display: flex; 
    flex-wrap: wrap;
    gap: 1.55em 30px;
    align-items: center;
    justify-content: center;
    padding-top: 1.5em;
    margin-bottom: 2.5em;
}
a.post-page-item:link, a.post-page-item:visited {
    display: flex; 
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    flex: 0 1 300px;
    height: 125px;  
    padding: 0.5em;
    box-sizing: border-box;
    word-break: break-word;
    border-radius: 5px;
    border: 1px solid rgba(255, 153, 51, 0.4);
    text-decoration: none;
    background-color: rgba(255, 153, 51, 0.12);
    color: #FF9933;
    transition: background-color 0.23s ease-in, color 0.23s ease-in, border-color 0.23s ease-in;
}
a.post-page-item:hover {
    background-color: rgba(255, 153, 51, 0.25);
    border-color: #FF9933;
    color: #ffbb66;
}
a.post-page-item:active {
    box-shadow: 2px 2px 4px -1px rgba(0,0,0,0.6) inset;
    background-color: rgba(255, 153, 51, 0.35);
}
.post-page-item-title { 
    font-weight: bold;
    text-align: center;
}
.post-page-post-date {
    font-size: 0.9em;
}
a.emochapter:link, a.emochapter:visited, a.emochapter:hover, a.emochapter:active {
    font-family: var(--system-ui);
    font-size: 36px;
	text-decoration: none;
	color: inherit;
}
.centered-emochapter {
    text-align: center;
    padding-top: 1.85em;
}
.emojiheader { 
    font-family: var(--system-ui);
    font-size: 36px;
    line-height: 36px;
    text-align: center;
    padding-top: 0.5em;
    margin-block-end: 19px;
}
.emojiheader a:link, 
.emojiheader a:hover, 
.emojiheader a:active, 
.emojiheader a:visited {
    text-decoration: none;
    color: inherit;
}
.emojiheader:has(.with-context) {
    margin-block-end: 0px;
}
.emojiheader a {
    display: inline-block;
    position: relative; 
    color: inherit;
    transition: transform 0.3s ease, text-shadow 0.3s ease;
    text-shadow: none;
}
.emojiheader a:hover {
    transform: scale(1.05);
    text-shadow: none; 
}
.emojiheader a:active {
    transform: scale(1.15); 
    text-shadow: none
}
.context:link,
.context:hover, 
.context:active, 
.context:visited {
    text-decoration: none;
    text-shadow: none;
    font-size: 0.9em;
    color: var(--supporting-text); 
}
.context-container {
    display: block;
    text-align: center;
    margin-bottom: 1em;
}
li {
    margin-bottom: 0.45em;
}
ul, ol {
    padding-inline-start: 1em;
}
/* styles for a tagged posts page */ 
.h1-tag-page {
    text-align: center;
    margin-top: 2.0em;
}
.highlighted-tag {
    color: var(--supporting-text);
}
/* styles for the page with all tags */ 
.all-tags-container { 
    display: flex; 
    flex-wrap: wrap;
    gap: 1.5em 35px; 
    justify-content: center;
    padding-top: 1.5em;
    padding-bottom: 2.5em;
}
.not-found {
    text-align: center;
    padding-top: 2em; 
    padding-bottom: 5em;
}
.suggestion-block {
    text-align: center;
    font-weight: 500;
    font-size: 1.1em;
    padding-bottom: 3.5em;
}
.comments {
    display: flex;
    align-items: center;
    gap: 25px;
    padding: 0.5em 20px 0.7em;
    margin: 3em auto 2.5em;
    font-size: 0.85em;
    color: #D4D0CC;  
    background-color: rgba(255, 255, 255, 0.05); /* subtle panel */
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
}
@media (max-width : 400px) {
    .comments {
        flex-direction: column;
        gap: 1em;
        padding: 1em 10px 0.7em;
    }
}
.comments a:link, .comments a:visited {
    color: #FF9933;
    text-decoration-color: rgba(255, 153, 51, 0.35);
}
.comments a:hover {
    color: #ffbb66; 
}
.comments a:active {
   color: #FF5E00; 
}
.comments p {
    all: unset; 
    display: block;
    margin-block-end: 0.35em;
}
.footnotes {
    border-bottom: 1px solid rgba(234, 230, 226, 0.15);
    padding-bottom: 1.5em;
    font-size: 0.9em;
}
.post-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.25em;
    flex-wrap: wrap;
    font-size: 0.9em;
}
.post-navigation .next-post {
    flex: 1 1 auto;
    text-align: left;
}
.post-navigation .prev-post {
    flex: 1 1 auto; 
    text-align: right;
}
/* When they wrap, center both */
@media (max-width: 768px) {
    .post-navigation {
        flex-direction: column;
        gap: 1.1em;
        margin-bottom: 2em;
    }
    .post-navigation .next-post,
    .post-navigation .prev-post {
        text-align: center; 
        flex: 1 1 100%;
    }
}
.post-navigation a {
    text-decoration: none;
} 
sub,
sup {
   font-size: 75%;
   line-height: 0;
   position: relative;
   vertical-align: baseline;
} 
sub {
   bottom: -0.25em;
} 
sup {
   top: -0.5em;
}
/* styles for About page */ 
.description {
	color: var(--supporting-text);
}
/* styles for sidenotes page */
.h1-sidenotes {
    margin-top: 2em;
    text-align: center;
    font-size: 2em;
    font-family: var(--system-ui);
}
.sidenotes-description {
    font-size: 0.85em;
    color: var(--supporting-text)
}
.breadcrumbs {
    margin-block-start: 0;
    margin-block-end: 0;
}
.breadcrumbs:hover a {
    text-decoration: none;
}
.breadcrumbs a:link,
.breadcrumbs a:hover, 
.breadcrumbs a:active, 
.breadcrumbs a:focus, 
.breadcrumbs a:visited {
    color: black;
    text-decoration: none;
}
.site-logo {
    fill: var(--main-font-color);
    width: 200px;
    height: auto;
    transition: transform 0.1s ease;
}
.site-logo:active {
    transform: scale(1.03); /* Slight zoom on click */
}
.site-logo:active {
    scale: (1.1);
}
.logo-fill {
    fill: transparent;
    transition: fill 0.3s ease;
}
.section-fill {
    transition: fill 0.3s ease;
}
.site-logo.hover-color-1:hover .logo-fill,
.site-logo.hover-color-1:hover .section-fill { fill: #cc00ff; }
.site-logo.hover-color-2:hover .logo-fill,
.site-logo.hover-color-2:hover .section-fill { fill: #00ffcc; }
.site-logo.hover-color-2:hover .logo-contour { fill: #ff0077; }
.site-logo.hover-color-3:hover .logo-fill,
.site-logo.hover-color-3:hover .section-fill { fill: #ffcc00; }
.site-logo.hover-color-3:hover .logo-contour { fill: #9900ff; }
.site-logo.hover-color-4:hover .logo-fill,
.site-logo.hover-color-4:hover .section-fill { fill: #ff00cc; }
.site-logo.hover-color-5:hover .logo-fill,
.site-logo.hover-color-5:hover .section-fill { fill: #00ff00; }
.site-logo.hover-color-5:hover .logo-contour { fill: #ff00ff; }
.site-logo.hover-color-6:hover .logo-fill,
.site-logo.hover-color-6:hover .section-fill { fill: #00bfff; }
.site-logo.hover-color-7:hover .logo-fill,
.site-logo.hover-color-7:hover .section-fill { fill: #ff0066; }
.site-logo.hover-color-7:hover .logo-contour { fill: #ffff00; }
.site-logo.hover-color-8:hover .logo-fill,
.site-logo.hover-color-8:hover .section-fill { fill: #ff3300; }
.site-logo.hover-color-8:hover .logo-contour { fill: #00ccff; }
.site-logo.hover-color-9:hover .logo-fill,
.site-logo.hover-color-9:hover .section-fill { fill: #66ff00; }
.site-logo.hover-color-9:hover .logo-contour { fill: #00b3ff; }
.site-logo.hover-color-10:hover .logo-fill,
.site-logo.hover-color-10:hover .section-fill { fill: #00ffff; }
.site-logo.hover-color-10:hover .logo-contour { fill: #ff3399; }
hr {
    border: none; 
    height: 1px;
    background: rgba(0, 0, 0, 0.1); 
    margin: 20px 0;
    border-radius: 1px; 
}
a.goback:link,
a.goback:hover, 
a.goback:active,
a.goback:visited,
a.goback:focus {
    text-decoration: none;
}
sup a {
    text-decoration: none !important;
}
.table-of-contents li a {
    text-decoration-style: dotted;
} 
.h1-yashchique a:link, 
.h1-yashchique a:hover, 
.h1-yashchique a:active, 
.h1-yashchique a:visited, 
.h1-sidenotes a:link, 
.h1-sidenotes a:hover, 
.h1-sidenotes a:active, 
.h1-sidenotes a:visited {
    text-decoration: none;
    color: inherit;
}
.h1-yashchique a,
.h1-sidenotes a {
    display: inline-block; 
    position: relative; 
    color: inherit;
    transition: transform 0.3s ease, text-shadow 0.3s ease;
}
.h1-yashchique a:hover, 
.h1-sidenotes a:hover {
    transform: scale(1.05); 
    text-shadow: 
        0 2px 5px rgba(0, 0, 0, 0.2),  /* Subtle main shadow */
        0 4px 10px rgba(0, 0, 0, 0.15), /* Secondary shadow layer */
        0 8px 12px rgba(0, 0, 0, 0.1); /* Fading trail */
}
.h1-yashchique a:active,
.h1-sidenotes a:active {
    transform: scale(1.15); 
    text-shadow: 
        0 2px 5px rgba(32, 25, 25, 0.3), /* More condensed shadow */
        0 4px 8px rgba(0, 0, 0, 0.2); /* Softer secondary shadow */
}
a.bsk-link {
    display: inline-flex;
    align-items: baseline;
    gap: 3px; /* Space between icon and text */
}  
a.bsk-link::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 3px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 32 32'%3E%3Cpath d='M23.931,5.298c-3.21,2.418-6.663,7.32-7.931,9.951-1.267-2.631-4.721-7.533-7.931-9.951-2.316-1.744-6.069-3.094-6.069,1.201,0,.857,.49,7.206,.778,8.237,.999,3.583,4.641,4.497,7.881,3.944-5.663,.967-7.103,4.169-3.992,7.372,5.908,6.083,8.492-1.526,9.154-3.476,.123-.36,.179-.527,.179-.379,0-.148,.057,.019,.179,.379,.662,1.949,3.245,9.558,9.154,3.476,3.111-3.203,1.671-6.405-3.992-7.372,3.24,.553,6.882-.361,7.881-3.944,.288-1.031,.778-7.38,.778-8.237,0-4.295-3.753-2.945-6.069-1.201Z' fill='%23cccccc'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}  
a.bsk-link:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 32 32'%3E%3Cpath d='M23.931,5.298c-3.21,2.418-6.663,7.32-7.931,9.951-1.267-2.631-4.721-7.533-7.931-9.951-2.316-1.744-6.069-3.094-6.069,1.201,0,.857,.49,7.206,.778,8.237,.999,3.583,4.641,4.497,7.881,3.944-5.663,.967-7.103,4.169-3.992,7.372,5.908,6.083,8.492-1.526,9.154-3.476,.123-.36,.179-.527,.179-.379,0-.148,.057,.019,.179,.379,.662,1.949,3.245,9.558,9.154,3.476,3.111-3.203,1.671-6.405-3.992-7.372,3.24,.553,6.882-.361,7.881-3.944,.288-1.031,.778-7.38,.778-8.237,0-4.295-3.753-2.945-6.069-1.201Z' fill='%231185FE'/%3E%3C/svg%3E");
}
a.mstdn-link {
    display: inline-flex;
    align-items: baseline;
    gap: 3px; /* Space between icon and text */
}  
a.mstdn-link::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 3px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 32 32'%3E%3Cpath d='M30.116,7.642c-.438-3.223-3.278-5.764-6.645-6.256-.568-.083-2.72-.386-7.705-.386h-.037c-4.987,0-6.056,.303-6.624,.386-3.273,.479-6.262,2.761-6.987,6.023-.349,1.606-.386,3.387-.321,5.02,.092,2.343,.11,4.681,.325,7.014,.149,1.55,.408,3.087,.776,4.601,.689,2.795,3.48,5.121,6.214,6.07,2.927,.99,6.075,1.154,9.091,.474,.332-.076,.66-.165,.984-.266,.732-.23,1.591-.488,2.222-.941,.009-.006,.016-.015,.021-.024,.005-.009,.008-.02,.008-.031v-2.261c0-.01-.003-.02-.007-.029-.004-.009-.011-.017-.019-.023-.008-.006-.017-.01-.027-.013-.01-.002-.02-.002-.03,0-1.932,.457-3.913,.685-5.899,.682-3.419,0-4.339-1.605-4.602-2.273-.212-.577-.346-1.18-.4-1.792,0-.01,.001-.021,.006-.03,.004-.009,.011-.018,.019-.024,.008-.006,.018-.011,.028-.013,.01-.002,.021-.002,.031,0,1.9,.453,3.848,.682,5.803,.682,.47,0,.939,0,1.409-.012,1.966-.055,4.038-.154,5.972-.528,.048-.01,.097-.018,.138-.03,3.051-.579,5.954-2.398,6.249-7.004,.011-.181,.039-1.899,.039-2.088,.001-.64,.208-4.536-.03-6.931Zm-4.696,11.493h-3.208v-7.772c0-1.636-.689-2.471-2.091-2.471-1.541,0-2.313,.987-2.313,2.937v4.254h-3.189v-4.254c0-1.95-.773-2.937-2.315-2.937-1.394,0-2.09,.834-2.091,2.471v7.772h-3.205V11.127c0-1.636,.422-2.936,1.267-3.9,.871-.961,2.014-1.455,3.433-1.455,1.642,0,2.883,.624,3.71,1.872l.798,1.325,.8-1.325c.827-1.248,2.068-1.872,3.707-1.872,1.417,0,2.56,.494,3.434,1.455,.845,.963,1.267,2.263,1.267,3.9l-.003,8.008Z' fill='%23cccccc'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}  
a.mstdn-link:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 32 32'%3E%3Cpath d='M30.116,7.642c-.438-3.223-3.278-5.764-6.645-6.256-.568-.083-2.72-.386-7.705-.386h-.037c-4.987,0-6.056,.303-6.624,.386-3.273,.479-6.262,2.761-6.987,6.023-.349,1.606-.386,3.387-.321,5.02,.092,2.343,.11,4.681,.325,7.014,.149,1.55,.408,3.087,.776,4.601,.689,2.795,3.48,5.121,6.214,6.07,2.927,.99,6.075,1.154,9.091,.474,.332-.076,.66-.165,.984-.266,.732-.23,1.591-.488,2.222-.941,.009-.006,.016-.015,.021-.024,.005-.009,.008-.02,.008-.031v-2.261c0-.01-.003-.02-.007-.029-.004-.009-.011-.017-.019-.023-.008-.006-.017-.01-.027-.013-.01-.002-.02-.002-.03,0-1.932,.457-3.913,.685-5.899,.682-3.419,0-4.339-1.605-4.602-2.273-.212-.577-.346-1.18-.4-1.792,0-.01,.001-.021,.006-.03,.004-.009,.011-.018,.019-.024,.008-.006,.018-.011,.028-.013,.01-.002,.021-.002,.031,0,1.9,.453,3.848,.682,5.803,.682,.47,0,.939,0,1.409-.012,1.966-.055,4.038-.154,5.972-.528,.048-.01,.097-.018,.138-.03,3.051-.579,5.954-2.398,6.249-7.004,.011-.181,.039-1.899,.039-2.088,.001-.64,.208-4.536-.03-6.931Zm-4.696,11.493h-3.208v-7.772c0-1.636-.689-2.471-2.091-2.471-1.541,0-2.313,.987-2.313,2.937v4.254h-3.189v-4.254c0-1.95-.773-2.937-2.315-2.937-1.394,0-2.09,.834-2.091,2.471v7.772h-3.205V11.127c0-1.636,.422-2.936,1.267-3.9,.871-.961,2.014-1.455,3.433-1.455,1.642,0,2.883,.624,3.71,1.872l.798,1.325,.8-1.325c.827-1.248,2.068-1.872,3.707-1.872,1.417,0,2.56,.494,3.434,1.455,.845,.963,1.267,2.263,1.267,3.9l-.003,8.008Z' fill='%236361F2'/%3E%3C/svg%3E");
}
a.tlgrm-link {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
}  
a.tlgrm-link::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 4px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 32 32'%3E%3Cpath d='M16,2c-7.732,0-14,6.268-14,14s6.268,14,14,14,14-6.268,14-14S23.732,2,16,2Zm6.489,9.521c-.211,2.214-1.122,7.586-1.586,10.065-.196,1.049-.583,1.401-.957,1.435-.813,.075-1.43-.537-2.218-1.053-1.232-.808-1.928-1.311-3.124-2.099-1.382-.911-.486-1.412,.302-2.23,.206-.214,3.788-3.472,3.858-3.768,.009-.037,.017-.175-.065-.248-.082-.073-.203-.048-.29-.028-.124,.028-2.092,1.329-5.905,3.903-.559,.384-1.065,.571-1.518,.561-.5-.011-1.461-.283-2.176-.515-.877-.285-1.574-.436-1.513-.92,.032-.252,.379-.51,1.042-.773,4.081-1.778,6.803-2.95,8.164-3.517,3.888-1.617,4.696-1.898,5.222-1.907,.116-.002,.375,.027,.543,.163,.142,.115,.181,.27,.199,.379,.019,.109,.042,.357,.023,.551Z' fill-rule='evenodd'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}
a.tlgrm-link:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2352a4e2' viewBox='0 0 32 32'%3E%3Cpath d='M16,2c-7.732,0-14,6.268-14,14s6.268,14,14,14,14-6.268,14-14S23.732,2,16,2Zm6.489,9.521c-.211,2.214-1.122,7.586-1.586,10.065-.196,1.049-.583,1.401-.957,1.435-.813,.075-1.43-.537-2.218-1.053-1.232-.808-1.928-1.311-3.124-2.099-1.382-.911-.486-1.412,.302-2.23,.206-.214,3.788-3.472,3.858-3.768,.009-.037,.017-.175-.065-.248-.082-.073-.203-.048-.29-.028-.124,.028-2.092,1.329-5.905,3.903-.559,.384-1.065,.571-1.518,.561-.5-.011-1.461-.283-2.176-.515-.877-.285-1.574-.436-1.513-.92,.032-.252,.379-.51,1.042-.773,4.081-1.778,6.803-2.95,8.164-3.517,3.888-1.617,4.696-1.898,5.222-1.907,.116-.002,.375,.027,.543,.163,.142,.115,.181,.27,.199,.379,.019,.109,.042,.357,.023,.551Z' fill-rule='evenodd'/%3E%3C/svg%3E");
}
a.rss-link-post {
    display: inline-flex;
    align-items: baseline;
    gap: 3px; 
}  
a.rss-link-post::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 3px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 32 32'%3E%3Ccircle cx='6.566' cy='25.434' r='3.566'/%3E%3Cpath d='M20.234,29h-5.051c0-6.728-5.454-12.183-12.183-12.183h0v-5.051c9.518,0,17.234,7.716,17.234,17.234Z'/%3E%3Cpath d='M23.8,29c0-11.488-9.312-20.8-20.8-20.8V3c14.359,0,26,11.641,26,26h-5.2Z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}  
a.rss-link-post:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FF6600' viewBox='0 0 32 32'%3E%3Ccircle cx='6.566' cy='25.434' r='3.566'/%3E%3Cpath d='M20.234,29h-5.051c0-6.728-5.454-12.183-12.183-12.183h0v-5.051c9.518,0,17.234,7.716,17.234,17.234Z'/%3E%3Cpath d='M23.8,29c0-11.488-9.312-20.8-20.8-20.8V3c14.359,0,26,11.641,26,26h-5.2Z'/%3E%3C/svg%3E");
}
a.email-link {
    display: inline-flex;
    align-items: baseline;
    gap: 4px; 
}  
a.email-link::before {
    content: "";
    display: inline-block;
    position: relative;
    top: 4px;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23cccccc' viewBox='0 0 512 512'%3E%3Cpath d='M256 352c-16.53 0-33.06-5.422-47.16-16.41L0 173.2V400C0 426.5 21.49 448 48 448h416c26.51 0 48-21.49 48-48V173.2l-208.8 162.5C289.1 346.6 272.5 352 256 352zM16.29 145.3l212.2 165.1c16.19 12.6 38.87 12.6 55.06 0l212.2-165.1C505.1 137.3 512 125 512 112C512 85.49 490.5 64 464 64h-416C21.49 64 0 85.49 0 112C0 125 6.01 137.3 16.29 145.3z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}  
a.email-link:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%232ECC71' viewBox='0 0 512 512'%3E%3Cpath d='M256 352c-16.53 0-33.06-5.422-47.16-16.41L0 173.2V400C0 426.5 21.49 448 48 448h416c26.51 0 48-21.49 48-48V173.2l-208.8 162.5C289.1 346.6 272.5 352 256 352zM16.29 145.3l212.2 165.1c16.19 12.6 38.87 12.6 55.06 0l212.2-165.1C505.1 137.3 512 125 512 112C512 85.49 490.5 64 464 64h-416C21.49 64 0 85.49 0 112C0 125 6.01 137.3 16.29 145.3z'/%3E%3C/svg%3E");
}
a.link-2-page span {
    font-weight: bold;
    color: var(--link-color);
    text-decoration: underline; 
    text-decoration-thickness: 1.5px; 
    text-underline-offset: 2px;
    text-decoration-color: var(--link-underline-color);
    transition: color 0.3s ease, text-decoration-color 0.3s ease;
}
a.link-2-page {
    text-decoration: none;
}
.link-2-page::before {
    content: "👉🏻";
    margin-right: 0.5em;
    transition: content 0.3s ease;
    text-shadow: none;
}  
.link-2-page:hover::before {
    content: "🔗";
    text-shadow: none;
}
.link-2-page:hover span, 
.link-2-page:focus span { 
    color: var(--link-hover-color); 
    text-decoration-color: var(--link-underline-hover-color);
}
.link-2-page:active span { 
    color: var(--link-active-color); 
    text-decoration: none;
}