@font-face {
    font-family: "departure";
    src:
        url("/fonts/DepartureMono-Regular.otf") format("opentype"),
        url("/fonts/DepartureMono-Regular.woff2") format("woff2"),
        url("/fonts/DepartureMono-Regular.woff") format("woff");
}
@font-face {
    font-family: "levelup";
    font-style: normal;
    font-weight: normal;
    src:
        local("levelup"),
        local("levelup-Regular"),
        url("/fonts/LevelUp.woff2") format("woff2");
}
body {
    accent-color: #debe14;
    font-family: departure;
    font-size: clamp(14px, 3vh, 32px);
    background-color: #1c4263;
    margin: 0;
    padding: 0;
}
canvas {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    transition: 0.2s filter ease-in-out;
}
h1 {
    font-family: levelup;
    color: #7af1ab;
    font-size: 10vh;
    text-shadow:
        1vh 1vh #000,
        -1vh -1vh #000,
        1vh -1vh #000,
        -1vh 1vh #000;
    padding-left: 1vh;
    margin: 0;
    display: none;
}
h2 {
    font-family: levelup;
    margin: 1em 0 0.5em 0;
}
p {
    margin: 0;
}
a:link,
a:visited {
    color: yellow;
    text-decoration: none;
}
a:hover {
    color: red;
    text-decoration: underline;
}
span,
div,
p,
li {
    font-family: departure;
    color: white;
    text-shadow: 2px 2px 6px black;
}
.content {
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    max-width: clamp(320px, 90%, 728px);
    overflow: hidden;
    container-name: content;
}
.destination {
    font-size: 75%;
    text-transform: uppercase;
}
.destination .link {
    font-size: 66%;
    text-transform: uppercase;
    padding-left: 1em;
}
.marvin {
    margin: 0 auto;
    max-width: clamp(517px, 90%, 1177px);
}
.recent {
    font-size: 75%;
    padding: 1em 0 0 0;
}
#recent {
    font-style: italic;
}
li {
    line-height: 1.5;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
li:before {
    content: "▷";
    margin-right: 14px;
}
li img {
    height: clamp(14px, 3vh, 32px);
    vertical-align: middle;
}
ul {
    list-style-type: none;
    margin: 0;
    padding: 0 0 1em 2em;
}
hr {
    width: 100%;
    border-top: 2px dashed #ddd;
    border-right: 0;
    border-left: 0;
    border-bottom: 0;
}
.link.active {
    background-color: red;
}
.logo {
    position: fixed;
    bottom: 0px;
    right: 4px;
    z-index: 1000;
    margin: 0;
    padding: 0;
    color: rgba(255,255,255,.15);
}
.logo img {
    opacity: 0.15;
    width: 127px;
}
footer {
    text-align: center;
    font-size: 0.55em;
    margin: 4em 0;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 1em;
}
#welcome {
    font-size: clamp(14px, 0.75em, 1.25em);
    line-height: 1.5;
    margin: 25px 64px 35px 36px;
    z-index: 1000;
    position: relative;
    text-shadow: 0px 0px 8px black;
}
#welcomeBorder {
    position: relative;
    max-width: 90%;
    margin: 0 auto;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    border-image-slice: 28 28 38 38 fill;
    border-image-width: 28px 28px 38px 38px;
    border-image-outset: 0px 0px 0px 0px;
    border-image-repeat: stretch stretch;
    border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIcAAABsCAYAAABAZKFLAAAA0GVYSWZJSSoACAAAAAoAAAEEAAEAAACHAAAAAQEEAAEAAABsAAAAAgEDAAMAAACGAAAAEgEDAAEAAAABAAAAGgEFAAEAAACMAAAAGwEFAAEAAACUAAAAKAEDAAEAAAADAAAAMQECAA0AAACcAAAAMgECABQAAACqAAAAaYcEAAEAAAC+AAAAAAAAAAgACAAIADcCAAAUAAAANwIAABQAAABHSU1QIDIuMTAuMzgAADIwMjQ6MTE6MDcgMTA6MjI6NDMAAQABoAMAAQAAAAEAAAAAAAAA09fqZQAAAYRpQ0NQSUNDIHByb2ZpbGUAAHicfZE9SMNAHMVfW7WiFUELijhkqJ3soiKOtQpFqBBqhVYdTC79EJo0JCkujoJrwcGPxaqDi7OuDq6CIPgB4uzgpOgiJf4vKbSI8eC4H+/uPe7eAf56malmRxxQNctIJxNCNrciBF/Riy4MYQBRiZn6rCim4Dm+7uHj612MZ3mf+3P0KXmTAT6BOM50wyJeJ57etHTO+8RhVpIU4nPicYMuSPzIddnlN85Fh/08M2xk0nPEYWKh2MZyG7OSoRJPEUcUVaN8f9ZlhfMWZ7VcZc178heG8tryEtdpjiKJBSxChAAZVWygDAsxWjVSTKRpP+HhH3H8Irlkcm2AkWMeFaiQHD/4H/zu1ixMTrhJoQTQ+WLbH2NAcBdo1Gz7+9i2GydA4Bm40lr+Sh2Y+SS91tIiR0D/NnBx3dLkPeByBxh+0iVDcqQATX+hALyf0TflgMFboGfV7a25j9MHIENdpW6Ag0MgWqTsNY93d7f39u+ZZn8/jYdysfi6GGYAAA5baVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/Pgo8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJYTVAgQ29yZSA0LjQuMC1FeGl2MiI+CiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogIDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiCiAgICB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIKICAgIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiCiAgICB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iCiAgICB4bWxuczpHSU1QPSJodHRwOi8vd3d3LmdpbXAub3JnL3htcC8iCiAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyIKICAgIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIKICAgeG1wTU06RG9jdW1lbnRJRD0iZ2ltcDpkb2NpZDpnaW1wOjk1YzM1ZDRmLWYwNjItNGYyYy1hMDRkLTA5N2U4MmFlNDVmMyIKICAgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxMGMzNzIwMS0xZTY2LTQ5ZTEtODUxNy01NWQ3ZWQ5OGZhY2MiCiAgIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1MTk5N2FiNi0xNmYyLTRiMGUtYmNjMi00OWE4YTg5YTgwOTQiCiAgIGRjOkZvcm1hdD0iaW1hZ2UvcG5nIgogICBHSU1QOkFQST0iMi4wIgogICBHSU1QOlBsYXRmb3JtPSJMaW51eCIKICAgR0lNUDpUaW1lU3RhbXA9IjE3MzA5MzUzNjM2MjA1NDEiCiAgIEdJTVA6VmVyc2lvbj0iMi4xMC4zOCIKICAgdGlmZjpPcmllbnRhdGlvbj0iMSIKICAgeG1wOkNyZWF0b3JUb29sPSJHSU1QIDIuMTAiCiAgIHhtcDpNZXRhZGF0YURhdGU9IjIwMjQ6MTE6MDdUMTA6MjI6NDMrMTE6MDAiCiAgIHhtcDpNb2RpZnlEYXRlPSIyMDI0OjExOjA3VDEwOjIyOjQzKzExOjAwIj4KICAgPHhtcE1NOkhpc3Rvcnk+CiAgICA8cmRmOlNlcT4KICAgICA8cmRmOmxpCiAgICAgIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiCiAgICAgIHN0RXZ0OmNoYW5nZWQ9Ii8iCiAgICAgIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YmY5YzU4MzAtMjFjOC00NWNmLWI3MjctZWFhOGZkYzk5ZDNkIgogICAgICBzdEV2dDpzb2Z0d2FyZUFnZW50PSJHaW1wIDIuMTAgKExpbnV4KSIKICAgICAgc3RFdnQ6d2hlbj0iMjAyNC0xMS0wNlQyMDowNzowNysxMTowMCIvPgogICAgIDxyZGY6bGkKICAgICAgc3RFdnQ6YWN0aW9uPSJzYXZlZCIKICAgICAgc3RFdnQ6Y2hhbmdlZD0iLyIKICAgICAgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpjYjVkNmE1MS1hYmZmLTQ2YWQtYjMxOS0wZDA2ZjIzNzE1NjUiCiAgICAgIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkdpbXAgMi4xMCAoTGludXgpIgogICAgICBzdEV2dDp3aGVuPSIyMDI0LTExLTA3VDEwOjIyOjQzKzExOjAwIi8+CiAgICA8L3JkZjpTZXE+CiAgIDwveG1wTU06SGlzdG9yeT4KICA8L3JkZjpEZXNjcmlwdGlvbj4KIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAKPD94cGFja2V0IGVuZD0idyI/PuVuXKoAAAAGYktHRAAAAAAAAPlDu38AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfoCwYXFivNNaTgAAABKUlEQVR42u3dwQ3DIAxAUbvKRlkj42aMdiZ3BGhFOMB754gDfBkJVWrGXBXMkCMWedlHxIE4EAfiQByIA3GwiGPgWs0Hrqq6bfnzMrPnsbH5UGZyIA7EgTgQB+JAHIiDVfT+YsgD12oHn3mZHLhWEAfiQByIA3EgDnZxRMRpGzA5EAfiQByIA3EgDsSBOBAHiANxIA7EgTgQB+JAHIgDcYA4EAfiQByIA3EgDsSBOBAH4gBxIA7EgTgQB+JAHIgDcSAOEAfiQByIA3EgDsSBOBAH4gBxIA7+lDHu3yHfrQ+q6rblEw418+o8e5MD1wriQByIA3EgDsTBFrLzu2kPZUw9V5MDcSAOxIE4EAfiQBxsIQeuddrOKT4mB64VxIE4EAfiQBwgDn7zBaJ2E71+ytr9AAAAAElFTkSuQmCC");
    border-style: solid;
}
#avatar {
    position: absolute;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    bottom: 15px;
    right: 25px;
    width: clamp(48px, 10vh, 64px);
    height: auto;
}
#track,
#album,
#game {
    background: black;
    padding: 5px;
}
#srw_logo {
    color: #e09649;
    transition: color 5s;
}
#srw_logo:hover {
    color: #93a381;
}
box-icon {
    vertical-align: middle;
}
@media (prefers-reduced-motion) {
    *,
    *::before,
    *::after {
        animation-duration: 0s !important;
        /* additional recommendation */
        transition: none !important;
        scroll-behavior: auto !important;
    }
}
@media screen and (orientation: portrait) {
    h1 {
        font-size: 8vh;
    }
    .logo img {
        opacity: 0.15;
        width: 127px;
    }
}
/* vim: set ts=4 sw=4 et: */