* {
    --back-graph-theme: #1d1f24;
    --back-graph-inactive-theme: #4d4b8d77;
    --back-graph-active-theme: #7772ff;

    --back-main-theme: #2e333d;
    --back-badge-theme: #2e333d;
    --back-with-icon-theme: #2e333d;
    --back-progress-theme: #9896ff;
    --back-secondary-theme: #353941;

    --back-special-light-theme: #9796da;
    --back-special-dark-theme: #6563ff;

    --back-title-text: #d8c3ff;
    --back-status-text: #d8c3ff;
    --back-main-text-theme: #d8c3ff;
    --back-main-text-theme-buttons: #d8c3ff;
    --back-main-text-theme-buttons-light: #d8c3ff;
    --back-special-light-text-theme: #222222;
    --back-special-dark-text-theme: #d8c3ff;

    --back-input-focus: #a472ff;
    --back-input-focus-text: #a472ff;
    --back-input-placeholder-text: #9a85c244;

    --back-universe-dark-text-theme: #ba94ff;
    --back-inventory-cell-outline: #323068;
}

input:focus {
    border-color: var(--back-input-focus) !important;
    border-width: 2px;
    color: var(--back-input-focus-text) !important;
}

input::placeholder {
    color: var(--back-input-placeholder-text) !important;
}

.title {
    font-weight: bold !important;
    color: var(--back-title-text) !important;
}

.status {
    font-style: italic !important;
    color: var(--back-status-text) !important;
}

.badge-button {
    background-color: var(--back-badge-theme) !important;
}

.button {
    background-color: var(--back-main-theme);
    color: var(--back-main-text-theme-buttons);
}

.button.icon-back {
    background-color: var(--back-with-icon-theme);
    color: var(--back-main-text-theme-buttons);
}

p {
    color: var(--back-main-text-theme);
}

.main-text-buttons {
    color: var(--back-main-text-theme-buttons);
    font-weight: bold;
}

.main-text-buttons-light {
    color: var(--back-main-text-theme-buttons-light);
    font-weight: lighter;
}

.main-text {
    color: var(--back-main-text-theme);
    font-weight: bold;
}

.secondary-text {
    color: var(--back-special-dark-text-theme);
    font-style: italic;
    font-weight: lighter;
}

.button-special-light {
    background-color: var(--back-special-light-theme);
    color: var(--back-special-light-text-theme);
}

.button-special-dark {
    background-color: var(--back-special-dark-theme);
    color: var(--back-special-dark-text-theme);
}

.progress {
    background-color: var(--back-progress-theme);
    --bulma-progress-value-background-color: var(--back-progress-theme);
}

.is-half-hidden {
    opacity: 50%;
}

.is-half-hidden:hover {
    opacity: 100%;
}

.is-scaled {
    scale: 0.6;
}

.is-scaled:hover {
    scale: 0.8;
}
