/*! system.css v0.1.11 - https://github.com/sakofchit/system.css */
@font-face {
    font-family: Chicago;
    src: url(ChicagoFLF.woff) format("woff");
    src: url(ChicagoFLF.woff2) format("woff2")
}
@font-face {
    font-family: Monaco;
    src: url(monaco.woff) format("woff");
    src: url(monaco.woff2) format("woff2")
}
@font-face {
    font-family: Chicago_12;
    src: url(ChiKareGo2.woff) format("woff");
    src: url(ChiKareGo2.woff2) format("woff2")
}
@font-face {
    font-family: Geneva_9;
    src: url(FindersKeepers.woff) format("woff");
    src: url(FindersKeepers.woff2) format("woff2")
}
::-webkit-scrollbar {
    background-color: #fff;
    width: 22px
}
::-webkit-scrollbar-track {
    background: linear-gradient(45deg,#000 25%,transparent 0,transparent 75%,#000 0,#000),linear-gradient(45deg,#000 25%,transparent 0,transparent 75%,#000 0,#000);
    background-color: #fff;
    background-position: 0 0,2px 2px;
    background-size: 4px 4px;
    border-left: 3px solid #000;
    width: 10px
}
::-webkit-scrollbar-thumb {
    background-color: #fff;
    border: 2px solid #000;
    border-right: none;
    box-sizing: content-box;
    width: 20px
}
::-webkit-scrollbar-button:horizontal:end:increment,::-webkit-scrollbar-button:horizontal:start:decrement,::-webkit-scrollbar-button:vertical:end:increment,::-webkit-scrollbar-button:vertical:start:decrement {
    display: block
}
::-webkit-scrollbar-button:vertical:start {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.5.5h21v22.375H.5z'/%3E%3Cpath fill='%23000' d='M1 23h20v-2H1zM1.375 12.375h5.5V11h-5.5zM6.875 17.875h6.875V16.5H6.875zM6.875 17.875v-5.5H5.5v5.5zM9.625 5.5V4.125H8.25V5.5zM11 4.125V2.75H9.625v1.375zM19.25 12.375V11h-1.375v1.375zM17.875 11V9.625H16.5V11zM16.5 9.625V8.25h-1.375v1.375zM15.125 8.25V6.875H13.75V8.25zM13.75 6.875V5.5h-1.375v1.375zM12.375 5.5V4.125H11V5.5zM8.25 6.875V5.5H6.875v1.375zM6.875 8.25V6.875H5.5V8.25zM5.5 9.625V8.25H4.125v1.375zM4.125 11V9.625H2.75V11z'/%3E%3Cpath fill='%23000' d='M2.75 12.375V11H1.375v1.375zM15.125 17.875v-5.5H13.75v5.5zM13.75 12.375h5.5V11h-5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
::-webkit-scrollbar-button:vertical:start:active {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.5.5h21v22.38H.5z'/%3E%3Cpath fill='%23000' d='M1 23.005h20v-2H1zM1.375 12.378h5.5v-1.375h-5.5zM6.875 17.879h6.875V6.877H6.875zM6.875 17.879v-5.501H5.5v5.5zM9.625 5.501V4.126H8.25v1.375zM11 4.126V2.75H9.625v1.375zM19.25 12.378v-1.375h-1.375v1.375zM17.875 11.002V9.627H13.75v1.375zM16.5 9.627V8.252h-2.75v1.375zM15.125 8.252V6.877H13.75v1.375zM13.75 6.876V5.501h-1.375v1.375zM12.375 5.501V4.126h-2.75v1.375zM12.375 6.876V5.501h-5.5v1.375zM6.875 8.252V6.877H5.5v1.375zM6.875 9.627V8.252h-2.75v1.375zM6.875 11.002V9.627H2.75v1.375z'/%3E%3Cpath fill='%23000' d='M2.75 12.378v-1.375H1.375v1.375zM15.125 17.879v-5.501H13.75v5.5zM13.75 12.378h5.5v-1.375h-5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
::-webkit-scrollbar-button:vertical:end {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.5 22.875h21V.5H.5z'/%3E%3Cpath fill='%23000' d='M1 .375h20v2H1zM1.375 11h5.5v1.375h-5.5zM6.875 5.5h6.875v1.375H6.875zM6.875 5.5V11H5.5V5.5zM9.625 17.875v1.375H8.25v-1.375zM11 19.25v1.375H9.625V19.25zM19.25 11v1.375h-1.375V11zM17.875 12.375v1.375H16.5v-1.375zM16.5 13.75v1.375h-1.375V13.75zM15.125 15.125V16.5H13.75v-1.375zM13.75 16.5v1.375h-1.375V16.5zM12.375 17.875v1.375H11v-1.375zM8.25 16.5v1.375H6.875V16.5zM6.875 15.125V16.5H5.5v-1.375zM5.5 13.75v1.375H4.125V13.75zM4.125 12.375v1.375H2.75v-1.375z'/%3E%3Cpath fill='%23000' d='M2.75 11v1.375H1.375V11zM15.125 5.5V11H13.75V5.5zM13.75 11h5.5v1.375h-5.5z'/%3E%3C/svg%3E");
    height: 23.38px
}
::-webkit-scrollbar-button:vertical:end:active {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.5 22.88h21V.5H.5z'/%3E%3Cpath fill='%23000' d='M1 .375h20v2H1zM1.375 11.002h5.5v1.375h-5.5zM6.875 5.501h6.875v11.002H6.875zM6.875 5.501v5.501H5.5v-5.5zM9.625 17.879v1.375H8.25v-1.375zM11 19.254v1.375H9.625v-1.375zM19.25 11.002v1.375h-1.375v-1.375zM17.875 12.378v1.375H13.75v-1.375zM16.5 13.753v1.375h-2.75v-1.375zM15.125 15.128v1.375H13.75v-1.375zM13.75 16.503v1.375h-1.375v-1.375zM12.375 17.879v1.375h-2.75v-1.375zM12.375 16.503v1.375h-5.5v-1.375zM6.875 15.128v1.375H5.5v-1.375zM6.875 13.753v1.375h-2.75v-1.375zM6.875 12.378v1.375H2.75v-1.375z'/%3E%3Cpath fill='%23000' d='M2.75 11.002v1.375H1.375v-1.375zM15.125 5.501v5.501H13.75v-5.5zM13.75 11.002h5.5v1.375h-5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
::-webkit-scrollbar-button:horizontal:start {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.813 22.187v-21h22.375v21z'/%3E%3Cpath fill='%23000' d='M23.313 21.688v-20h-2v20zM12.688 21.313v-5.5h-1.376v5.5zM18.188 15.813V8.936h-1.375v6.876z'/%3E%3Cpath fill='%23000' d='M18.188 15.813h-5.5v1.374h5.5zM5.813 13.063H4.438v1.374h1.375zM4.438 11.688H3.063v1.374h1.374zM12.688 3.438h-1.376v1.374h1.376zM11.313 4.813H9.937v1.375h1.376zM9.938 6.188H8.562v1.375h1.376zM8.563 7.563H7.187v1.375h1.375zM7.188 8.938H5.813v1.374h1.375zM5.813 10.313H4.438v1.374h1.375zM7.188 14.438H5.813v1.374h1.375zM8.563 15.813H7.187v1.374h1.375zM9.938 17.188H8.562v1.375h1.376zM11.313 18.563H9.937v1.375h1.376zM12.688 19.938h-1.376v1.375h1.376zM18.188 7.563h-5.5v1.375h5.5z'/%3E%3Cpath fill='%23000' d='M12.688 8.938v-5.5h-1.376v5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
::-webkit-scrollbar-button:horizontal:start:active {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M.81 22.19v-21h22.38v21z'/%3E%3Cpath fill='%23000' d='M23.315 21.69v-20h-2v20zM12.688 21.315v-5.5h-1.375v5.5zM18.189 15.815V8.94H7.187v6.875z'/%3E%3Cpath fill='%23000' d='M18.189 15.815h-5.501v1.375h5.5zM5.811 13.065H4.436v1.375h1.375zM4.436 11.69H3.06v1.375h1.375zM12.688 3.44h-1.375v1.375h1.375zM11.312 4.815H9.937V8.94h1.375zM9.937 6.19H8.562v2.75h1.375z'/%3E%3Cpath fill='%23000' d='M8.562 7.565H7.187V8.94h1.375zM7.186 8.94H5.811v1.375h1.375zM5.811 10.315H4.436v2.75h1.375zM7.186 10.315H5.811v5.5h1.375zM8.562 15.815H7.187v1.375h1.375z'/%3E%3Cpath fill='%23000' d='M9.937 15.815H8.562v2.75h1.375zM11.312 15.815H9.937v4.125h1.375zM12.688 19.94h-1.375v1.375h1.375zM18.189 7.565h-5.501V8.94h5.5z'/%3E%3Cpath fill='%23000' d='M12.688 8.94v-5.5h-1.375v5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
::-webkit-scrollbar-button:horizontal:end {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M23.188 22.188v-21H.813v21z'/%3E%3Cpath fill='%23000' d='M.688 21.687v-20h2v20zM11.313 21.312v-5.5h1.375v5.5zM5.813 15.812V8.937h1.375v6.875zM5.813 15.813h5.5v1.375h-5.5zM18.188 13.063h1.375v1.375h-1.375zM19.563 11.688h1.375v1.375h-1.375zM11.313 3.438h1.375v1.375h-1.375zM12.688 4.813h1.375v1.375h-1.375zM14.063 6.188h1.375v1.375h-1.375zM15.438 7.563h1.375v1.375h-1.375zM16.813 8.938h1.375v1.375h-1.375zM18.188 10.313h1.375v1.375h-1.375zM16.813 14.438h1.375v1.375h-1.375zM15.438 15.813h1.375v1.375h-1.375zM14.063 17.188h1.375v1.375h-1.375zM12.688 18.563h1.375v1.375h-1.375z'/%3E%3Cpath fill='%23000' d='M11.313 19.938h1.375v1.375h-1.375zM5.813 7.563h5.5v1.375h-5.5zM11.313 8.937v-5.5h1.375v5.5z'/%3E%3C/svg%3E");
    height: 23.38px
}
::-webkit-scrollbar-button:horizontal:end:active {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' stroke='%23000' d='M23.19 22.19v-21H.81v21z'/%3E%3Cpath fill='%23000' d='M.685 21.69v-20h2v20zM11.312 21.315v-5.5h1.375v5.5zM5.811 15.815V8.94h11.002v6.875z'/%3E%3Cpath fill='%23000' d='M5.811 15.815h5.501v1.375H5.811zM18.189 13.065h1.375v1.375h-1.375zM19.564 11.69h1.375v1.375h-1.375zM11.312 3.44h1.375v1.375h-1.375zM12.688 4.815h1.375V8.94h-1.375zM14.063 6.19h1.375v2.75h-1.375zM15.438 7.565h1.375V8.94h-1.375zM16.814 8.94h1.375v1.375h-1.375zM18.189 10.315h1.375v2.75h-1.375zM16.814 10.315h1.375v5.5h-1.375zM15.438 15.815h1.375v1.375h-1.375zM14.063 15.815h1.375v2.75h-1.375zM12.688 15.815h1.375v4.125h-1.375zM11.312 19.94h1.375v1.375h-1.375zM5.811 7.565h5.501V8.94H5.811z'/%3E%3Cpath fill='%23000' d='M11.312 8.94v-5.5h1.375v5.5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    height: 23.38px
}
body {
    background: linear-gradient(90deg,#fff 21px,transparent 1%) 50%,linear-gradient(#fff 21px,transparent 1%) 50%,#000;
    background-attachment: fixed;
    background-size: 22px 22px;
    display: flex;
    height: 100vh;
}
a {
    color: #000;
    text-decoration: underline
}
hr {
    border-top: .15em solid #000
}
.heading,h1 {
    font-size: 1em
}
.heading,h1,h2 {
    font-family: Chicago
}
h2 {
    font-size: 2em
}
.standard-button {
    display: block;
    min-height: 20px;
    min-width: 59px
}
.standard-dialog {
    background-color: #fff;
    border: 2px solid;
    box-shadow: 2px 2px;
    padding: 10px
}
.alert-box,.modal-dialog {
    background: #fff;
    padding: 13px;
    width: auto
}
.alert-contents,.modal-contents {
    padding: 10px
}
.modeless-dialog {
    font-size: 18px;
    height: 100%;
    letter-spacing: -.025em;
    padding: 1.5rem .5rem .5rem
}
.inner-border {
    border-color: currentcolor;
    border-style: solid;
    border-width: 3.5px 5px
}
.outer-border {
    border: 2px solid;
    padding: 3px
}
.title-bar {
    align-items: center;
    background: linear-gradient(#000 50%,transparent 0);
    background-clip: content-box;
    background-size: 6.6666666667% 13.3333333333%;
    display: flex;
    flex: none;
    height: 1.5rem;
    margin: .1rem 0;
    padding: .2rem .1rem
}
.title-bar .title {
    background: #fff;
    cursor: default;
    font-family: Chicago_12;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    margin: 0 auto;
    padding: 0 .5em;
    text-align: center
}
.inactive-title-bar {
    align-items: center;
    background-clip: content-box;
    background-size: 6.6666666667% 13.3333333333%;
    display: flex;
    flex: none;
    height: 1.5rem;
    margin: .1rem 0;
    padding: .2rem .1rem
}
.inactive-title-bar .title {
    color: #a5a5a5;
    cursor: default;
    font-family: Chicago_12;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    margin: 0 auto;
    padding: 0 .5em;
    text-align: center
}
.title-bar button {
    background-color: #fff;
    border: 4px solid #000;
    cursor: pointer;
    display: block;
    height: 40px;
    margin: 0 .2rem;
    position: relative;
    transform: scale(.5);
    width: 40px
}
.title-bar button span {
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px,1px,1px,1px);
    position: absolute!important
}
.title-bar button.close:after,.title-bar button.close:before {
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0
}
.title-bar button.close:before {
    background: linear-gradient(#000,#000) 0,linear-gradient(#000,#000) 100%,linear-gradient(#000,#000) top,linear-gradient(#000,#000) bottom;
    background-repeat: no-repeat;
    background-size: 30% 4px,30% 4px,4px 30%,4px 30%
}
.title-bar button.close:after {
    background: linear-gradient(#000,#000) 0,linear-gradient(#000,#000) 100%,linear-gradient(#000,#000) top,linear-gradient(#000,#000) bottom;
    background-repeat: no-repeat;
    background-size: 22.5% 3.6363636364px,22.5% 3.6363636364px,3.6363636364px 22.5%,3.6363636364px 22.5%;
    transform: rotate(45deg) scale(1.1)
}
.title-bar button.close:active:after,.title-bar button.close:active:before {
    opacity: 1
}
.title-bar button.resize {
    background: linear-gradient(#000,#000) left 58%,linear-gradient(180deg,#000 0,#000) 58% top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: 60% 4px,4px 60%
}
.title-bar button.resize:active {
    background: #fff
}
.title-bar button.hidden {
    visibility: hidden
}
.window {
    background-color: #fff;
    border: .1em solid #000;
    flex-direction: column;
    font-family: Inconsolata,Menlo,Chicago,Geneva;
    margin: 1rem;
    min-width: 320px;
    /* overflow: hidden */
}
.window-pane {
    font-size: 18px;
    height: 100%;
    letter-spacing: -.025em;
    padding: 1rem 2rem
}
.window-pane::-webkit-scrollbar {
    background-color: #fff;
    width: 22px
}
.window-pane::-webkit-scrollbar-track {
    background: linear-gradient(45deg,#000 25%,transparent 0,transparent 75%,#000 0,#000),linear-gradient(45deg,#000 25%,transparent 0,transparent 75%,#000 0,#000);
    background-color: #fff;
    background-position: 0 0,2px 2px;
    background-size: 4px 4px;
    border-left: 4px solid #000;
    width: 10px
}
.window-pane::-webkit-scrollbar-thumb {
    background-color: #fff;
    border: 2px solid #000;
    border-right: none;
    box-sizing: content-box;
    width: 20px
}
.separator {
    border-width: .1rem 0;
    border-top: .1rem solid #000
}
.details-bar,.separator {
    display: flex;
    flex: none;
    flex-direction: row;
    font-size: 1rem;
    justify-content: space-between
}
.details-bar {
    border: .1rem solid #000;
    border-width: .1rem 0;
    font-weight: 100;
    padding: .4rem .8rem
}
.btn,.btn-default {
    background: #fff;
    border-image: url(button.svg) 30 stretch;
    border-style: solid;
    border-width: 5.5px;
    color: #000;
    cursor: pointer;
    font-family: Chicago_12;
    font-size: 18px;
    min-height: 20px;
    min-width: 59px;
    padding: 0 20px;
    text-align: center;
    text-decoration: none
}
.btn:active {
    background: #000;
    border-radius: 6px;
    color: #fff;
    font-family: Chicago_12
}
.btn:disabled {
    background: #fff;
    border-image: url(button.svg) 30 stretch;
    border-style: solid;
    border-width: 5.5px;
    color: #b6b7b8;
    font-family: Chicago_12;
    font-size: 18px;
    min-height: 20px;
    min-width: 59px;
    text-align: center;
    text-decoration: none
}
.btn-default {
    border-image: url(button-default.svg) 60 stretch;
    border-width: .5em
}
.btn-default:active {
    border-radius: 12px
}
input {
    border: 1.5px solid #000;
    font-family: Chicago_12;
    font-size: 18px;
    padding-left: 5px
}
input:focus {
    outline: none
}
input[type=text]:focus-visible {
    background: #000;
    color: #fff
}
input[type=email]:focus-visible {
    background: #000;
    color: #fff
}
input[type=password]:focus-visible {
    background: #000;
    color: #fff
}
input[type=number]:focus-visible {
    background: #000;
    color: #fff
}
input[type=date]:focus-visible {
    background: #000;
    color: #fff
}
input[type=time]:focus-visible {
    background: #000;
    color: #fff
}
input[type=datetime]:focus-visible {
    background: #000;
    color: #fff
}
input[type=datetime-local]:focus-visible {
    background: #000;
    color: #fff
}
input[type=month]:focus-visible {
    background: #000;
    color: #fff
}
input[type=week]:focus-visible {
    background: #000;
    color: #fff
}
input[type=search]:focus-visible {
    background: #000;
    color: #fff
}
input[type=tel]:focus-visible {
    background: #000;
    color: #fff
}
input[type=color]:focus-visible {
    background: #000;
    color: #fff
}
textarea:focus {
    background: #000;
    color: #fff
}
input[type=radio]+label:before {
    border-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 0h4v1H4zM0 4h1v4H0zM11 4h1v4h-1zM2 1h2v1H2zM8 1h2v1H8zM10 2h1v2h-1zM1 2h1v2H1zM4 11h4v1H4zM2 10h2v1H2zM8 10h2v1H8zM10 8h1v2h-1zM1 8h1v2H1z'/%3E%3C/svg%3E");
    height: 20px;
    width: 20px
}
input[type=checkbox]+label:before {
    border: 1.5px solid #000;
    height: 20px;
    width: 20px
}
input[type=checkbox],input[type=radio] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: 0;
    border: none;
    margin: 0;
    opacity: 0;
    position: fixed
}
input[type=checkbox]+label,input[type=radio]+label {
    line-height: 13px;
    padding-left: 5px
}
input[type=radio]+label {
    margin-left: 18px;
    position: relative
}
input[type=radio]+label:before {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 0h4v1H4zM0 4h1v4H0zM11 4h1v4h-1zM2 1h2v1H2zM8 1h2v1H8zM10 2h1v2h-1zM1 2h1v2H1zM4 11h4v1H4zM2 10h2v1H2zM8 10h2v1H8zM10 8h1v2h-1zM1 8h1v2H1z'/%3E%3C/svg%3E");
    content: "";
    display: inline-block;
    height: 12px;
    left: -18px;
    margin-right: 6px;
    position: absolute;
    top: 0;
    width: 12px
}
input[type=radio]:focus-visible+label:before,input[type=radio]:hover+label:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 0h4v2H4zM0 4h2v4H0zM10 4h2v4h-2zM2 1h2v2H2zM8 1h2v2H8z'/%3E%3Cpath d='M9 2h2v2H9zM1 2h2v2H1zM4 10h4v2H4zM2 9h2v2H2zM8 9h2v2H8z'/%3E%3Cpath d='M9 8h2v2H9zM1 8h2v2H1z'/%3E%3C/svg%3E")
}
input[type=radio]:checked+label:after {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 0h4v1H1zM1 5h4v1H1zM0 1h6v4H0z'/%3E%3C/svg%3E");
    content: "";
    display: block;
    height: 6px;
    left: -15px;
    position: absolute;
    top: 3px;
    width: 6px
}
input[type=checkbox]+label {
    margin-left: 19px;
    position: relative
}
input[type=checkbox]+label:before {
    background: undefined;
    box-shadow: undefined;
    content: "";
    display: inline-block;
    height: 13px;
    left: -19px;
    margin-right: 6px;
    position: absolute;
    width: 13px
}
input[type=checkbox]:focus-visible+label:before {
    outline: 1px solid #000
}
input[type=checkbox]:hover+label:before {
    outline: 1px solid #000
}
input[type=checkbox]:checked+label:after {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h1v1H0zM1 1h1v1H1zM2 2h1v1H2zM3 3h1v1H3zM4 4h1v1H4zM5 5h1v1H5zM6 6h1v1H6zM7 7h1v1H7zM8 8h1v1H8zM9 9h1v1H9zM10 10h1v1h-1zM11 11h1v1h-1zM11 0h1v1h-1zM10 1h1v1h-1zM9 2h1v1H9zM8 3h1v1H8zM7 4h1v1H7zM6 5h1v1H6zM5 6h1v1H5zM4 7h1v1H4zM3 8h1v1H3zM2 9h1v1H2zM1 10h1v1H1zM0 11h1v1H0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    content: "";
    display: block;
    height: 12px;
    left: -17px;
    position: absolute;
    top: 2px;
    width: 12px
}
input[type=checkbox][disabled]+label:before {
    background: undefined
}
input[type=checkbox][disabled]:checked+label:after {
    background: svg-load("./icon/checkmark-disabled.svg")
}
.field-row {
    align-items: center;
    display: flex;
    font-family: Chicago_12;
    font-size: 1em
}
[class^=field-row]+[class^=field-row] {
    margin-top: 6px
}
.field-row>*+* {
    margin-left: 6px
}
.apple {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='22' viewBox='0 0 9 11' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 0h2v1H5zM4 1h2v1H4zM4 2h1v1H4zM1 3h3v1H1zM5 3h3v1H5zM0 4h9v1H0zM0 5h7v2H0zM0 7h9v2H0zM1 9h7v1H1zM2 10h2v1H2zM5 10h2v1H5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    border: none;
    display: inline-block;
    height: 22px;
    margin-right: 2px;
    width: 18px
}
form {
    font-family: Inconsolata,Menlo,Chicago,Geneva;
    font-size: 14px
}
select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='17' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M0 0h17v17H0z'/%3E%3Cpath fill='%23000' d='M2 5h13v1H2zM4 7h9v1H4zM5 8h7v1H5zM6 9h5v1H6zM7 10h3v1H7zM8 11h1v1H8zM3 6h11v1H3z'/%3E%3C/svg%3E");
    background-position: top 2px right 2px;
    background-repeat: no-repeat;
    border: 1.5px solid;
    -webkit-box-shadow: 2px 8px 0 0 #000;
    -moz-box-shadow: 2px 8px 0 0 #000;
    box-shadow: 2px 2px 0 -1px #000;
    font-size: 18px;
    height: auto;
    padding-left: 20px;
    position: relative;
    width: 10rem
}
select,ul[role] {
    font-family: Chicago_12
}
ul[role] {
    cursor: pointer;
    font-size: 1em;
    list-style: none;
    margin: 0;
    padding: 0
}
ul[role=menu-bar] {
    background: #fff;
    display: flex
}
ul[role=menu-bar]>[role=menu-item] {
    padding: 6px 10px;
    position: relative
}
ul[role=menu-bar]>[role=menu-item]:focus {
    background: #000;
    color: #fff;
    outline: none
}
ul[role=menu-bar]>[role=menu-item]:focus-within {
    background: #000;
    color: #fff;
    outline: none
}
ul[role=menu-bar]>[role=menu-item]:hover {
    background: #000;
    color: #fff;
    outline: none
}
ul[role=menu-bar]>[role=menu-item][aria-haspopup=false] * {
    background: inherit;
    color: inherit;
    text-decoration: none
}
ul[role=menu] {
    background: #fff;
    border: 1px solid;
    box-shadow: 2px 2px;
    color: initial;
    min-width: 200px;
    position: relative
}
ul[role=menu]:before {
    box-shadow: inset 1px 0 rgba(0,0,0,.15),inset -1px 0 #fff;
    content: "";
    left: 28px;
    pointer-events: none;
    position: absolute;
    width: 2px
}
[role=menu-item] ul[role=menu] {
    display: none;
    left: 0;
    position: absolute;
    top: 100%;
    z-index: 99
}
ul[role=menu]>[role=menu-item]>a,ul[role=menu]>[role=menu-item]>button,ul[role=menu]>[role=menu-item][aria-haspopup=true] {
    all: unset;
    box-sizing: border-box;
    display: block;
    padding: 5px 20px;
    position: relative;
    width: 100%
}
ul[role=menu]>[role=menu-item]>a:focus,ul[role=menu]>[role=menu-item]>a:hover,ul[role=menu]>[role=menu-item]>button:focus,ul[role=menu]>[role=menu-item]>button:hover,ul[role=menu]>[role=menu-item][aria-haspopup=true]:focus,ul[role=menu]>[role=menu-item][aria-haspopup=true]:hover {
    background: #000;
    color: #fff
}
ul [role=menu-item] {
    position: relative
}
ul [role=menu-item]:focus-within>[role=menu],ul [role=menu-item]:focus>[role=menu] {
    display: block
}
ul [role=menu-item].divider:after {
    border-top: 1.5px dotted #000;
    content: "";
    display: block;
    padding: 0;
    pointer-events: none
}
.menu-items>li {
    margin-bottom: 1rem
}

* { 
	margin: 0px;
	padding: 0px;
	--sidebar-width: 35%;
}

#sidebar {
	position: absolute;
	padding: 1rem;
	margin: 0px;
	z-index: 2;
	height: 100vh;
	max-width: var(--sidebar-width);
	transition: left ease 1s;

	#add-quest-section {
		display: flex;
		flex-direction: column;
	}
}


#sidebar #add-quest-section textarea {
	resize: none;
}

#sidebar #instructions-section p {
	text-indent: 1rem;
}

#sidebar #instructions-section ol {
	padding-left: 1rem;
}

#sidebar #quest-table-section #quest-table {
	width: 100%;
	border-collapse: collapse;
}

#sidebar #quest-table-section #quest-table * {
	padding: 0.25rem;
	border: solid 1px black;
}

#sidebar #sidebar-toggle {
	z-index: 4;
	position: relative;
	left: 150px;
	bottom: 35px;
	padding: 1rem;
	float: right;
}

.sidebar-in {
	left: 0;
}

.sidebar-out {
	left: calc(-1 * var(--sidebar-width) - 2rem);
}

#questboard {
	flex-grow: 1;
}

#questboard .quest {
	display: flex;
	flex-direction: column;
	position: absolute;
	z-index: 1;
	max-width: 300px;
	max-height: 520px;
}

#questboard .quest p {
	text-align: center;
	padding: 10px;
}

#questboard .quest .title-bar:hover {
	cursor: grab;
}

#questboard .quest .title-bar .title:hover {
	cursor: grab;
}

#login-overlay {
	position: absolute;
	background-color: #ffffffaa;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
}

.error-feedback {
	color: red;
}