.view-box .mud-tab .mud-tab-icon-text{
    background-image: url(https://dpangzi.com/icons/file.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-git {
    background-image: url(https://dpangzi.com/icons/git.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-md {
    background-image: url(https://dpangzi.com/icons/markdown.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-js {
    background-image: url(https://dpangzi.com/icons/javascript.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-suo {
    background-image: url(https://dpangzi.com/icons/visualstudio.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-wasm {
    background-image: url(https://dpangzi.com/icons/webassembly.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-otf {
    background-image: url(https://dpangzi.com/icons/font.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-config {
    background-image: url(https://dpangzi.com/icons/settings.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-gz {
    background-image: url(https://dpangzi.com/icons/zip.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-editorconfig {
    background-image: url(https://dpangzi.com/icons/editorconfig.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-sql {
    background-image: url(https://dpangzi.com/icons/database.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-log {
    background-image: url(https://dpangzi.com/icons/log.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-h {
    background-image: url(https://dpangzi.com/icons/h.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-html {
    background-image: url(https://dpangzi.com/icons/html.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-db {
    background-image: url(https://dpangzi.com/icons/database.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-eot {
    background-image: url(https://dpangzi.com/icons/font.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-dll {
    background-image: url(https://dpangzi.com/icons/settings.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-webp {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-csproj {
    background-image: url(https://dpangzi.com/icons/visualstudio.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-sln {
    background-image: url(https://dpangzi.com/icons/visualstudio.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-dat {
    background-image: url(https://dpangzi.com/icons/hex.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-png {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-scss {
    background-image: url(https://dpangzi.com/icons/sass.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-cs {
    background-image: url(https://dpangzi.com/icons/csharp.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-pdb {
    background-image: url(https://dpangzi.com/icons/database.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-ico {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-zip {
    background-image: url(https://dpangzi.com/icons/zip.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-http {
    background-image: url(https://dpangzi.com/icons/http.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-lock {
    background-image: url(https://dpangzi.com/icons/lock.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-exe {
    background-image: url(https://dpangzi.com/icons/exe.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-flac {
    background-image: url(https://dpangzi.com/icons/audio.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-ttf {
    background-image: url(https://dpangzi.com/icons/font.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-gif {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-br {
    background-image: url(https://dpangzi.com/icons/zip.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-ps1 {
    background-image: url(https://dpangzi.com/icons/powershell.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-jpg {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-jpeg {
    background-image: url(https://dpangzi.com/icons/image.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-woff2 {
    background-image: url(https://dpangzi.com/icons/font.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-json {
    background-image: url(https://dpangzi.com/icons/json.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-props {
    background-image: url(https://dpangzi.com/icons/settings.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-svg {
    background-image: url(https://dpangzi.com/icons/svg.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-yml {
    background-image: url(https://dpangzi.com/icons/yaml.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-dockerignore {
    background-image: url(https://dpangzi.com/icons/docker.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-bin {
    background-image: url(https://dpangzi.com/icons/hex.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-css {
    background-image: url(https://dpangzi.com/icons/css.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-txt {
    background-image: url(https://dpangzi.com/icons/document.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-cshtml {
    background-image: url(https://dpangzi.com/icons/razor.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-mp3 {
    background-image: url(https://dpangzi.com/icons/audio.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-xml {
    background-image: url(https://dpangzi.com/icons/xml.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-razor {
    background-image: url(https://dpangzi.com/icons/razor.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-woff {
    background-image: url(https://dpangzi.com/icons/font.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-vscode {
    background-image: url(https://dpangzi.com/icons/folder-vscode.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-idea {
    background-image: url(https://dpangzi.com/icons/folder-intellij.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-faviconico {
    background-image: url(https://dpangzi.com/icons/favicon.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-robotstxt {
    background-image: url(https://dpangzi.com/icons/robots.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-gitattributes {
    background-image: url(https://dpangzi.com/icons/git.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-licensetxt {
    background-image: url(https://dpangzi.com/icons/certificate.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-package-lockjson {
    background-image: url(https://dpangzi.com/icons/nodejs.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-readmemd {
    background-image: url(https://dpangzi.com/icons/readme.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-github {
    background-image: url(https://dpangzi.com/icons/folder-github.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-git {
    background-image: url(https://dpangzi.com/icons/git.svg);
}
.view-box .mud-tab .mud-tab-icon-text.icon-gitignore {
    background-image: url(https://dpangzi.com/icons/git.svg);
}

.loading-jump {
    position: relative;
    width: 50px;
    perspective: 200px;
}

.loading-jump:before,
.loading-jump:after {
    position: absolute;
    width: 20px;
    height: 20px;
    content: "";
    animation: jumping 0.5s infinite alternate;
    background: rgba(0, 0, 0, 0);
}

.loading-jump:before {
    left: 0;
}

.loading-jump:after {
    right: 0;
    animation-delay: 0.15s;
}

@keyframes jumping {
    0% {
        transform: scale(1) translateY(0px) rotateX(0deg);
        box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    }

    100% {
        transform: scale(1.2) translateY(-25px) rotateX(45deg);
        background: #00ce64;
        box-shadow: 0 25px 40px #00ce64;
    }
}

.editor {
    width: 100%;
    height: calc(100vh - 80px - 48px);
}

.readme-main {
    padding: 1em;
    height: calc(100vh - 80px - 48px);
    overflow: auto;
}

.code-tab-head .mud-tab{
    text-transform: none !important;
}

@media (prefers-color-scheme: dark) {
    body{
        color: #b2b2b2;
    }

    .sidebar div {
        background: #747ea1;
    }
}

@media (prefers-color-scheme: light){
    :not(pre)>code{
        color: #00bc0d;
        text-shadow: 0 1px rgb(97 212 102 / 30%);
    }
}

.code-toolbar .toolbar{
    display: flex;
    flex-wrap: nowrap;
    gap: 0.2em;
}

.code-toolbar .toolbar .copy-to-clipboard-button{
    vertical-align: inherit !important;
}

.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

.loading-progress circle {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 0.6rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: #1b6ec2;
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 200px + 3.25rem) 0 auto 0.2rem;
}

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