:root {
    --r-bg: rgb(21, 22, 24);
    --r-txt: rgb(100, 100, 100);
    
    --font: Avenir, 'Avenir Next', 'Arial Unicode MS', 'Arial Unicode', Arial, sans-serif;
    --rounding: 15px;
    --bg: rgb(26, 27, 28);
    --txt: rgb(100,100,100);
    --txt-muted: rgb(70, 70, 70);
    --border-color: rgb(64, 64, 64);
    --border-width: 1px;
    --border: var(--border-width) solid var(--border-color);
    --font-size: 12pt;
    --accent: rgb(26, 71, 150);
    --accent-faint: rgba(26, 71, 150, 0.08);
    --accent-txt: rgb(113, 138, 164);
    
    --ui-offset-bg: rgba(255, 255, 255, 0.04);
    --ui-offset-bg-hover: rgba(255, 255, 255, 0.05);
    
    --glow-faint: 0 0 10px -5px rgb(100, 100, 100);
    
    --icon-fill: rgb(75,75,75);
    --icon-fill-hover: rgb(80,80,80);
    
    --i-bg: rgb(23, 25, 28);
    --i-border-width: 1px;
    --i-border: var(--i-border-width, var(--border-width)) solid var(--i-border-color, var(--border-color));
    --i-pre-bg: rgb(35, 37, 42);
    --i-ph-txt: rgb(67, 68, 71);
    --i-txt: rgb(95, 95, 95);
    --i-pre-txt: rgb(100, 100, 100);
    --i-rounding: 8px;
    --i-file-bg: rgb(33, 35, 38);
    --i-file-txt: rgba(95,95,95);
    --i-file-bg-hover: rgb(38, 40, 43);
    --i-file-txt-hover: rgb(110, 110, 110);
    --i-file-bg-active: rgb(31, 33, 34);
    --i-file-txt-active: rgb(75, 75, 75);
    --i-file-icon: rgb(47, 63, 78);
    --i-file-icon-hover: rgb(82, 92, 112);
    --i-file-icon-active: rgb(79, 89, 99);
    
    --b-bg: rgb(48, 48, 48);
    --b-bg-hover: rgb(42, 42, 42);
    --b-bg-active: rgba(255,255,255,0.06);
    --b-txt: rgb(120,120,120);
    --b-txt-hover: rgb(100,100,100);
    --b-txt-active: rgb(70,70,70);
    --b-border: none;
    --b-border-color: transparent;
    --b-border-color-hover: transparent;
    --b-border-color-active: transparent;
    --b-rounding: 10px;
    
    --ripple-color: rgba(255,255,255,0.06);
    
    --img-bg: rgb(37, 40, 42);
    
    --cursor: url("https://belmonttechnical.com/venture/assets/cursor.php?b=999999&clr=555555&o1=9&o2=99") 3 1, auto;
    
    --noise: url("https://belmonttechnical.com/venture/assets/noise.png");
    
    --ribbon-bg: rgb(41, 41, 42);
    --ribbon-border: rgb(78, 78, 78);
    --ribbon-i-bg: rgb(50, 50, 50);
    --ribbon-i-bg-hover: rgb(58, 58, 58);
    --ribbon-i-bg-active: rgb(66, 66, 66);
    --ribbon-txt: rgb(105, 105, 105);
    --ribbon-txt-hover: rgb(110, 110, 110);
    --ribbon-txt-active: rgb(120, 120, 120);
    --ribbon-icon-fill: rgb(71, 71, 71);
    --ribbon-icon-fill-light: rgb(110, 110, 110);
    
    --dd-menu-bg: rgba(64, 64, 64, 0.9);
    --dd-menu-rounding: 5px;
    --dd-menu-item-bg-hover: rgba(50, 50, 50, 0.9);
    --dd-menu-item-txt-hover: rgba(100, 100, 100, 1);
    
    --link-bg-hover: rgb(26, 71, 150,0.2);
    --link-rounding: 4px;
    --txt-link-hover: rgb(75, 99, 155);
    
    --searchbox-bg: rgb(47, 47, 47);
    --searchbox-txt: rgb(108, 108, 108);
    --searchbox-shadow-hover: 0px 5px 10px 0px rgb(8, 8, 8);
    
    --dir-bg-top: rgb(35, 36, 38);
    --dir-item-bg: rgb(26, 27, 29);
    --dir-item-bg-hover: hsl(220, 6%, 12%);
    --dir-disclosure-bg: rgb(79, 77, 77);
    --dir-icon-bg: rgb(65, 75, 93);
    --dir-item-bg-active: rgb(32, 34, 37);
    --dir-txt-muted: rgb(96, 96, 96);
    
    --modal-btn-fill: rgb(56, 56, 56);
    --modal-btn-fill-hover: rgb(81, 36, 36);
    --modal-btn-txt-hover: rgb(83, 83, 83);
    
    --list-bg: rgb(24, 24, 25);
    --list-bg-2: rgb(26, 26, 27);
    --list-bg-hover: rgb(30, 30, 31);
    --list-bg-2-hover: rgb(29, 29, 30);
    
    --sidenav-item-bg-hover: rgba(120,120,120,0.1);
    --sidenav-item-bg-active: rgba(120,120,120,0.2);
    
    --tooltip-bg: rgba(55, 55, 55, 0.7);
    --tooltip-txt: rgb(100, 100, 100);
        
    --sel-bg: rgba(60, 84, 105, 0.5);
    --sel-txt: rgb(173, 173, 173);
    --progress-bg: rgb(41, 76, 147);
        
    --warn: rgb(120, 0, 0);
    --positive: rgb(21, 75, 21);
    --red: rgb(96, 25, 25);
    --blue: rgb(52, 75, 120);
    --orange: rgb(147, 95, 0);
    /*--green: rgb(33, 99, 33);*/
    
    --rte-bg: var(--r-bg);
    --rte-tb-bg: var(--bg);
    --rte-border: var(--border-color);
    --rte-icons: var(--icon-fill);
    --rte-icons-hover: rgba(255, 255, 255, 0.3);
}

