body {
    font-family: 'Open Sans', "Noto Sans JP";
    overflow-wrap: break-word;
}

@media only screen and (min-width: 1px) and (max-width: 991px){
    .trend {
        display:none
    }
}

div.markdown-content {
    background-color: #f5f5f5;
    padding: 10px;
    border-radius: 4px;
}

img.emoji {
    height: 1em;
    width: 1em;
    margin: 0 .05em 0 .1em;
    vertical-align: -0.1em;
}

.avatar {
    user-select: none;
}

.superTop {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #ffffff80;
    z-index: 100;
    justify-content: center;
    align-items: center;
    backdrop-filter: blur(2.7px);
    transition: 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

div.diag {
    padding: 6px;
    background-color: #ececec;
    min-width: 48%;
    border-radius: 16px;
    box-shadow: 0 0 12px #ececec;
    text-align: center;
    transform: scale(0.5);
    transition: 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

hr.diagHr {
    background-color: black;
    margin: 8px 0;
}

button.diagBtn {
    margin: 8px;
    box-shadow: 0 0 5px #0d6efd;
}

.navbar-brand, .navbar-tabs {
    display: inline-block;
    height: 31px;
}

span.errCode {
    background-color: #dddddd;
    font-family: 'Ubuntu Sans Mono', monospace;
    padding: 3px 8px;
    border-radius:6px;
}

@media (prefers-color-scheme: dark) {
    div.diag{background-color:#1f1f1f;box-shadow:0 0 12px #1f1f1f;}
    hr.diagHr{background-color:white;}
    .superTop{background-color:#00000080}
    span.errCode{background-color:#444}
}