@font-face {
    font-family: "TempleOS";
    src: url("data:font/woff2;base64,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") format("woff2")
}

#copy_symbol {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAIAgMAAAC5YVYYAAAAAXNSR0IArs4c6QAAAAlQTFRFAAAAAAABAAABTNi+MwAAAAF0Uk5TAEDm2GYAAAAbSURBVAgdY+SaxqjwgrGJgbGjCoSaGEBcrmkAS+AGYVKIPvgAAAAASUVORK5CYII=");
}

body,
button,
input,
pre,
textarea,
select,
.direntry {
    border-radius: 0;
    font-family: "TempleOS";
    font-size: 8px
}

.notes {
    color: #555;
    width: 480px;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

strong {
    font-weight: 400;
    color: #a00;
}

button,
input,
textarea,
select {
    padding: 2px;
    border: 1px solid #000
}

.direntry {
    padding-left: 0;
}

canvas {
    image-rendering: pixelated;
}

h2 {
    font-size: 16px;
    font-weight: 400;
}

#os_table {
    border: 1px solid;
    border-collapse: collapse;
    margin: 20px;
}

#os_table td,
#os_table th,
#os_table tr {
    border: 1px solid;
    padding: 6px;
}

/* for the terminal */
#term_wrap {
    display: inline-block;
    margin: 20px;
    overflow: hidden;
}

.term {
    font-family: monospace, courier, fixed, swiss, sans-serif;
    font-weight: normal;
    font-variant-ligatures: none;
    color: #f0f0f0;
    background: #000000;
    line-height: normal;
    overflow: hidden;
    white-space: nowrap;
}

.term_content a {
    color: inherit;
    text-decoration: none;
}

.term_content a:hover {
    color: inherit;
    text-decoration: underline;
}

.term_cursor {
    color: #000000;
    background: #00ff00;
}

.term_char_size {
    display: inline-block;
    visibility: hidden;
    position: absolute;
    top: 0px;
    left: -1000px;
    padding: 0px;
}

.term_textarea {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0px;
    height: 0px;
    padding: 0px;
    border: 0px;
    margin: 0px;
    opacity: 0;
    resize: none;
}

.term_scrollbar {
    background: transparent url(images/bg-scrollbar-track-y.png) no-repeat 0 0;
    position: relative;
    background-position: 0 0;
    float: right;
    height: 100%;
}

.term_track {
    background: transparent url(images/bg-scrollbar-trackend-y.png) no-repeat 0 100%;
    height: 100%;
    width: 13px;
    position: relative;
    padding: 0 1px;
}

.term_thumb {
    background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%;
    height: 20px;
    width: 25px;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: -5px;
}

.term_thumb .term_end {
    background: transparent url(images/bg-scrollbar-thumb-y.png) no-repeat 50% 0;
    overflow: hidden;
    height: 5px;
    width: 25px;
}

.noSelect {
    user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

#keyboard-icon {
    margin-left: 5px;
    margin-right: 5px;
}

/* file import */
#files {
    visibility: hidden;
    width: 1px;
    height: 1px;
    padding: 0px;
    margin: 0px;
    border: 0px;
}

label {
    cursor: pointer;
    margin-left: 5px;
    margin-right: 5px;
}

#net_progress {
    visibility: hidden;
    width: 80px;
}

#tools_wrap {
    display: inline-block;
    margin: 20px;
    vertical-align: top;
}

#clip_text {
    width: 420px;
    height: 180px;
}

.ctrls {
    margin-left: 4px;
    display: block;
    float: right;
}

.ctrl-vbtn {
    display: block;
    width: 60px;
}

.spacer {
    height: 16px;
}

/* tree */

#tools_tree_view {
    width: 426px;
    height: 180px;
    overflow: scroll;
    border: 1px solid #000;
    display: inline-block
}

.tree {
    margin: 0;
    --spacing: 1.5rem;
    --radius: 10px;
}

.tree li {
    display: block;
    position: relative;
    padding-left: calc(2 * var(--spacing) - var(--radius) - 2px);
    padding-top: 4px;
}

.tree ul {
    margin-left: calc(var(--radius) - var(--spacing));
    padding-left: 0;
}

.tree ul li {
    border-left: 1px solid #ddd;
}

.tree ul li a {
    color: #a00;
    text-decoration: none;
}

.tree ul li:last-child {
    border-color: transparent;
}

.tree ul li::before {
    content: '';
    display: block;
    position: absolute;
    top: calc(var(--spacing) / -2);
    left: -1px;
    width: calc(var(--spacing) + 2px);
    height: calc(var(--spacing) + 1px);
    border: 1px solid #ddd;
    border-width: 0 0 1px 1px;
}

.tree summary {
    display: block;
    cursor: pointer;
}

.tree summary::marker,
.tree summary::-webkit-details-marker {
    display: none;
}

.tree summary:focus {
    outline: none;
}

.tree summary:focus-visible {
    outline: 1px solid #ddd;
}

.tree li::after,
.tree summary::before {
    content: '';
    display: block;
    position: absolute;
    top: calc(var(--spacing) / 2 - var(--radius));
    left: calc(var(--spacing) - var(--radius) - 1px);
    width: 15px;
    height: 16px;
    background: white url('images/file-icon.png') -2px 0;
}

.tree summary::before {
    z-index: 1;
    background: white url('images/folder-icons.png') 0 2px;
}

.tree details[open]>summary::before {
    background-position: -16px 2px;
    width: 16px;
}

.direntry {
    height: 16px;
    color: #00a;
    display: flex !important;
    align-items: center;
}

.tooltitle {
    color: #00a;
}