vui-editor {
	--cb-bg: var(--r-bg);
    --cb-tb-bg: var(--bg);
    --cb-border: var(--border-color);
    --cb-icons: var(--icon-fill);
    --cb-icons-hover: rgba(255, 255, 255, 0.04);
}

@keyframes fade-in{
    0%{opacity:0}
    100%{opacity:1}
}

@keyframes slide-down-fade{
    0%{opacity:0;top:-30px;position: relative;}
    100%{opacity:1;top:0;position: relative;}
}

html, body, vui-window {
    background:var(--r-bg);
    color:var(--r-txt);
    font-family: var(--font);
    word-break: break-word;
    margin: 0;
    cursor:var(--cursor, auto);
}
body{
    position: relative;
    height:100vh;
    padding-top: 0.1px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
body.loading{
    opacity: 0;
}
html[style*="color-scheme: light"] :is(img[src*='/venture/assets/gradient'], img[src*='/venture/assets/color'], .img[style*="url('/venture/assets/gradient"], .img[style*="url('/venture/assets/color"]) {
        filter:brightness(1.2);
    }
#body{
    position: relative;
    overflow: auto;
    flex-grow: 1;
}
[id^="__"][id$="__"] {
    display: none!important;
}
#__vui-modal-root {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    pointer-events: none;
    overflow: visible;
}
vui-window{
    padding-left:10px;
}

vui-window {
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
overflow: auto;
    overflow-y:scroll;
}
vui-window[fill="container"]{
    position:absolute;
}
vui-window[fill="block"]{
    position:static;
}

.img, .avatar{
    background-size:cover;
    background-position:center;
    background-repeat: no-repeat;
    background-color: var(--img-bg, rgba(255, 255, 255, 0.1));
}

.avatar {
    width:30px;
    height: 30px;
    border-radius: 100rem;
}

.userbox{
    display: flex;
    align-items: center;
}

.userbox > :not(:last-child){
    margin-right: 5px;
}

.userbox > .tag {
    align-self: baseline;
}

.muted, .userbox > .tag{
    color:var(--txt-muted);
    font-size:0.8em;
}
.notice {
    font-size: 1.2em;
}
.scrollhide::-webkit-scrollbar{
    opacity: 0;
}
.scrollhide{
    scrollbar-color:transparent;
}

vui-window.scrollhide{
    pointer-events: none;
}

.chat-bubble {
    width: 7px;
    height: 7px;
    background: rgb(57, 109, 142);
    border-radius: 100rem;
    position: absolute;
    top: 0px;
    right: -2px;
    box-shadow: 0 0 0 1px var(--ribbon-bg);
}

.chat-bubble::after {
    content:"";
    position:absolute;
    border-radius: 100rem;
    inset:0;
    background:inherit;
    opacity:0.4;
    animation: pl3 2s infinite;
}
@keyframes pl3 {
    50%{transform:scale(1);opacity:0.7;}
    100% {transform:scale(3);opacity:0}
}

