[svga-hud] {
    position: absolute;
    margin-top: 2em;
    margin-left: 0.4em;
    font-family: sans-serif;
    font-size: 10pt;
    overflow: visible;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}
.ui,
.ui *,
[ui],
[ui] * {
    cursor: pointer;
}
.ui [disabled],
.ui [disabled] *,
.ui[disabled],
.ui[disabled] *,
[ui] [disabled],
[ui] [disabled] *,
[ui][disabled],
[ui][disabled] * {
    cursor: default;
}
.button,
button {
    display: inline-block;
    margin-top: 0.3em;
    margin-bottom: 0.3em;
    padding: 0.6em 0.8em;
    border: 2px solid transparent;
    outline: 0;
    border-radius: 4px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background-color: #507ed3;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}
.button + .button,
.button + button,
button + .button,
button + button {
    margin-left: 1px;
}
.button.border,
button.border {
    border-color: currentColor;
}
.button.active,
button.active {
    background-color: #00a3a3;
}
.button.active:hover,
button.active:hover {
    background-color: #009494;
}
.button.disabled,
.button[disabled],
button.disabled,
button[disabled] {
    background-color: #507ed3;
    color: #7da6e8;
    pointer-events: none;
}
.button.soft-disabled,
button.soft-disabled {
    background-color: #507ed3;
    color: #7da6e8;
}
.button.small,
button.small {
    padding: 0.3em 0.4em;
}
.button:focus,
button:focus {
    border-color: #363a49;
}
.button:hover,
button:hover {
    background-color: #4375d0;
}
.button.black:hover,
button.black:hover {
    background-color: #1f1f1f;
}
.button.blue:hover,
button.blue:hover {
    background-color: #3b569b;
}
.button.bronze:hover,
button.bronze:hover {
    background-color: #d0b571;
}
.button.mist:hover,
button.mist:hover {
    background-color: #dbdde1;
}
.button.green:hover,
button.green:hover {
    background-color: #0c9723;
}
.button.grey:hover,
button.grey:hover {
    background-color: #727988;
}
.button.mint:hover,
button.mint:hover {
    background-color: #13ae69;
}
.button.navy:hover,
button.navy:hover {
    background-color: #272e7c;
}
.button.olive:hover,
button.olive:hover {
    background-color: #06795e;
}
.button.onyx:hover,
button.onyx:hover {
    background-color: #131339;
}
.button.orange:hover,
button.orange:hover {
    background-color: #ff781f;
}
.button.purple:hover,
button.purple:hover {
    background-color: #3e2a7a;
}
.button.red:hover,
button.red:hover {
    background-color: #e72329;
}
.button.silver:hover,
button.silver:hover {
    background-color: #bcc1cd;
}
.button.smoke:hover,
button.smoke:hover {
    background-color: #3d4152;
}
.button.tar:hover,
button.tar:hover {
    background-color: #272b49;
}
.button.teal:hover,
button.teal:hover {
    background-color: #009494;
}
.button.white:hover,
button.white:hover {
    background-color: #f7f7f7;
}
.button.yellow:hover,
button.yellow:hover {
    background-color: #f0ac00;
}
.button.white,
button.white {
    color: #3f5ca6;
}
.buttons {
    display: inline-block;
    vertical-align: middle;
}
@media (min-width: 500px) {
    .buttons {
        display: inline-flex;
        flex-flow: row wrap;
        border-radius: 4px;
    }
    .buttons > * {
        flex: 1 1 auto;
        border-radius: 0;
    }
    .buttons > :first-child {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }
    .buttons > :last-child {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }
}
.bg-xxl {
    background-color: #7da6e8;
}
.bg-xl {
    background-color: #507ed3;
}
.bg-l {
    background-color: #406abf;
}
.bg-m {
    background-color: #3d5aa9;
}
.bg-d {
    background-color: #384c94;
}
.bg-xd {
    background-color: #263373;
}
.white {
    background-color: #fff;
}
.mist {
    background-color: #e9eaed;
}
.silver {
    background-color: #c4c9d4;
}
.grey {
    background-color: #7a8190;
}
.smoke {
    background-color: #363a49;
}
.onyx {
    background-color: #060613;
}
.tar {
    background-color: #1e2138;
}
.black {
    background-color: #000;
}
.red {
    background-color: #e83037;
}
.orange {
    background-color: #ff8533;
}
.yellow {
    background-color: #ffb700;
}
.green {
    background-color: #0da527;
}
.blue {
    background-color: #3f5ca6;
}
.indigo {
    background-color: #945ec9;
}
.violet {
    background-color: #c63980;
}
.blueberry {
    background-color: #906ce0;
}
.bronze {
    background-color: #d9c38c;
}
.mint {
    background-color: #15bc71;
}
.navy {
    background-color: #1b2055;
}
.navy-dark {
    background-color: #0c173b;
}
.olive {
    background-color: #05614b;
}
.purple {
    background-color: #47308d;
}
.teal {
    background-color: #00a3a3;
}
.fuscha {
    background-color: #c36;
}
.ghost {
    background-color: rgba(255, 255, 255, 0.05);
}
.demon {
    background-color: rgba(0, 0, 0, 0.05);
}
.bg-xxl-text {
    color: #7da6e8;
}
.bg-xl-text {
    color: #507ed3;
}
.bg-l-text {
    color: #406abf;
}
.bg-m-text {
    color: #3d5aa9;
}
.bg-d-text {
    color: #384c94;
}
.bg-xd-text {
    color: #263373;
}
.white-text {
    color: #fff;
}
.mist-text {
    color: #e9eaed;
}
.silver-text {
    color: #c4c9d4;
}
.grey-text {
    color: #7a8190;
}
.smoke-text {
    color: #363a49;
}
.tar-text {
    color: #1e2138;
}
.onyx-text {
    color: #060613;
}
.black-text {
    color: #000;
}
.red-text {
    color: #e83037;
}
.orange-text {
    color: #ff8533;
}
.yellow-text {
    color: #ffb700;
}
.green-text {
    color: #0da527;
}
.blue-text {
    color: #3f5ca6;
}
.indigo-text {
    color: #945ec9;
}
.violet-text {
    color: #c63980;
}
.blueberry-text {
    color: #906ce0;
}
.bronze-text {
    color: #d9c38c;
}
.mint-text {
    color: #15bc71;
}
.navy-text {
    color: #1b2055;
}
.navy-dark-text {
    color: #0c173b;
}
.olive-text {
    color: #05614b;
}
.purple-text {
    color: #47308d;
}
.teal-text {
    color: #00a3a3;
}
.fuscha-text {
    color: #c36;
}
.bg-xxl-em em {
    color: #7da6e8;
}
.bg-xl-em em {
    color: #507ed3;
}
.bg-l-em em {
    color: #406abf;
}
.bg-m-em em {
    color: #3d5aa9;
}
.bg-d-em em {
    color: #384c94;
}
.bg-xd-em em {
    color: #263373;
}
.white-em em {
    color: #fff;
}
.mist-em em {
    color: #e9eaed;
}
.silver-em em {
    color: #c4c9d4;
}
.grey-em em {
    color: #7a8190;
}
.smoke-em em {
    color: #363a49;
}
.tar-em em {
    color: #1e2138;
}
.onyx-em em {
    color: #060613;
}
.black-em em {
    color: #000;
}
.red-em em {
    color: #e83037;
}
.orange-em em {
    color: #ff8533;
}
.yellow-em em {
    color: #ffb700;
}
.green-em em {
    color: #0da527;
}
.blue-em em {
    color: #3f5ca6;
}
.indigo-em em {
    color: #945ec9;
}
.violet-em em {
    color: #c63980;
}
.blueberry-em em {
    color: #906ce0;
}
.bronze-em em {
    color: #d9c38c;
}
.mint-em em {
    color: #15bc71;
}
.navy-em em {
    color: #1b2055;
}
.navy-dark-em em {
    color: #0c173b;
}
.olive-em em {
    color: #05614b;
}
.purple-em em {
    color: #47308d;
}
.teal-em em {
    color: #00a3a3;
}
.fuscha-em em {
    color: #c36;
}
body {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow: hidden;
}
h2 {
    font-size: 1.563em;
}
h3 {
    font-size: 1.25em;
}
h4 {
    font-size: 1em;
}
h5 {
    font-size: 0.8em;
}
html {
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-rendering: geometricPrecision;
}
#message,
#panel,
#svga-banner {
    pointer-events: none;
}
#svga-banner-outer {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 31px;
    padding: 4px 4px 4px 68px;
    border-bottom: 1px solid rgba(38, 51, 115, 0.6);
    text-align: center;
    font-size: 11pt;
    line-height: 1;
    color: #fff;
    background: linear-gradient(to right, #263373, #3d5aa9, #263373);
    opacity: 0;
    transition: opacity 0.3s;
}
#svga-banner-inner {
    max-width: 100%;
    padding-left: 0.1em;
    text-align: left;
    line-height: 1.1;
}
#message-outer {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s;
}
#message-inner {
    position: relative;
    display: inline-block;
    top: -25vh;
    max-width: 100%;
    max-height: 100%;
    margin: 1rem 2rem;
    padding: 2rem;
    border-radius: 8px;
    text-align: center;
    font-size: 2em;
    font-weight: 700;
    color: #fff;
    background: #406abf;
}
@media (max-width: 700px) {
    h1 {
        font-size: 1.728em;
    }
    h2 {
        font-size: 1.44em;
    }
    h3 {
        font-size: 1.2em;
    }
    h4 {
        font-size: 1em;
    }
    h5 {
        font-size: 0.833em;
    }
    #message-inner {
        font-size: 1.5em;
        padding: 1rem 1.5rem;
        margin: 1.5rem;
    }
}
@media (max-width: 450px) {
    h1 {
        font-size: 1.424em;
    }
    h2 {
        font-size: 1.266em;
    }
    h3 {
        font-size: 1.125em;
    }
    h4 {
        font-size: 1em;
    }
    h5 {
        font-size: 0.888em;
    }
    #message-inner {
        font-size: 1.25em;
        padding: 1rem;
        margin: 1rem;
    }
}
#Alert div:last-child,
#message-inner > div {
    margin-top: 1em;
}
#panel-outer {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    transition: opacity 0.3s;
    z-index: 100;
}
#panel-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    cursor: pointer;
}
#panel-frame {
    position: relative;
    padding: 16px;
}
#panel-close {
    position: absolute;
    width: 32px;
    height: 32px;
    top: 4px;
    left: 4px;
    z-index: 101;
}
#Alert {
    max-width: 30em;
    padding: 1em;
    border-radius: 8px;
    text-align: center;
    color: #fff;
    background: #406abf;
}
#Alert + #panel-close {
    display: none;
}
#settings {
    padding-bottom: 8px;
    border-radius: 8px;
    text-align: center;
    color: #fff;
    background-color: #384c94;
}
#settings [settings-controls] {
    padding: 8px;
    border-radius: 8px;
    background: #406abf;
}
#settings [settings-controls] svg {
    display: block;
    width: 360px;
    height: 32px;
}
#settings [settings-controls] svg + svg {
    margin-top: 8px;
}
#settings [settings-copyright],
#settings [settings-info],
#settings [settings-title] {
    margin: 8px 0;
}
#svga {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    background: 0 0;
    overflow: hidden;
    opacity: 0;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
