@font-face {
    font-family: 'FARegular';
    src: url('../fonts/FontAwesome5Regular.otf') format('truetype');
}

@font-face {
    font-family: 'FABold';
    src: url('../fonts/FontAwesome5Solid.otf') format('truetype');
}

@font-face {
    font-family: 'FABrands';
    src: url('../fonts/FontAwesome5Brands.otf') format('truetype');
}

@font-face {
    font-family: 'Prompt';
    src: url('../fonts/Prompt.ttf') format('truetype');
}

@font-face {
    font-family: 'Nunito';
    src: url('../fonts/Nunito.ttf') format('truetype');
}

@font-face {
    font-family: 'Incest';
    src: url('../fonts/LoveYaLikeASister.ttf') format('truetype');
}

html:root {
    --mud-typography-default-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h1-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h2-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h3-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h4-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h5-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-h6-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-subtitle1-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-subtitle2-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-body1-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-body2-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-input-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-button-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-caption-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    --mud-typography-overline-family: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    
    --mud-typography-default-size: 10px !important;
    --mud-typography-body1-size: 10px !important;
    --mud-typography-body2-size: 10px !important;
    --mud-typography-caption-size: 9px !important;
    --mud-typography-button-size: 10px !important;
    --mud-typography-subtitle1-size: 10px !important;
    --mud-typography-subtitle2-size: 10px !important;
    --mud-default-borderradius: 6px;
}

html:root {
    --vscode-bg: #1e1e1e;
    --vscode-surface: #252526;
    --vscode-surface-2: #2d2d30;
    --vscode-border: #3c3c3c;
    --vscode-text: #d4d4d4;
    --vscode-text-dim: #9da0a6;
    --vscode-accent: #007acc;
    --vscode-accent-2: #3794ff;
    --vscode-hover: #2a2d2e;
    --vscode-active: #37373d;
    --vscode-font-ui: 'Nunito', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --vscode-font-code: 'Cascadia Mono', 'Cascadia Code', Consolas, 'Courier New', monospace;
}

@-webkit-keyframes mud-open-dialog-center {
    0% {
        opacity: 0;
    }
    
    50% {
        opacity: 0.4;
    }
    
    100% {
        opacity: 1;
    }
}

@keyframes mud-open-dialog-center {
    0% {
        opacity: 0;
    }
    
    50% {
        opacity: 0.4;
    }
    
    100% {
        opacity: 1;
    }
}

:root {
    --viewport-height: 100vh;
    --viewport-height-wtb: calc(var(--viewport-height) - 48px);
}

/* Fallback to 'px' unit when 'svh' unit is not supported */
@supports (height: 100svh) {
    :root {
        --viewport-height: 100svh;
    }
}

.mud-dialog {
    animation: mud-open-dialog-center 0.4s ease-in-out;
}

html,
body {
    font-family: var(--vscode-font-ui);
    font-size: 10px;
    background: var(--vscode-bg);
    color: var(--vscode-text);
    overflow-x: hidden !important;
    overflow-y: hidden;
}

#app {
    background: var(--vscode-bg);
    color: var(--vscode-text);
    font-family: var(--vscode-font-ui);
}

.mud-typography,
.mud-input,
.mud-button-root,
.mud-chip {
    font-family: var(--vscode-font-ui) !important;
}

.agent-guid,
code,
pre,
.md-codeblock,
.md-codeblock * {
    font-family: var(--vscode-font-code) !important;
}

img[src=""],
img:not([src]) {
    display: none !important;
    border: none !important;
    height: unset !important;
    width: unset !important;
    visibility: hidden !important;
}

.cached-image-host {
    position: relative;
    display: block;
    overflow: hidden;
}