.popover.flip:not(.top)::after {
    content: "";
    position: absolute;
    bottom: -20px;
    right: var(--_vui--avatar-internal-left);
    width: 10px;
    height: 10px;
    border: 10px solid transparent;
    border-top: 10px solid var(--bg);
}
.popover.flip:not(.top)::before {
    content: "";
    position: absolute;
    bottom: -22px;
    right: calc(var(--_vui--avatar-internal-left) - 1px);
    width: 10px;
    height: 10px;
    border: 11px solid transparent;
    border-top: 11px solid var(--border-color);
}
.popover.top:not(.flip)::after {
    content: "";
    position: absolute;
    top: -20px;
    left: var(--_vui--avatar-internal-left);
    width: 10px;
    height: 10px;
    border: 10px solid transparent;
    border-bottom: 10px solid var(--bg);
}
.popover.top:not(.flip)::before {
    content: "";
    position: absolute;
    top: -22px;
    left: calc(var(--_vui--avatar-internal-left) - 1px);
    width: 10px;
    height: 10px;
    border: 11px solid transparent;
    border-bottom: 11px solid var(--border-color);
}
.popover.top.flip::after {
    content: "";
    position: absolute;
    top: -20px;
    right: var(--_vui--avatar-internal-left);
    width: 10px;
    height: 10px;
    border: 10px solid transparent;
    border-bottom: 10px solid var(--bg);
}
.popover.top.flip::before {
    content: "";
    position: absolute;
    top: -22px;
    right: calc(var(--_vui--avatar-internal-left) - 1px);
    width: 10px;
    height: 10px;
    border: 11px solid transparent;
    border-bottom: 11px solid var(--border-color);
}
.popover:not(.top, .flip)::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: var(--_vui--avatar-internal-left);
    width: 10px;
    height: 10px;
    border: 10px solid transparent;
    border-top: 10px solid var(--bg);
}
.popover:not(.top, .flip)::before {
    content: "";
    position: absolute;
    bottom: -22px;
    left: calc(var(--_vui--avatar-internal-left) - 1px);
    width: 10px;
    height: 10px;
    border: 11px solid transparent;
    border-top: 11px solid var(--border-color);
}

body[ribbon] vui-window:not([fill="container"], [fill="block"]){
    top:30px;
    height: calc(100vh - 30px);
}

::selection {
    background: var(--sel-bg, rgba(60, 84, 105, 0.5));
    color: var(--sel-txt, rgb(173, 173, 173));
}

.container {
    width: 80%;
    margin: auto;
}

.breadcrumbs {
    display: flex;
    gap: 8px;
    padding: 3px 2vw;
    position: relative;
}
.breadcrumbs a.breadcrumb {
    line-height: 25px;
}

.slide-down{
    animation: slide-down-fade 0.5s ease-out;
}

.show-on-hover{
    opacity:0;
    transition:opacity 0.3s;
}
.show-on-hover:hover, vui-dir-item.hovered > * > * > .show-on-hover{
    opacity:1;
}

*, *::before, *::after {
    box-sizing:border-box;
}
input, textarea, [contenteditable] {
    outline: none!important;
}
.vui-input, button, .vui-textarea{
    appearance: none;
    -webkit-appearance: none;
}

.center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-row{
    width:100%;
}

.flex-buffer{
    flex-grow: 1;
    visibility: hidden;
}
.heading{
    background: var(--h-bg, var(--bg));
    color: var(--h-txt, var(--txt));
    font-family: var(--h-font, var(--font));
    font-size: 3em;
    text-align: center;
    width: var(--h-width, 70%);
    margin: var(--h-margin, 15px auto);
    padding: var(--h-padding, 0.8em);
    border: var(--h-border, none);
    border-radius: var(--h-rounding, var(--rounding));
    display: flex;
    flex-direction: column;
}
.heading .sub {
    display: inline-block;
    margin-inline:auto;
    font-size: 0.4em;
    font-family: var(--h-sub-font, var(--h-font, var(--font)));
}
a[href]{
    cursor: var(--link-cursor, var(--b-cursor, var(--cursor)));
}
a:not(.ignore) {
    display: inline;
    position: relative;
    color: var(--link-txt, var(--txt));
    text-decoration: none;
    padding-inline: var(--link-padding, 5px);
    z-index: 2;
}
a:not(.ignore, .u, .undecorated)::after {
    content: "";
    display: block;
    position: absolute;
    width: 94%;
    top:-2%;
    left: 3%;
    height: 104%;
    border: 2px solid transparent;
    border-bottom: 1.5px solid var(--link-accent, var(--accent));
    transition: border 0.3s, background 0.25s, left 0.2s, width 0.2s;
    border-top-left-radius: var(--link-rounding,var(--rounding));
    border-top-right-radius: var(--link-rounding,var(--rounding));
    z-index: -1;
}
a:not(.ignore, .u, .undecorated)[href]:hover::after{
    left: -2px;
    width: calc(100% + 4px);
    border: 2px solid var(--link-accent, var(--accent));
    border-bottom-width: 4px;
    background: var(--link-bg-hover);
    border-radius: var(--link-rounding,var(--rounding));
}
a.u:not(.ignore){
    display: inline-flex;
    justify-content: center;
}
a.u:not(.ignore)[href]:hover::after {
    width: 100%;
    border: none;
    height: 2px;
    background: var(--link-accent, var(--accent));
}
a.u:not(.ignore)::after {
    content: "";
    display: block;
    position: absolute;
    width: calc(100% - 20px);
    bottom: -2%;
    height: 1px;
    background: var(--link-accent, var(--accent));
    transition: border 0.3s, left 0.2s, width 0.2s;
    z-index: -1;
}

