div#main {
    margin-top: 1.5em;
}
table.main {
    width: 90%;
}
th:not(:first-child) {
    text-align: center;
/*    border-left: 1px solid white;   */
    border-right: 1px solid white;
}
th {
    /* background-size: cover; */
    background-position: center;
    position: relative;
    z-index: 0;
}
span.dungeon-name {
    position: relative;
    z-index: 1;
    color: cyan;
    background-color: rgba(0, 0, 0, 0.7);
    padding: 0.25em 0.5em;
    display: inline-block;
    border-radius: 1em;
}

div.run {
    display: flex;
    flex-direction: column;
    padding: 0.5em;
    box-sizing: border-box;
}

div.run span.level {
    display: flex;
    font-size: 1.2em;
    font-weight: 600;
    justify-content: center;
    letter-spacing: 0.03em;
}
span.level-number {
    #    background: rgba(255, 255, 0, 0.8);
    border: 1px solid rgba(255, 255, 0, 0.3);
    border-radius: 0.4em;
    padding: 0.1em 0.4em;
    display: inline-block;
}

div.run div.run-bottom {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
}
div.run div.run-bottom span.performance {
    margin-top: auto;
    font-size: 0.8em;
    align-self: flex-start;
}
div.run div.run-bottom span.time-offset {
    margin-top: auto;
    font-size: 0.8em;
    align-self: flex-start;
}

div.run div.run-bottom span.score {
    margin-top: auto;
    font-size: 0.8em;
    align-self: flex-end;
}
span.under-par {
    color: lightgreen;
}
span.under-par::after {
    content: "↓";
    margin-left: -.2em;
}
span.over-par {
    color: red;
}
span.under-par::after {
    content: "↑";
    margin-left: -.2em;
}

span.star::after, span.star-2::after, span.star-3::after {
    --star: "✶";
    color: gold;
    position: relative;
    font-size: .9em;
    left: .2em;
    top: -.2em;
}

span.star::after {
    content: var(--star);
}
span.star-2::after {
    content: var(--star)var(--star);
}
span.star-3::after {
    content: var(--star)var(--star)var(--star);
}

td.overall {
    border-left: 2px solid gold;
    border-right: 2px solid gold;
    padding: 0.3em 0.5em;
    box-shadow: inset 0.2em 0.2em 0.5em gold;
}
td.resilient {
    color: gold;
    text-align: center;
}
td.score {
    text-align: center;
}
th {
    font-family: "Avenir";
}





//div.error {color: red; text-align: center; font-size: 25px; margin-bottom: 20px; }