.cached-image-host > .cached-image-skeleton {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.cached-image-host > img.cached-image-anim {
    display: block;
    width: 100%;
    height: 100%;
}

/* Alex: Animate only our CachedImage instances.
Never hide random <img> tags from other components. */
img.cached-image-anim:not(.no-image-anim):not(.image-ready) {
    opacity: 0;
    filter: blur(7px) saturate(0.9);
    transform: scale(1.018);
}

img.cached-image-anim:not(.no-image-anim) {
    transform-origin: center center;
    will-change: opacity, transform, filter;
    transition:
    opacity .42s cubic-bezier(.2, .65, .2, 1),
    filter .42s cubic-bezier(.2, .65, .2, 1),
    transform .42s cubic-bezier(.2, .65, .2, 1);
}

img.cached-image-anim:not(.no-image-anim).image-ready {
    opacity: 1;
    filter: blur(0) saturate(1);
    transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
    img.cached-image-anim:not(.no-image-anim) {
        transition: none !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }
}

input[type="time"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    display: none;
}

article {
    padding: 0px !important;
}

.appbar-style {
    height: 96px !important;
    position: fixed;
    width: 100%;
    top: 0px;
    background-color: var(--mud-palette-appbar-background);
}

.mud-expand-panel {
    background: linear-gradient(45deg, var(--mud-palette-background-gray), var(--mud-palette-surface));
}

.mud-expand-panel div[class*='mud-expand-panel-content'] {
    border-left-width: 8px;
    padding-left: 10px;
    border-left-color: var(--mud-palette-lines-inputs);
}

.mud-expand-panel div[class*='mud-expand-panel-content'] label[class*='mud-input-label'] {
    background: var(--mud-palette-background-gray);
}

.mud-appbar button[class*='mud-fab'] {
    border-radius: 4px;
    margin-left: 1px;
    margin-right: 1px;
    background: transparent;
}

.mud-appbar button[class*='mud-fab']:hover {
    background-color: var(--mud-palette-action-default-hover);
}

.mud-list-item-text {
    height: 23px;
    margin: 0px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.mud-list-item-text > p {
    display: flex;
    flex-wrap: nowrap;
    word-wrap: normal;
    text-wrap: nowrap;
    align-items: center;
    padding-top: 2px;
}

.mud-list-item-text > p > svg {
    margin-right: 10px;
}

.mud-list-item-text > p > i {
    width: 18px;
    height: 18px;
    margin-top: -8px;
    margin-right: 10px;
    font-size: 18px;
    text-align: center;
}

.mud-drawer-header {
    min-height: 48px;
}

.shadow-filter {
    filter: drop-shadow(3px 3px 10px #000000da);
}

.super-gradient {
    color: var(--mud-palette-text-primary);
    background: linear-gradient(125deg, var(--mud-palette-secondary), var(--mud-palette-dark));
}

.md-img {
    max-height: 300px;
    max-width: 100%;
    margin: auto;
    border-radius: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.md-codeblock {
    color: #DCDCDC;
    padding: 14px;
    border-radius: 10px;
    font-family: monospace;
    font-size: 0.8em;
    margin-top: 4px;
    margin-bottom: 8px;
}

.md-codeblock > div {
    background-color: transparent !important;
}

.md-codeblock-text,
.md-codeblock-text * {
    word-wrap: break-word;
    text-wrap: revert;
}

.md-blockquote {
    border-left-width: 5px;
    border-left-color: var(--mud-palette-lines-default);
    padding-left: 10px;
}

.md-mark {
    border-radius: 4px;
    background: var(--mud-palette-warning);
    padding-left: 5px;
    padding-right: 5px;
}

.md-hr {
    border: 0;
    height: 1px;
    background: var(--mud-palette-primary-lighten);   
    margin-top: 1px;
}

.md-h1 {
    font-variant-caps: petite-caps;
    font-size: 1.6em;
    color: var(--mud-palette-primary-lighten);
}

.md-h2 {
    font-variant-caps: petite-caps;
    font-size: 1.5em;
    color: var(--mud-palette-primary-lighten);
}

.md-h3 {
    font-variant-caps: petite-caps;
    font-size: 1.4em;
    color: var(--mud-palette-primary-lighten);
}

.md-h4 {
    font-variant-caps: petite-caps;
    font-size: 1.3em;
    color: var(--mud-palette-primary-lighten);
}

/* VS Code dark shell + controls */
.vscode-shell .mud-layout {
    background: var(--vscode-bg);
}

.vscode-topbar {
    border-bottom: 1px solid var(--vscode-border);
}

.vscode-sidebar {
    border-right: 1px solid var(--vscode-border);
}

.vscode-main {
    background: var(--vscode-bg) !important;
}

.vscode-main .content {
    background: var(--vscode-bg);
}

.mud-navmenu .mud-nav-group > .mud-nav-link,
.mud-navmenu .mud-nav-link {
    border-radius: 4px;
}

.mud-navmenu .mud-nav-link:hover {
    background-color: var(--vscode-hover);
}

.mud-navmenu .mud-nav-link.active,
.mud-navmenu .mud-nav-link.mud-nav-link-active {
    background: var(--vscode-active);
    border-left: 2px solid var(--vscode-accent);
}

.mud-table,
.mud-datagrid,
.mud-data-grid {
    background: var(--vscode-surface) !important;
    border: none;
    border-radius: 6px;
}

.mud-table-container {
    border-top: none;
}

.mud-table-head .mud-table-cell,
.mud-table-body .mud-table-cell {
    border-bottom: 1px solid #323233;
}

.mud-table-head .mud-table-cell {
    background: var(--vscode-surface-2);
    color: var(--vscode-text-dim);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.mud-table-body .mud-table-row:hover {
    background: var(--vscode-hover) !important;
}

.mud-dialog {
    background: var(--vscode-surface);
    border: none;
    border-radius: 8px;
}

.mud-dialog-title {
    border-bottom: 1px solid var(--vscode-border);
    background: var(--vscode-surface-2);
}

.mud-dialog-actions {
    border-top: 1px solid var(--vscode-border);
}

.mud-input-control .mud-input-outlined-border {
    border-color: #4a4a4a !important;
}

.mud-input > input,
.mud-input-slot {
    color: var(--vscode-text) !important;
}

.mud-input-control:hover .mud-input-outlined-border {
    border-color: #4b4b4b !important;
}

.mud-input-control.mud-input-focused .mud-input-outlined-border {
    border-color: var(--vscode-accent) !important;
}

.mud-button-root {
    border-radius: 4px;
}

.mud-button-root.mud-button-filled-primary {
    background: var(--vscode-accent);
}

.mud-button-root.mud-button-filled-primary:hover {
    background: var(--vscode-accent-2);
}

.mud-chip {
    border: none;
    background: var(--vscode-surface-2);
}

/* VS Code-ish icon sizing */
.mud-icon-root {
    font-size: 16px;
}

.mud-icon-size-small {
    font-size: 15px !important;
}

.mud-icon-size-medium {
    font-size: 17px !important;
}

.mud-navmenu .mud-nav-link .mud-icon-root,
.mud-navmenu .mud-nav-group .mud-icon-root {
    font-size: 15px !important;
}

/* Left-nav icon tint by section: subtle cues, same UX, less visual noise. */
.nav-group-cafe .mud-icon-root,
.nav-link-gaming .mud-icon-root {
    color: #4fc3f7 !important;
}

.nav-group-store .mud-icon-root,
.nav-link-store .mud-icon-root {
    color: #66bb6a !important;
}

.nav-link-cashout .mud-icon-root {
    color: #ffb74d !important;
}

.nav-link-karaoke .mud-icon-root {
    color: #ff8a65 !important;
}

.nav-group-stats .mud-icon-root,
.nav-link-stats .mud-icon-root {
    color: #fbc02d !important;
}

.nav-group-energy .mud-icon-root,
.nav-link-energy .mud-icon-root {
    color: #ffd54f !important;
}

.nav-group-rag .mud-icon-root,
.nav-link-rag .mud-icon-root {
    color: #ba68c8 !important;
}

.nav-group-agents .mud-icon-root,
.nav-link-agents .mud-icon-root {
    color: #90caf9 !important;
}

.nav-group-system .mud-icon-root,
.nav-link-system .mud-icon-root {
    color: #ef9a9a !important;
}

.nav-group-legal .mud-icon-root,
.nav-link-legal .mud-icon-root,
.nav-group-ops .mud-icon-root,
.nav-group-collab .mud-icon-root {
    color: #b0bec5 !important;
}

.mud-button-root .mud-icon-root,
.mud-icon-button .mud-icon-root {
    font-size: 15px !important;
}

.mud-chip .mud-chip-icon {
    font-size: 14px !important;
}

/* Shared hero style for 404/unauthorized/account-state pages. */
.error-page-special {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 100%;
    max-height: 100%;
    overflow-y: auto;
    padding: 20px 16px 28px;
    text-align: center;
    gap: 10px;
    box-sizing: border-box;
}

.error-page-special > p:first-of-type {
    font-size: clamp(1.3rem, 3.2vw, 1.9rem);
    font-weight: 300;
    text-transform: uppercase;
    color: var(--mud-palette-primary);
    margin-top: 8px;
}

.error-page-special > p:nth-of-type(2) {
    color: var(--mud-palette-text-secondary);
    font-size: clamp(0.92rem, 2.2vw, 1rem);
    max-width: 860px;
    line-height: 1.35;
    word-break: break-word;
}

.error-page-special__wallpaper {
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 80%, transparent);
    width: min(1080px, 94vw);
    height: min(46vh, 540px);
    min-height: 220px;
    background-position: center;
    background-size: cover;
    box-shadow: 0 12px 42px rgba(0, 0, 0, 0.26);
}

.error-page-special > p:nth-of-type(3) {
    color: var(--mud-palette-text-secondary);
    max-width: min(860px, 94vw);
    line-height: 1.35;
    word-break: break-word;
}

.error-page-special__quote {
    text-align: left;
    max-width: min(860px, 94vw);
    color: var(--mud-palette-text-primary);
    background: color-mix(in srgb, var(--mud-palette-surface) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-inputs) 75%, transparent);
    border-radius: 12px;
    padding: 12px 14px;
    line-height: 1.38;
    word-break: break-word;
}

/* Row action button theme rule: single consistent look across all table/grid rows */
.mud-table-body .mud-icon-button,
.mud-table .mud-table-row .mud-icon-button,
.mud-datagrid .mud-table-body .mud-icon-button,
.mud-data-grid .mud-table-body .mud-icon-button {
    width: 26px;
    height: 26px;
    min-width: 26px;
    min-height: 26px;
    padding: 4px;
    border-radius: 4px;
    border: none;
    background: transparent;
    box-shadow: none;
}

.mud-table-body .mud-icon-button:hover,
.mud-table .mud-table-row .mud-icon-button:hover,
.mud-datagrid .mud-table-body .mud-icon-button:hover,
.mud-data-grid .mud-table-body .mud-icon-button:hover {
    background: var(--vscode-hover);
}

.mud-table-body .mud-icon-button:focus-visible,
.mud-table .mud-table-row .mud-icon-button:focus-visible,
.mud-datagrid .mud-table-body .mud-icon-button:focus-visible,
.mud-data-grid .mud-table-body .mud-icon-button:focus-visible {
    outline: 1px solid var(--vscode-accent);
    outline-offset: 1px;
}

.mud-table-body .mud-icon-button .mud-icon-root,
.mud-table .mud-table-row .mud-icon-button .mud-icon-root,
.mud-datagrid .mud-table-body .mud-icon-button .mud-icon-root,
.mud-data-grid .mud-table-body .mud-icon-button .mud-icon-root {
    font-size: 14px !important;
}

.md-h5 {
    font-variant-caps: petite-caps;
    font-size: 1.2em;
    color: var(--mud-palette-primary-lighten);
}

.md-h6 {
    font-variant-caps: petite-caps;
    font-size: 1.1em;
    color: var(--mud-palette-primary-lighten);
}

.purple-circle {
    padding-left: 2em;
    color: var(--mud-palette-text-secondary);
}

.mud-appbar-no-gutters > .mud-toolbar-gutters {
    padding-left: 0px;
    padding-right: 0px;
}

.mud-skeleton {
    background-color: var(--mud-palette-divider);
}

.mud-dialog {
    max-width: 500px;
    width: 100%;
    overflow-y: auto;
}

.mud-dialog-container.mud-dialog-bottomcenter {
    padding-bottom: 0px;
}

.mud-tabs-panels {
    height: 100%;
    background: var(--mud-palette-background-gray);
    display: block !important;
    overflow-y: auto;
    overflow-x: hidden;
}

.ms-remove {
    opacity: 0;
    height: 0;
    padding: 0;
    transition: all 0.5s ease-out;
}

.superhidden {
    display: none !important;
}

.disabled-color {
    color: #808080;
}

.share-border {
    border-left-color: #765D9E;
    border-left-style: inherit;
    border-left-width: 8px;
}

.border-selection-highlight {
    border: 0px solid #F70E95;
}

.border-selection-highlight:hover {
    border-width: 3px;
}

.border-selection-highlight:active {
    border-width: 3px;
}

.border-selection-highlight:checked {
    border: 3px solid #765D9E;
}

.button-app-bar-top {
    margin-left: 2px;
    width: 42px;
}

.button-app-bar-top > button {
    width: 42px;
    height: 42px;
    padding: 12px !important;
    box-shadow: none;
    background: transparent;
    transition: border-radius 0.25s ease-in-out, margin-bottom 0.25s ease-in-out;
}

.button-app-bar-top > button[aria-pressed="true"] {
    background: var(--mud-palette-surface) !important;
    border-radius: 10px 10px 0 0;
    margin-bottom: -6px;
}

.button-app-bar-top > button[aria-pressed="true"] > span > span {
    font-family: FABold;
}

.button-app-bar-top > button:hover {
    background: var(--mud-palette-primary) !important;
}

.row-selection-highlight {
    color: var(--mud-palette-text-primary);
    background-color: var(--mud-palette-surface);
}

.row-selection-highlight:hover {
    color: var(--mud-palette-secondary-text);
    background-color: var(--mud-palette-secondary);
}

.row-selection-highlight:active {
    color: var(--mud-palette-secondary-text);
    background-color: var(--mud-palette-secondary-lighten);
}

.row-selection-highlight:checked {
    color: var(--mud-palette-dark-text);
    background-color: var(--mud-palette-dark);
}

[type=radio]:checked + .border-selection-highlight {
    border-width: 3px;
}

.borderless-dialog {
    overflow: hidden;
    background: var(--mud-palette-appbar-background);
}

.borderless-dialog > .mud-dialog-title {
    padding: 0px;
}

.borderless-dialog > .outline-none {
    overflow: hidden;
    height: 100%;
}

.borderless-dialog > .outline-none > div > .mud-dialog-content {
    padding: 0px;
    height: var(--viewport-height-wtb);
    max-width: 500px;
}

.mudtextfield-fullheight1 {
    height: calc(var(--viewport-height-wtb) - 48px);
    width: 100%;
}

.mudtextfield-fullheight1 > div:first-child {
    height: 100%;
}

.mudtextfield-fullheight1 > div:first-child > div {
    height: 100%;
}

.mudtextfield-fullheight1 > div:first-child > div > textarea {
    height: calc(100% - 23px) !important;
}

.ms-autofit {
    height: 100%;
}

.center {
    align-items: center;
}

.outlined-full {
    margin-top: 0px;
}

.outlined-full > div > div > .mud-input-outlined-border {
    background: #00000036 !important;
    border-width: 0px !important;
}

.outlined-full > div > div > input {
    padding: 10px !important;
}

.outlined-full > div > div > .mud-input-slot {
    padding: 10px !important;
}

.element-expanded {
    width: calc(100% - 14px);
    transition: width 0.2s ease-in-out;
}

.mud-chip > .fa {
    margin-left: -4px;
    margin-right: 4px;
    margin-inline-start: -4px;
    margin-inline-end: 4px;
    color: inherit;
}

.mud-chip-textless > .mud-chip > .mud-chip-icon {
    margin: 0px;
}

.mud-chip-textless > .mud-chip > .fa {
    margin: 0px;
}

.mud-chip-textless > .mud-chip > .mud-chip-content {
    content-visibility: hidden;
    visibility: collapse;
    opacity: 0;
    max-width: 0;
}

.mud-carousel > div > div > div > button > span > svg {
    height: 12px;
    width: 12px;
    filter: drop-shadow(0px 0px 4px white);
}

.mud-carousel > div > div > .d-flex.justify-center {
    background-color: var(--mud-palette-dark-lighten);
    border-radius: 12px;
    align-self: center;
    padding: 2px;
}

.mud-carousel > div > div {
    justify-content: center;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.mud-carousel > div > div > div > button {
    padding: 0px;
}

.mud-icon-button {
    border-radius: 4px;
}

.mud-container {
    padding-left: 0px;
    padding-right: 0px;
}

.mud-container > .mud-grid-spacing-xs-3 {
    width: inherit;
    margin: inherit;
}

.mud-grid-spacing-xs-1 {
    width: calc(100% + 2px);
    margin: -1px;
}

.mud-grid-spacing-xs-1 > .mud-grid-item {
    padding: 1px;
}

.mud-file-upload > mud-input-control-input-container {
    max-height: 100%;
    max-width: 100%;
}

.ms-user-profile-image {
    width: 100px !important;
    height: 100px !important;
    border-radius: 50%;
    border-width: 4px;
    border-color: var(--mud-palette-tertiary);
}

.ms-user-profile-image-small {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
    border-width: 2px;
    border-color: var(--mud-palette-tertiary) !important;
}

.ms-things-profile-image {
    width: 100px !important;
    height: 100px !important;
    border-radius: 10px;
}

.ms-badge-cirle > .mud-badge-wrapper {
    width: 75%;
    height: 75%;
    transform: translate(25%, 25%);
}

.ms-progressbar-default-fileupload {
    width: 100%;
    height: 100%;
    overflow: hidden;
    visibility: visible;
    opacity: 1;
    border-color: transparent;
    mix-blend-mode: plus-lighter;
    pointer-events: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.ms-progressbar-default-fileupload > .mud-progress-linear-bars {
    filter: blur(10px);
}

.ms-disabled {
    pointer-events: none !important;
    filter: grayscale(1) brightness(0.5) !important;
    cursor: default !important;
}

.ms-background-image {
    position: absolute;
    height: 132px;
    width: 100%;
    object-fit: cover;
    mix-blend-mode: color-dodge;
    border-color: var(--mud-palette-primary);
}

.ms-overlay {
    background: var(--mud-palette-overlay-dark);
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
}

.ms-usercontent-post-mediaview {
    box-shadow: var(--mud-elevation-2);
    margin: 10px;
    border-radius: 12px;
}

.ms-usercontent-accessories {
    margin-top: 15px;
    height: 36px;
    padding-left: 16px;
    padding-right: 14px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}

.ms-usercontent-accessories > div {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    width: 80px;
    color: #808080;
}

.ms-usercontent-accessories > div > .fa-symbol {
    font-family: FARegular;
    align-items: center;
    font-size: 20px;
    text-decoration: none;
    color: #808080;
    display: flex;
}

.ms-usercontent-accessories > div > div:last-child {
    margin-left: 10px;
}

.ms-scale:active {
    transform: scale(1.1);
}

.autosize-tab > .mud-tabs-toolbar {
    width: 100% !important;
    background: transparent;
}

.autosize-tab > .mud-tabs-toolbar > .mud-tabs-toolbar-inner > .mud-tabs-toolbar-content > .mud-tabs-toolbar-wrapper > .mud-tooltip-root > .mud-tab {
    min-width: 80px !important;
}

.fa-message-smile:before {
    content: "\f4aa";
}

.fa,
.far,
.fas {
    font-family: FARegular;
}

.fa,
.fas {
    font-weight: normal;
    width: auto;
}

.fab {
    font-family: FABold;
}

.fa-brands {
    font-family: FABrands;
}

.fa-bold {
    font-family: FABold !important;
    color: #F70E95 !important;
}

.fa-symbol {
    font-family: FARegular;
    align-items: center;
    font-size: 20px;
    text-decoration: none;
    color: #808080;
}

.disabled-color {
    color: var(--mud-palette-action-disabled);
}

span.fa-gamepad.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-home.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-search.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-calendar-minus.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-comment-alt.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-bell.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

span.fa-plus-square.mud-icon-root {
    width: unset;
    height: unset;
    font-family: FARegular;
}

.textnowrap {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

small {
    font-family: var(--mud-typography-default-family);
}

.mud-link {
    text-decoration: none;
    color: var(--mud-palette-tertiary-lighten) !important;
    vertical-align: middle;
}

.mud-link:hover {
    text-decoration: underline !important;
    color: var(--mud-palette-primary-lighten) !important;
    vertical-align: middle;
}

.hex-color-inline {
    vertical-align: text-bottom;
    border-radius: 12px;
    padding-left: 8px;
    padding-right: 8px;
}

code {
    color: var(--mud-palette-info-lighten);
    border-radius: 4px;
    background: var(--mud-palette-dark-darken);
    padding-left: 5px;
    padding-right: 5px;
}

pre {
    /*color: var(--mud-palette-info-lighten);*/
    margin-bottom: 0px;
}

.btn-clear {
    margin: 0px;
    background: #00000000;
    color: #808080;
    border: 0px;
    box-shadow: unset;
}

.ms-usercontent-body {
    background: var(--mud-palette-background);
    color: var(--mud-palette-text);
    margin-bottom: 6px;
}

.very-dense-input {
    margin-right: 5px;
}

.very-dense-input > input {
    border: none !important;
    outline: none !important;
    min-width: 75px !important;
    width: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.mediainput-container {
    z-index: 1000;
    align-items: stretch;
    margin: 0px;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 0px;
    padding-bottom: 0px;
    min-height: 46px;
    transition: margin 225ms cubic-bezier(0, 0, 0.2, 1) 0ms, width 225ms cubic-bezier(0, 0, 0.2, 1) 0ms;
    color: var(--mud-palette-appbar-text);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.mediainput-textarea {
    font: inherit;
    color: var(--mud-palette-dark-text);
    width: 100%;
    border: 0;
    padding: 0;
    display: block;
    max-height: 206px;
    min-width: 0;
    background: none;
    position: relative;
    box-sizing: content-box;
    letter-spacing: inherit;
    -webkit-tap-highlight-color: transparent;
    height: auto;
    resize: none;
    cursor: auto;
}

.mediainput-textarea::placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea::-webkit-input-placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea:-moz-placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea::-moz-placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea:-ms-input-placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea::-ms-input-placeholder {
    color: var(--mud-palette-dark-text);
    opacity: 0.42;
    transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.mediainput-textarea:focus {
    outline: 0;
}

.mediainput-textarea:invalid {
    box-shadow: none;
}

.mediainput-textarea:disabled {
    opacity: 1;
}

.mediainput-textarea:focus {
    color: var(--mud-palette-dark-text);
    background: transparent;
    border: 0px;
}

.mediainput-textarea[type="text"] {
    flex: 1;
    border: none;
    font-size: 16px;
    padding: 10px;
}

.mediainput-panel {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow: hidden;
}

.mediainput-input-box {
    display: flex;
    width: 100%;
    min-height: 32px;
    padding-left: 14px;
    padding-top: 8px;
    padding-bottom: 0px;
    padding-right: 0px;
    margin-top: 4px;
    margin-bottom: 4px;
    border-radius: 15px;
    border: 0px;
    background-color: var(--mud-palette-dark-lighten);
    transition: width 0.2s ease-in-out;
}

.mediainput-button > button:focus {
    margin: 0px;
    background: #00000000;
    color: #FDFDFF;
    border: 0px;
    box-shadow: unset;
}

.mediainput-button > button:hover {
    margin: 0px;
    background: #00000000;
    color: #FDFDFF;
    border: 0px;
    box-shadow: unset;
}

.mediainput-button {
    margin: 0px;
    background: #00000000;
    color: #808080;
    border: 0px;
    box-shadow: unset;
    margin-bottom: 4px;
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    font-size: 16px;
    padding: 0px;
    align-self: flex-end;
}

.mediainput-button-send {
    transition: transform 0.2s ease-in-out;
    color: var(--mud-palette-primary);
    transform: translateX(100%);
    visibility: hidden;
    border-radius: 50%;
    width: 0;
    min-width: 0;
}

.mediainput-left-toolbox {
    transition: transform 0.2s ease-in-out;
    color: var(--mud-palette-primary);
    transform: translateX(0%);
    visibility: visible;
    width: auto;
    min-width: auto;
}

.mediainput-toolbox-expand-button {
    transition: transform 0.2s ease-in-out;
    transform: translateX(-100%);
    visibility: hidden;
    min-width: 0px;
    width: 0px;
}

.has-content > .mediainput-button-send {
    transform: translateX(0);
    visibility: visible;
    width: 32px;
    min-width: 32px;
}

.hide-toolbox > .mediainput-left-toolbox {
    transform: translateX(-100%);
    visibility: hidden;
    width: 0px;
}

.hide-toolbox > .mediainput-toolbox-expand-button {
    transform: translateX(0);
    visibility: visible;
    min-width: 24px;
    width: 24px;
}

.mediainput-emoji-button {
    border: 0;
    background: var(--mud-palette-dark-lighten);
    color: var(--mud-palette-text-primary);
    border-radius: 8px;
    width: 32px;
    height: 32px;
    padding: 0;
    font-size: 18px;
    line-height: 1;
}

.mediainput-emoji-button:hover {
    background: var(--mud-palette-action-default-hover);
}

.scanlines-effect {
    background-image: url('/images/preview.png'), radial-gradient(#aabbaa, #000), repeating-linear-gradient(transparent 0, rgba(0, 0, 0, 0.6) 3px, transparent 3px);
    background-size: cover;
    background-position: center;
    background-blend-mode: overlay;
    padding: 0px;
}

.bokeh-effect {
    margin: 0 auto;
    mix-blend-mode: screen;
    filter: sepia(0.6) blur(7px);
    background: radial-gradient(2.63200958px at 697.8249529px 771.64538846px, rgba(220, 117, 255, 0.38925895), rgba(220, 117, 255, 0.38925895) 96%, transparent), radial-gradient(51.20029018px at 865.66878667px 66.74347924px, rgba(220, 160, 255, 0.0565375), rgba(220, 160, 255, 0.0565375) 96%, transparent), radial-gradient(48.83850591px at 21.72194884px 855.36609444px, rgba(220, 255, 255, 0.72410431), rgba(220, 255, 255, 0.72410431) 96%, transparent), radial-gradient(18.27896515px at 513.18020337px 575.48151292px, rgba(220, 230, 240, 0.50985841), rgba(220, 230, 240, 0.50985841) 96%, transparent), radial-gradient(45.93832401px at 212.66065099px 692.53985596px, rgba(220, 255, 255, 0.35769609), rgba(220, 255, 255, 0.35769609) 96%, transparent), radial-gradient(55.54932112px at 331.41325187px 1128.62153395px, rgba(220, 182, 231, 0.12640661), rgba(220, 182, 231, 0.12640661) 96%, transparent), radial-gradient(6.2616419px at 521.41801552px 90.90848953px, rgba(220, 126, 255, 0.40867302), rgba(220, 126, 255, 0.40867302) 96%, transparent), radial-gradient(55.13819027px at 309.48165137px 895.09865177px, rgba(220, 255, 255, 0.14581822), rgba(220, 255, 255, 0.14581822) 96%, transparent), radial-gradient(33.09495248px at 406.02626101px 99.6256554px, rgba(220, 163, 255, 0.57606464), rgba(220, 163, 255, 0.57606464) 96%, transparent), radial-gradient(40.87345859px at 1062.69441084px 514.16131931px, rgba(220, 84, 209, 0.0694244), rgba(220, 84, 209, 0.0694244) 96%, transparent), radial-gradient(38.77486369px at 570.54845457px 639.97125565px, rgba(220, 255, 255, 0.10445506), rgba(220, 255, 255, 0.10445506) 96%, transparent), radial-gradient(0.72096957px at 228.14957032px 336.56565498px, rgba(220, 216, 255, 0.14106945), rgba(220, 216, 255, 0.14106945) 96%, transparent), radial-gradient(0.15276836px at 351.35842634px 317.77840197px, rgba(220, 208, 255, 0.53570223), rgba(220, 208, 255, 0.53570223) 96%, transparent), radial-gradient(54.49780789px at 627.02626113px 767.09344026px, rgba(220, 255, 209, 0.18540466), rgba(220, 255, 209, 0.18540466) 96%, transparent), radial-gradient(58.3847467px at 856.78835397px 1068.44983189px, rgba(220, 212, 237, 0.98664072), rgba(220, 212, 237, 0.98664072) 96%, transparent), radial-gradient(1.67356178px at 710.80798445px 795.32693243px, rgba(220, 182, 255, 0.39350027), rgba(220, 182, 255, 0.39350027) 96%, transparent), radial-gradient(7.23205353px at 17.83566968px 522.18581873px, rgba(220, 255, 202, 0.2624833), rgba(220, 255, 202, 0.2624833) 96%, transparent), radial-gradient(28.94752391px at 935.50751031px 28.77055082px, rgba(220, 243, 255, 0.75295436), rgba(220, 243, 255, 0.75295436) 96%, transparent), radial-gradient(7.87874675px at 766.07214039px 155.73572728px, rgba(220, 201, 255, 0.89647329), rgba(220, 201, 255, 0.89647329) 96%, transparent), radial-gradient(40.06141521px at 278.31615058px 491.33290875px, rgba(220, 255, 211, 0.4620137), rgba(220, 255, 211, 0.4620137) 96%, transparent), radial-gradient(3.10444118px at 924.8169292px 419.71572451px, rgba(220, 255, 255, 0.12802753), rgba(220, 255, 255, 0.12802753) 96%, transparent), radial-gradient(24.56622856px at 1012.00499225px 282.2152393px, rgba(220, 128, 255, 0.10187637), rgba(220, 128, 255, 0.10187637) 96%, transparent), radial-gradient(32.0634961px at 507.04438021px 751.45172141px, rgba(220, 116, 255, 0.9771539), rgba(220, 116, 255, 0.9771539) 96%, transparent), radial-gradient(44.19450922px at 914.54532637px 150.75851063px, rgba(220, 99, 255, 0.3006721), rgba(220, 99, 255, 0.3006721) 96%, transparent), radial-gradient(59.35428137px at 1148.21323835px 750.68087535px, rgba(220, 146, 242, 0.27307966), rgba(220, 146, 242, 0.27307966) 96%, transparent), radial-gradient(3.78610966px at 1072.4550412px 48.55141568px, rgba(220, 255, 255, 0.91182562), rgba(220, 255, 255, 0.91182562) 96%, transparent), radial-gradient(4.32657426px at 632.15317868px 1101.47659685px, rgba(220, 255, 255, 0.58657172), rgba(220, 255, 255, 0.58657172) 96%, transparent), radial-gradient(46.70146561px at 773.37722108px 1001.85452142px, rgba(220, 255, 215, 0.98859692), rgba(220, 255, 215, 0.98859692) 96%, transparent), radial-gradient(7.55965419px at 1173.52414142px 223.22673212px, rgba(220, 255, 255, 0.56099314), rgba(220, 255, 255, 0.56099314) 96%, transparent), radial-gradient(14.46538164px at 325.40889309px 1098.31317511px, rgba(220, 148, 255, 0.44351382), rgba(220, 148, 255, 0.44351382) 96%, transparent), radial-gradient(16.69091675px at 373.19197457px 27.58127001px, rgba(220, 226, 255, 0.95652266), rgba(220, 226, 255, 0.95652266) 96%, transparent), radial-gradient(40.03925097px at 938.07579753px 509.30429311px, rgba(220, 98, 255, 0.49617192), rgba(220, 98, 255, 0.49617192) 96%, transparent), radial-gradient(53.14139569px at 673.22698408px 956.75534674px, rgba(220, 110, 255, 0.83315925), rgba(220, 110, 255, 0.83315925) 96%, transparent), radial-gradient(41.60588479px at 157.69962298px 93.24138241px, rgba(220, 131, 225, 0.82879458), rgba(220, 131, 225, 0.82879458) 96%, transparent), radial-gradient(35.9823153px at 566.12937393px 220.60558404px, rgba(220, 122, 218, 0.78475416), rgba(220, 122, 218, 0.78475416) 96%, transparent), radial-gradient(55.80703372px at 1093.93686115px 309.93951859px, rgba(220, 232, 255, 0.92570813), rgba(220, 232, 255, 0.92570813) 96%, transparent), radial-gradient(24.65536661px at 1079.38334252px 164.70589731px, rgba(220, 245, 255, 0.98755739), rgba(220, 245, 255, 0.98755739) 96%, transparent), radial-gradient(57.43210761px at 425.48224919px 840.86023979px, rgba(220, 123, 255, 0.8127549), rgba(220, 123, 255, 0.8127549) 96%, transparent), radial-gradient(31.18405077px at 927.93959574px 325.01664479px, rgba(220, 255, 255, 0.68309463), rgba(220, 255, 255, 0.68309463) 96%, transparent), radial-gradient(35.55676606px at 984.02333186px 322.05233738px, rgba(220, 217, 246, 0.93381073), rgba(220, 217, 246, 0.93381073) 96%, transparent), radial-gradient(17.17675989px at 1063.54906739px 295.99164681px, rgba(220, 111, 227, 0.44980004), rgba(220, 111, 227, 0.44980004) 96%, transparent), radial-gradient(11.06149284px at 816.08703294px 126.26847388px, rgba(220, 255, 255, 0.34771017), rgba(220, 255, 255, 0.34771017) 96%, transparent), radial-gradient(28.4757388px at 561.04590137px 1031.06658453px, rgba(220, 208, 255, 0.07781901), rgba(220, 208, 255, 0.07781901) 96%, transparent), radial-gradient(39.44506404px at 808.92449189px 305.70005509px, rgba(220, 255, 205, 0.03694078), rgba(220, 255, 205, 0.03694078) 96%, transparent), radial-gradient(35.20872332px at 141.81473762px 821.36137295px, rgba(220, 255, 212, 0.88168373), rgba(220, 255, 212, 0.88168373) 96%, transparent), radial-gradient(21.43727221px at 1147.46821271px 483.69151832px, rgba(220, 255, 224, 0.62279409), rgba(220, 255, 224, 0.62279409) 96%, transparent), radial-gradient(23.85936841px at 690.19021818px 1121.79495336px, rgba(220, 164, 255, 0.64345745), rgba(220, 164, 255, 0.64345745) 96%, transparent), radial-gradient(42.92393191px at 384.44310209px 646.4240205px, rgba(220, 250, 255, 0.95422706), rgba(220, 250, 255, 0.95422706) 96%, transparent), radial-gradient(43.5813784px at 1020.67836375px 72.98018031px, rgba(220, 228, 255, 0.53245598), rgba(220, 228, 255, 0.53245598) 96%, transparent), radial-gradient(44.60501492px at 11.30403337px 728.41975504px, rgba(220, 255, 255, 0.34211199), rgba(220, 255, 255, 0.34211199) 96%, transparent), radial-gradient(11.833387px at 72.56029232px 409.45478661px, rgba(220, 255, 249, 0.03145334), rgba(220, 255, 249, 0.03145334) 96%, transparent), radial-gradient(57.42413393px at 1183.66608374px 657.9335007px, rgba(220, 164, 255, 0.6865738), rgba(220, 164, 255, 0.6865738) 96%, transparent), radial-gradient(16.46399085px at 543.41561143px 668.23521593px, rgba(220, 148, 255, 0.2559242), rgba(220, 148, 255, 0.2559242) 96%, transparent), radial-gradient(9.55782482px at 1.11301675px 1007.22184077px, rgba(220, 255, 247, 0.64810456), rgba(220, 255, 247, 0.64810456) 96%, transparent), radial-gradient(48.73777491px at 311.35034531px 64.80638997px, rgba(220, 141, 223, 0.15440312), rgba(220, 141, 223, 0.15440312) 96%, transparent), radial-gradient(54.04828273px at 387.91140939px 307.09647565px, rgba(220, 239, 255, 0.99718618), rgba(220, 239, 255, 0.99718618) 96%, transparent), radial-gradient(32.70017541px at 445.00224909px 150.08639699px, rgba(220, 191, 255, 0.89468515), rgba(220, 191, 255, 0.89468515) 96%, transparent), radial-gradient(59.74976007px at 619.42850774px 197.78213258px, rgba(220, 224, 255, 0.39911825), rgba(220, 224, 255, 0.39911825) 96%, transparent), radial-gradient(17.82411964px at 845.58297806px 105.45615149px, rgba(220, 219, 247, 0.54070131), rgba(220, 219, 247, 0.54070131) 96%, transparent), radial-gradient(8.2694135px at 788.1679663px 25.13645488px, rgba(220, 200, 206, 0.90304084), rgba(220, 200, 206, 0.90304084) 96%, transparent), radial-gradient(23.04922189px at 286.24744549px 1065.80840131px, rgba(220, 195, 254, 0.94641445), rgba(220, 195, 254, 0.94641445) 96%, transparent), radial-gradient(45.49666897px at 329.71273484px 176.53035626px, rgba(220, 255, 209, 0.58746413), rgba(220, 255, 209, 0.58746413) 96%, transparent), radial-gradient(41.88574713px at 306.03681092px 402.92424897px, rgba(220, 191, 255, 0.67992749), rgba(220, 191, 255, 0.67992749) 96%, transparent), radial-gradient(16.28304568px at 601.11942681px 876.98142435px, rgba(220, 228, 213, 0.59783913), rgba(220, 228, 213, 0.59783913) 96%, transparent), radial-gradient(13.00445123px at 838.04286656px 575.30493684px, rgba(220, 106, 255, 0.73169614), rgba(220, 106, 255, 0.73169614) 96%, transparent), radial-gradient(33.11282535px at 403.43024139px 1043.78223153px, rgba(220, 135, 216, 0.06992271), rgba(220, 135, 216, 0.06992271) 96%, transparent), radial-gradient(33.96445484px at 149.41391498px 183.36620191px, rgba(220, 255, 211, 0.46565659), rgba(220, 255, 211, 0.46565659) 96%, transparent), radial-gradient(31.28683591px at 671.0073176px 1099.92783721px, rgba(220, 255, 217, 0.16744381), rgba(220, 255, 217, 0.16744381) 96%, transparent), radial-gradient(35.41384357px at 883.43215598px 1193.15512212px, rgba(220, 119, 255, 0.29425842), rgba(220, 119, 255, 0.29425842) 96%, transparent), radial-gradient(11.63191828px at 750.87655614px 91.58070201px, rgba(220, 148, 235, 0.01512593), rgba(220, 148, 235, 0.01512593) 96%, transparent), radial-gradient(7.9803373px at 189.63476877px 374.32812767px, rgba(220, 255, 229, 0.09370707), rgba(220, 255, 229, 0.09370707) 96%, transparent), radial-gradient(27.11760694px at 1057.31807299px 764.52086334px, rgba(220, 255, 255, 0.60742565), rgba(220, 255, 255, 0.60742565) 96%, transparent), radial-gradient(36.58413743px at 1172.23142289px 422.0667221px, rgba(220, 88, 244, 0.95943209), rgba(220, 88, 244, 0.95943209) 96%, transparent), radial-gradient(20.35051459px at 7.0373854px 770.83954093px, rgba(220, 148, 255, 0.70674088), rgba(220, 148, 255, 0.70674088) 96%, transparent), radial-gradient(36.86437175px at 206.24815336px 941.34585767px, rgba(220, 255, 255, 0.63242097), rgba(220, 255, 255, 0.63242097) 96%, transparent), radial-gradient(41.46001146px at 52.09366409px 1114.8580079px, rgba(220, 198, 255, 0.62817734), rgba(220, 198, 255, 0.62817734) 96%, transparent), radial-gradient(51.74094202px at 466.13111366px 1104.06908927px, rgba(220, 234, 255, 0.54167013), rgba(220, 234, 255, 0.54167013) 96%, transparent), radial-gradient(43.84968589px at 577.61696437px 675.5025835px, rgba(220, 243, 224, 0.98950451), rgba(220, 243, 224, 0.98950451) 96%, transparent), radial-gradient(26.79757118px at 109.37575051px 374.60978045px, rgba(220, 121, 201, 0.54983087), rgba(220, 121, 201, 0.54983087) 96%, transparent), radial-gradient(34.32328082px at 113.14999253px 889.47132355px, rgba(220, 230, 255, 0.29932814), rgba(220, 230, 255, 0.29932814) 96%, transparent), radial-gradient(16.15041261px at 925.6964412px 56.70154852px, rgba(220, 115, 255, 0.64522745), rgba(220, 115, 255, 0.64522745) 96%, transparent), radial-gradient(6.30400972px at 1048.07988892px 689.48998511px, rgba(220, 85, 255, 0.7116323), rgba(220, 85, 255, 0.7116323) 96%, transparent), radial-gradient(17.4278184px at 414.5072361px 350.60725416px, rgba(220, 156, 255, 0.54242952), rgba(220, 156, 255, 0.54242952) 96%, transparent), radial-gradient(19.5135636px at 805.43212345px 1003.95114649px, rgba(220, 179, 255, 0.34560273), rgba(220, 179, 255, 0.34560273) 96%, transparent), radial-gradient(43.57761213px at 1067.18168847px 843.11355293px, rgba(220, 255, 255, 0.93541942), rgba(220, 255, 255, 0.93541942) 96%, transparent), radial-gradient(50.78959648px at 1159.4333138px 489.00665476px, rgba(220, 83, 255, 0.37768061), rgba(220, 83, 255, 0.37768061) 96%, transparent), radial-gradient(18.31565239px at 50.30248186px 670.94532907px, rgba(220, 113, 211, 0.56708522), rgba(220, 113, 211, 0.56708522) 96%, transparent), radial-gradient(4.63824762px at 363.38076516px 610.76343433px, rgba(220, 255, 255, 0.96530472), rgba(220, 255, 255, 0.96530472) 96%, transparent), radial-gradient(6.80429314px at 1159.77927791px 26.45544099px, rgba(220, 168, 210, 0.17309301), rgba(220, 168, 210, 0.17309301) 96%, transparent), radial-gradient(9.26731905px at 38.50422079px 772.68155259px, rgba(220, 222, 214, 0.1744239), rgba(220, 222, 214, 0.1744239) 96%, transparent), radial-gradient(18.487112px at 223.06206721px 1179.24923015px, rgba(220, 175, 255, 0.74718577), rgba(220, 175, 255, 0.74718577) 96%, transparent), radial-gradient(29.71414709px at 489.12999689px 426.29403571px, rgba(220, 255, 232, 0.59209729), rgba(220, 255, 232, 0.59209729) 96%, transparent), radial-gradient(6.50204377px at 233.79300449px 515.66108709px, rgba(220, 227, 222, 0.64120031), rgba(220, 227, 222, 0.64120031) 96%, transparent), radial-gradient(3.25421367px at 890.41812681px 241.19918535px, rgba(220, 124, 255, 0.41437556), rgba(220, 124, 255, 0.41437556) 96%, transparent), radial-gradient(55.00957229px at 50.14680545px 463.22500864px, rgba(220, 255, 236, 0.45281001), rgba(220, 255, 236, 0.45281001) 96%, transparent), radial-gradient(57.16684691px at 25.58020068px 918.23518882px, rgba(220, 185, 255, 0.40099691), rgba(220, 185, 255, 0.40099691) 96%, transparent), radial-gradient(21.81509786px at 950.28305197px 853.8419911px, rgba(220, 255, 255, 0.58290482), rgba(220, 255, 255, 0.58290482) 96%, transparent), radial-gradient(47.79042664px at 111.99604584px 507.90115276px, rgba(220, 235, 255, 0.77692362), rgba(220, 235, 255, 0.77692362) 96%, transparent), radial-gradient(17.27339821px at 1028.019144px 514.05873262px, rgba(220, 129, 255, 0.24620275), rgba(220, 129, 255, 0.24620275) 96%, transparent), radial-gradient(39.63700435px at 838.04901129px 479.3121086px, rgba(220, 96, 255, 0.15859824), rgba(220, 96, 255, 0.15859824) 96%, transparent), radial-gradient(9.41792316px at 596.36849728px 1177.29659169px, rgba(220, 190, 255, 0.63930193), rgba(220, 190, 255, 0.63930193) 96%, transparent), radial-gradient(3.22658645px at 72.83742413px 1089.35307236px, rgba(220, 215, 207, 0.49194752), rgba(220, 215, 207, 0.49194752) 96%, transparent), radial-gradient(24.75511586px at 531.87516961px 173.69445445px, rgba(220, 255, 255, 0.9518611), rgba(220, 255, 255, 0.9518611) 96%, transparent), radial-gradient(13.57399271px at 1062.82482114px 1012.1928763px, rgba(220, 119, 255, 0.14157184), rgba(220, 119, 255, 0.14157184) 96%, transparent), radial-gradient(3.62975401px at 141.62156169px 567.28926765px, rgba(220, 148, 201, 0.41334953), rgba(220, 148, 201, 0.41334953) 96%, transparent), radial-gradient(40.8256636px at 951.52754183px 826.24380545px, rgba(220, 117, 228, 0.98106896), rgba(220, 117, 228, 0.98106896) 96%, transparent), radial-gradient(22.39086516px at 674.19368292px 768.32205562px, rgba(220, 216, 234, 0.74616004), rgba(220, 216, 234, 0.74616004) 96%, transparent), radial-gradient(17.13828511px at 69.25093509px 746.38993939px, rgba(220, 255, 255, 0.34473303), rgba(220, 255, 255, 0.34473303) 96%, transparent), radial-gradient(42.95714688px at 568.97972991px 828.6299938px, rgba(220, 236, 255, 0.9749379), rgba(220, 236, 255, 0.9749379) 96%, transparent), radial-gradient(25.74549774px at 277.27504698px 793.47481712px, rgba(220, 255, 251, 0.27540218), rgba(220, 255, 251, 0.27540218) 96%, transparent), radial-gradient(35.92514996px at 209.03201766px 1094.40885px, rgba(220, 255, 255, 0.01307648), rgba(220, 255, 255, 0.01307648) 96%, transparent), radial-gradient(31.3687653px at 81.37675872px 229.31680328px, rgba(220, 240, 255, 0.32311683), rgba(220, 240, 255, 0.32311683) 96%, transparent), radial-gradient(19.48522873px at 829.48343452px 281.0980574px, rgba(220, 206, 255, 0.59882668), rgba(220, 206, 255, 0.59882668) 96%, transparent), radial-gradient(42.96956335px at 23.27406548px 462.99874562px, rgba(220, 204, 255, 0.19201918), rgba(220, 204, 255, 0.19201918) 96%, transparent), radial-gradient(13.79539717px at 698.82452865px 982.04948806px, rgba(220, 101, 240, 0.16030258), rgba(220, 101, 240, 0.16030258) 96%, transparent), radial-gradient(45.22198755px at 1007.35917763px 677.16729998px, rgba(220, 222, 255, 0.10185746), rgba(220, 222, 255, 0.10185746) 96%, transparent), radial-gradient(28.72809119px at 770.11405167px 614.99710563px, rgba(220, 152, 255, 0.71610909), rgba(220, 152, 255, 0.71610909) 96%, transparent), radial-gradient(10.00528829px at 340.72110372px 613.38313265px, rgba(220, 97, 255, 0.28022117), rgba(220, 97, 255, 0.28022117) 96%, transparent), radial-gradient(39.40844168px at 506.72250299px 98.6689306px, rgba(220, 180, 215, 0.8016332), rgba(220, 180, 215, 0.8016332) 96%, transparent), radial-gradient(54.44890579px at 206.46130724px 29.63944787px, rgba(220, 110, 255, 0.88012876), rgba(220, 110, 255, 0.88012876) 96%, transparent);
}

.block-inputs {
    pointer-events: none;
    position: relative;
    filter: blur(0.7px);
    filter: drop-shadow(4px 4px 12px black) blur(ß.8px);
}

.block-inputs::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 120%;
    height: 140%;
    background: linear-gradient(45deg, rgba(255, 255, 255, 0.1) 60%, rgba(255, 255, 255, 0.8) 100%);
    transform: rotate(-10deg);
    pointer-events: none;
    z-index: 1;
    filter: blur(40px);
    mix-blend-mode: luminosity;
}

.nicEdit-panelContain {
    border: 0 !important;
    background-color: transparent !important;
}

.nicEdit-main {
    font-size: 14px;
    color: var(--mud-primary-text-color);
    background-color: var(--mud-primary-color);
    border: none;
}

.nicEdit-panel {
    background-color: var(--mud-palette-dark-lighten) !important;
    border: 0 !important;
    border-radius: 3px;
    box-shadow: none;
    padding: 4px;
}

.nicEdit-panel > div {
    border: 0 !important;
}

.nicEdit-panel > div > nicEdit-buttonContain {
    border: 0 !important;
}

.nicEdit-panel > div > nicEdit-selectContain {
    border: 0 !important;
    height: 30px !important;
}

.nicEdit-buttonContain > div {
    background-color: transparent !important;
    border: 0 !important;
}

.nicEdit-selectContain > div {
    border: 1px solid var(--mud-palette-black) !important;
    background-color: transparent !important;
    border: 0 !important;
}

.nicEdit-pane {
    background-color: var(--mud-palette-dark-lighten) !important;
    border-right-color: var(--mud-palette-dark) !important;
    border-left-color: var(--mud-palette-dark) !important;
}

.nicEdit-pane > div {
    border-bottom: 1px solid var(--mud-palette-dark) !important;
}

.nicEdit-pane > div > div {
    background-color: var(--mud-palette-dark-lighten) !important;
}

.nicEdit-button {}

.nicEdit-panel button {
    background-color: var(--mud-paper);
    color: var(--mud-primary-text-color);
    border: none;
    border-radius: 3px;
    padding: 6px 12px;
    margin: 2px;
    font-size: 12px;
    cursor: pointer;
}

.nicEdit-panel button:hover {
    background-color: var(--mud-primary-color-light);
    color: var(--mud-primary-text-color);
}

.nicEdit-panel button.nicEdit-button-active {
    background-color: var(--mud-primary-color);
    color: var(--mud-primary-text-color);
}

.loading-bar-container {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.loading-image-bottom {
    filter: grayscale(1);
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.loading-image-top {
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: blur(1px) drop-shadow(1px 1px 0px #A40962);
    clip-path: inset(calc(100% - var(--blazor-load-percentage, 0%)) 0 0 0);
    transition: clip-path 0.5s ease-out;
    mix-blend-mode: hard-light;
}

.loading-console-wrap {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background:
    radial-gradient(140% 100% at 10% 0%, #101622 0%, #0a0f19 42%, #080d14 100%),
    linear-gradient(135deg, #12091a, #080d14);
}

.loading-console {
    width: min(680px, 92vw);
    border: 1px solid #1d3551;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 24px 56px #0000007a;
    background: #0b111a;
    color: #d8e3f2;
    font-family: "Consolas", "Cascadia Code", "JetBrains Mono", "Fira Code", "Courier New", monospace;
}

.loading-console-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: linear-gradient(90deg, #111d30, #10283f);
    border-bottom: 1px solid #1d3551;
    color: #9cc9ff;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.loading-console-stage {
    color: #f0a7d9;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.loading-console-body {
    padding: 14px;
    display: grid;
    gap: 10px;
}

.loading-console-line {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #b9c8dc;
    font-size: 13px;
    line-height: 1.3;
}

.loading-console-line .prompt {
    color: #5ac8fa;
    font-weight: 700;
}

.loading-progress-text {
    color: #deefff;
    font-weight: 700;
}

.loading-progress-text:after {
    content: "boot progress " var(--blazor-load-percentage-text, "...");
}

.loading-progress-bar {
    height: 10px;
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid #244466;
    background: #0b1a2a;
}

.loading-progress-bar-fill {
    height: 100%;
    width: var(--blazor-load-percentage, 0%);
    background: linear-gradient(90deg, #2ba2ff, #ce5bb1);
    box-shadow: 0 0 18px #53b8ff8a;
    transition: width .12s ease-out;
}

.mud-tab-no-header {}

.mud-tab-no-header > .mud-tabs-toolbar {
    display: none;
}

.markdown-info {
    margin-bottom: 10px;
    margin-left: 14px;
    margin-top: -14px;
    color: var(--mud-palette-info);
}

.error-image {
    margin: 16px;
    max-width: 500px;
}

.error-image > img {
    height: 300px;
    filter: drop-shadow(0 0 10px var(--mud-palette-appbar-background));
}

.chat-bubble {
    border-width: 0px;
    border-radius: 20px 4px 20px 20px;
    max-width: 70%;
    transition: border-radius 0.25s ease-in-out;
    background: var(--mud-palette-action-default-hover);
}

.chat-bubble-me {
    color: var(--mud-palette-secondary-text);
    background: linear-gradient(125deg, var(--mud-palette-secondary-lighten), var(--mud-palette-secondary), var(--mud-palette-secondary-darken));
}

.chat-bubble-others {
    color: var(--mud-palette-dark-text);
    background: linear-gradient(125deg, var(--mud-palette-dark-lighten), var(--mud-palette-dark), var(--mud-palette-dark-darken));
}

.chat-bubble-system {
    color: var(--mud-palette-warning-text);
    background: linear-gradient(125deg, var(--mud-palette-info-lighten), var(--mud-palette-info), var(--mud-palette-info-darken));
}

.chat-bubble-error {
    color: var(--mud-palette-warning-text);
    background: linear-gradient(125deg, var(--mud-palette-error-lighten), var(--mud-error-info), var(--mud-palette-error-darken));
}

.chat-bubble-emote {
    font-size: 90px;
    filter: drop-shadow(4px 4px 6px #000000a0);
}

.chat-bubble-avatar-space {
    height: 30px;
    width: 30px;
    min-width: 30px;
    margin-right: 12px !important;
    padding: 0px;
    margin: 0px;
    margin-bottom: 1px;
}

.chat-bubble-text {
    margin-left: 12px;
    margin-right: 12px;
    margin-top: 0px;
    margin-bottom: 0px;
    word-wrap: anywhere;
}

.chat-title-bar {
    color: var(--mud-palette-appbar-text);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    max-width: 500px;
    top: 0;
    position: absolute;
    background-color: var(--mud-palette-overlay-dark);
    padding-right: 6px;
    padding-left: 14px;
}

.chat-background {
    height: 100%;
    width: 100%;
    max-width: 500px;
    z-index: -9999;
    pointer-events: none;
    filter: blur(2px);
    object-fit: cover;
    position: absolute;
    opacity: 0.3;
    mix-blend-mode: soft-light;
}

.media-view-image {
    width: 100%;
    height: 100%;
    transition: width 0.25s ease-in-out, height 0.25s ease-in-out;
}

.media-view-image-thumbnail {
    object-fit: cover;
    border-radius: 10px;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 200px;
}

.ms-fab-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.ms-fab-bottom {
    position: absolute;
    top: 100%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -100%);
}

.ms-fab-top {
    position: absolute;
    top: 0%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, 0%);
}

.ms-action-pill {
    margin: 0px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.video-ph-aspect-ratio-box {
    height: 120px;
    width: 200px;
    padding-bottom: 76.398374%;
    position: relative;
    overflow: hidden;
}

.video-ph-content {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transition: transform 0.2s ease-in-out;
}

.video-ph-content:hover {
    transform: scale(1.2);
}

.md-image-link {
    max-width: 300px;
    min-height: 100px;
    display: block;
    border-radius: 10px;
    filter: drop-shadow(3px 3px 10px #000000da);
    overflow: hidden;
}

.md-image-link:active {
    transform: scale(1);
}

.md-image-link > img {
    width: 100%;
    height: 100%;
    transition: transform 0.2s ease-in-out;
}

.md-image-link:active {
    filter: invert(1);
}

.md-image-link > img:hover {
    transform: scale(1.2);
}

.thread-header {
    color: var(--mud-palette-dark-text);
    background: linear-gradient(125deg, var(--mud-palette-dark-lighten), var(--mud-palette-dark), var(--mud-palette-dark-darken));
    border-radius: 10px;
    padding: 10px;
    word-break: normal;
    word-wrap: break-word;
}

.mud-table-container > table > tbody > tr > td > p {
    margin-top: 0;
    margin-bottom: 0;
}

.mud-table-container > table > thead > tr > th > p {
    margin-top: 0;
    margin-bottom: 4px;
    font-weight: bold;
    font-variant: small-caps;
}

.mud-input-adornment-icon-button {
    height: 30px;
    width: 30px;
}

.mud-input-control-input-container{
    border-radius: var(--mud-default-borderradius);
    /* overflow: hidden; */
}


/* Define the transition effect */
.view-transition-enter-active,
.view-transition-leave-active {
    transition: opacity 0.5s;
}

.view-transition-enter,
.view-transition-leave-to /* .view-transition-leave-active in <2.1.8 */ {
    opacity: 0;
}

.avatar-profile {
    width: 32px;
    height: 32px;
    display: block;
    border-width: 2px;
    border-color: var(--mud-palette-primary);
}

.avatar-profile :hover {
    filter: contrast(0.5);
}

.profile-menu {
    background: var(--mud-palette-overlay-dark);
}

.profile-menu > .mud-list-item-text > p {
    text-transform: uppercase;
    font-weight: bolder;
    color: var(--mud-palette-primary-lighten);
}

.centered-content {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow-y: auto;
    height: 100%;
}

.centered-content > div {
    margin: 20px;
    max-width: 500px;
    width: 100%;
    margin-bottom: 50px;
}

.tool-strip-fixed-bottom {
    justify-content: center;
    position: fixed;
    z-index: 9000;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: rgba(55, 55, 64, 0.2);
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 10px;
    height: 48px;
    box-shadow: var(--mud-elevation-22);
}

.tool-strip-fixed-bottom > div {
    max-width: 500px;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.mud-slider-track-tick-label {
    transform-origin: left;
    transform: rotate(90deg) !important;
}

.invisible-anim {
    opacity: 0;
    transform: translateY(100%);
    max-height: 0;
    overflow: hidden;
    transition: transform 0.4s ease-in-out, max-height 0.4s ease-in-out;
}

.visible-anim {
    opacity: 1;
    transform: translateY(0);
    transition: transform 0.1s ease-in-out, max-height 0.1s ease-in-out;
}

.mud-table-loading { 
    background: var(--mud-palette-primary);
}

.mud-progress-linear-bar {
    background-color: var(--mud-palette-primary-darken) !important;
}

.mud-table-cell {
    min-height: 28px;
}

.mud-breadcrumbs {
    padding-bottom: 8px;
}

.mud-table-toolbar {
    padding-left: 10px;
}

@media (min-width: 599px) and (max-width: 830px) {
    .sticky-left {
        max-width: 140px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

.discord-color {
    color: #5865F2;
}

.taostats-color {
    color: rgb(0, 219, 188);
}

.github-color {
    color: rgb(9, 105, 218);
}

.child-row-content-toolbar{
    width: 100%;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 5px;
}

.child-row-content-toolbar > .mud-typography {
    font-weight: bolder;
}

.mud-input-control-input-container{
    width: 100%;
    height: 100%;
}