a.undecorated {
	transition: color 0.3s;
}
a.undecorated:hover {
	color: var(--txt-link-hover, var(--txt-link, var(--txt)));
}

.fadein{
    animation:fade-in 0.3s ease-in;
}
.jumbotron {
    width: 80%;
    display: flex;
    flex-direction: column;
    margin: auto;
    justify-content: center;
    padding: 3em 4em;
    text-align: center;
    margin-block: 10px;
    background: var(--h-bg, var(--bg));
    border-radius: 1em;
}
.jumbotron > .title {
    font-size: 3.2em;
    margin-bottom: 10px;
}
.jumbotron > .subtitle {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.3em;
}
img, object {
    background: var(--img-bg, rgba(255, 255, 255, 0.07));
    user-select: none;
    -webkit-user-select:none;
    -webkit-user-drag: none;
}
    
#body::-webkit-scrollbar, vui-window::-webkit-scrollbar {
    width:10px;
}
::-webkit-scrollbar {
    background: transparent;
    width: 5px;
    height: 5px;
    border-radius: 100rem;
    cursor: var(--cursor, auto);
}
::-webkit-scrollbar-thumb {
    background: var(--scrollbar, rgba(255,255,255,0.15));
    border-radius: 100rem;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-hover, rgba(255,255,255,0.135));
}
::-webkit-scrollbar-thumb:active {
    background: var(--scrollbar-active, rgba(255,255,255,0.1));
}
::-webkit-scrollbar-corner {
    background:transparent;
}
::-webkit-resizer {
    background:gray;
    border-top-left-radius: 15px;
    border-bottom-right-radius: var(--i-rounding, var(--rounding));
}

button:not(.ignore), .btn {
    appearance: none;
    background: var(--b-bg, var(--bg));
    border: var(--b-border, var(--border));
    color: var(--b-txt, var(--txt));
    border-radius: var(--b-rounding, var(--rounding, 5px));
    display: flex;
    align-items: center;
    font-size: var(--font-size);
    padding: 8px 12px;
    justify-self: center;
    margin: 5px auto;
    width: intrinsic;
    height: 35px;
    justify-content: center;
    transition: background var(--b-transition-duration, 0.5s), color var(--b-transition-duration, 0.5s);
    position: relative;
    top: 0;
    font-family: var(--font);
    cursor:var(--b-cursor, var(--cursor));
}
button[type="submit"]:not(.ignore) {
    padding: 8px 25%;
}
button:not(.ignore):hover, .btn:hover {
    background:var(--b-bg-hover, var(--b-bg, var(--bg)));
    color:var(--b-txt-hover, var(--b-border, var(--border)));
    border:var(--b-border-hover, var(--b-border, var(--border)));
}
button:not(.ignore):active, .btn:active {
    background:var(--b-bg-active, var(--b-bg-hover, var(--b-bg, var(--bg))));
    color:var(--b-txt-active, var(--b-txt-hover, var(--b-border, var(--border))));
    border:var(--b-border-active, var(--b-border-hover, var(--b-border, var(--border))));
    
}

input[type="text"], input[type="password"], textarea {
    cursor:var(--txt-cursor, var(--cursor));
}

.vui-input-pre, .btn, button:not(.ignore), vui-form-submit, ::placeholder, .vui-textarea-pre {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
}

.vui-fetch-progress {
position: fixed;
top: 0;
height: 2px;
left: 0;
right: 0;
z-index: 5000;
border: none;
background-image: linear-gradient(var(--progress-bg), var(--progress-bg));
background-repeat: no-repeat;
background-size: 0 2px;
transition: background 0.3s linear
}

.area {
    display: block;
    width: 90%;
    margin: auto;
    margin-block: 10px;
    background: var(--bg);
    color: var(--txt);
    padding: 10px;
    border-radius: var(--rounding, 5px);
}
.area:not(.borderless){
    border: var(--border);
}

.valign {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.halign {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}
.halign * {
    flex-grow: 1;
    margin-inline: 1%!important;
}

code {
    font-family: Menlo, monospace;
    background: var(--ui-offset-bg);
    border-radius: var(--i-rounding);
    padding: 5px;
}

p {
    min-height: 1em;
}