#svga:-webkit-full-screen {
    position: absolute;
    top: 0;
}
#svga:-ms-fullscreen {
    position: absolute;
    top: 0;
}
#svga:-moz-full-screen {
    position: absolute;
    top: 0;
}
#svga:fullscreen {
    position: absolute;
    top: 0;
}
#svga * {
    touch-action: manipulation;
    touch-action: none;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
}
* {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}
.selectable,
.selectable *,
[contentEditable],
em,
em *,
input,
p,
p *,
textarea {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    cursor: inherit;
}
.selectable [contentEditable],
.selectable input,
.selectable textarea,
[contentEditable],
[contentEditable].selectable,
input,
input.selectable,
textarea,
textarea.selectable {
    cursor: text;
}
.selectable a,
.selectable a *,
.selectable button,
.selectable button *,
.selectable input[type="button"],
.selectable input[type="button"] *,
.selectable input[type="checkbox"],
.selectable input[type="checkbox"] *,
.selectable input[type="file"],
.selectable input[type="file"] *,
.selectable input[type="image"],
.selectable input[type="image"] *,
.selectable input[type="radio"],
.selectable input[type="radio"] *,
.selectable input[type="reset"],
.selectable input[type="reset"] *,
.selectable input[type="submit"],
.selectable input[type="submit"] *,
.selectable label,
.selectable label *,
.selectable select,
.selectable select *,
a,
a *,
a.selectable,
a.selectable *,
button,
button *,
button.selectable,
button.selectable *,
input[type="button"],
input[type="button"] *,
input[type="button"].selectable,
input[type="button"].selectable *,
input[type="checkbox"],
input[type="checkbox"] *,
input[type="checkbox"].selectable,
input[type="checkbox"].selectable *,
input[type="file"],
input[type="file"] *,
input[type="file"].selectable,
input[type="file"].selectable *,
input[type="image"],
input[type="image"] *,
input[type="image"].selectable,
input[type="image"].selectable *,
input[type="radio"],
input[type="radio"] *,
input[type="radio"].selectable,
input[type="radio"].selectable *,
input[type="reset"],
input[type="reset"] *,
input[type="reset"].selectable,
input[type="reset"].selectable *,
input[type="submit"],
input[type="submit"] *,
input[type="submit"].selectable,
input[type="submit"].selectable *,
label,
label *,
label.selectable,
label.selectable *,
select,
select *,
select.selectable,
select.selectable * {
    cursor: pointer;
}
a {
    color: inherit;
    text-decoration: none;
}
canvas,
iframe,
object,
progress,
video {
    display: block;
}
input:not([type="checkbox"]),
select,
textarea {
    outline: 0;
}
fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}
*,
::after,
::before {
    box-sizing: border-box;
}
iframe {
    border: 0;
}
audio:not([controls]) {
    display: none;
}
a:active,
a:hover {
    outline: 0;
}
b,
strong {
    font-weight: 700;
}
h1 {
    font-size: 2em;
}
small {
    font-size: 80%;
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
hr {
    height: 0;
}
pre {
    overflow: auto;
}
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
button,
select {
    text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
button[disabled],
html input[disabled] {
    cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
input {
    line-height: normal;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}
table {
    border-collapse: separate;
    border-spacing: 0;
}
td,
th {
    padding: 0;
}