.interview .summary {
    max-height: 0;
    transition: max-height 1s ease-out;
    overflow: hidden;
    margin-left: 16px;
    margin-right: 16px;
}
.interview .summary.open {
    max-height: 10000px;
    margin-bottom: 16px;
}
.interview .summary .timestamp:hover {
    text-decoration: underline;
    cursor: pointer;

}
.interview .summary-toggle {
    font-size: 18px;
    text-align: center;
    margin-bottom: 8px;
    margin-top: -4px;
    cursor: pointer;
}
.interview .summary-toggle.open {
    cursor: pointer;
    margin-top: 4px;
    margin-bottom: 48px;
}
.interview .summary-toggle:hover {
    text-decoration: underline;
}
.interview .name {
    display: none;
    cursor: pointer;
    text-decoration: underline;
}
.interview .name::after {
    content: " (show summary sheet)";
}
.interview .name.open::after {
    content: " (hide summary sheet)";
}

.interview .audio-player {
    max-width: calc(100% - 16px);
}